Android的进度UI自定义布局

Question

我想自定义状态栏，以便它看起来这样的形象：

但是，一个良好的几个小时我只有后一个状态栏，与我只需要在后台（图像2）：

当前代码我是： XML布局：

<ProgressBar 
       android:id="@+id/pBarOverallStatus" 
       style="?android:attr/progressBarStyleHorizontal" 
       android:layout_width="0dip" 
       android:layout_height="fill_parent" 
       android:layout_marginLeft="10dip" 
       android:layout_marginRight="10dip" 
       android:layout_weight="94" 
       android:indeterminateOnly="false" 
       android:max="100" 
       android:progressDrawable="@drawable/progress_bar_states" > 
      </ProgressBar> 

的progress_bar_states.xml：

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 

    <!-- <item android:id="@android:id/progress"> 
     <bitmap 
      android:gravity="center" 
      android:src="@drawable/progressbar_progressing" /> 

     <corners android:radius="10dp" /> 
    </item> 
    --> 

</layer-list> 

删除注释，其中proressbar_progressing看起来像 然后我有东西有点难看，因为没有角落。

我加入从代码的背景下，这样的：

overallStatus = (ProgressBar) findViewById(R.id.pBarOverallStatus); 
Resources res = getResources(); 
overallStatus.setBackgroundDrawable(res.getDrawable(R.drawable.progressbar_background)); 
overallStatus.setProgress(50); 

我试图角落添加到图像，但没有运气。 有没有人知道我在做什么错在这里？或者我错过了什么？ 另外，你有什么想法，我怎么可以添加左，右环？资源：

Answer 1

的解决方案（感觉怪异的回答你自己）： 首先，一个问题米是进展drawable有不同的背景大小（愚蠢的我！）。此外，对于可绘制的进度，需要一个剪贴片xml。喜欢的东西progressbar_progress_clip.xml：

<?xml version="1.0" encoding="utf-8"?> 
<clip 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:drawable="@drawable/progressbar_progressing" 
    android:clipOrientation="horizontal" 
    android:gravity="left"/> 

然后，添加在相对布局的进度条和两个图像，使图像可以在状态栏后得出。就像这样：

<RelativeLayout 
       android:id="@+id/relativeLayout1" 
       android:layout_width="0dip" 
       android:layout_height="fill_parent" 
       android:layout_marginLeft="10dip" 
       android:layout_marginRight="10dip" 
       android:layout_weight="94" > 

       <ProgressBar 
        android:id="@+id/pBarOverallStatus" 
        style="?android:attr/progressBarStyleHorizontal" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent" 
        android:layout_marginBottom="2dp" 
        android:layout_marginTop="2dp" 
        android:indeterminateOnly="false" 
        android:max="100" 
        android:progressDrawable="@drawable/progressbar_progress_clip" > 
       </ProgressBar> 

       <ImageView 
        android:id="@+id/ringLeft" 
        android:layout_width="wrap_content" 
        android:layout_height="fill_parent" 
        android:layout_alignParentLeft="true" 
        android:layout_centerVertical="true" 
        android:layout_marginLeft="7dp" 
        android:contentDescription="@string/status_bar_ring" 
        android:src="@drawable/status_bar_ring" /> 

       <ImageView 
        android:id="@+id/ringRight" 
        android:layout_width="wrap_content" 
        android:layout_height="fill_parent" 
        android:layout_alignParentRight="true" 
        android:layout_centerVertical="true" 
        android:layout_marginRight="7dp" 
        android:contentDescription="@string/status_bar_ring" 
        android:src="@drawable/status_bar_ring" /> 
      </RelativeLayout> 

谢谢，伙计们！

Answer 2

首先创建一个新的可绘制的XML文件：

<?xml version="1.0" encoding="UTF-8"?> 
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 

    <corners 
     android:bottomRightRadius="7dp" 
     android:bottomLeftRadius="7dp" 
     android:topLeftRadius="7dp" 
     android:topRightRadius="7dp"/> 

</shape> 

然后在你的布局，下面的属性添加到您的进度条：

android:background="@drawable/the_file_you_previously_created"

Answer 3

您可以使用ImageView制作一个FrameLayout来保存绘图并将其alpha值设置为较低值。然后在同一个FrameLayout中用ClipDrawable创建一个ProgressBar。并在您的进度更新中设置ClipDrawable的值。

代码：

<FrameLayout 
     android:layout_gravity="center" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

    <ProgressBar 
     android:max="100" 
     android:id="@+id/progress_bar" 
     android:layout_gravity="center" 
     style="?android:attr/progressBarStyleHorizontal" 
     android:layout_width="200dp" 
     android:layout_height="200dp" 
     android:progressDrawable="@drawable/custom_progress_image" 
     android:layout_marginRight="5dp" /> 

     <ImageView 
      android:alpha="0.4" 
      android:src="@drawable/app_logo" 
      android:layout_gravity="center" 
      android:layout_width="200dp" 
      android:layout_height="200dp" /> 
</FrameLayout>