设置进度条Android的样式

Question

我在设置进度条时遇到了问题。

基本上，我想像这样设计背景：

和这样的进展：

然而，我能得到的壁橱是这样的:(即只是一个黑色边框，周围没有白线）

表示设置进度后，结果如下：

这是一团糟！

我正在使用图层列表来尝试实现这种效果，但是当我尝试将项目分层以获得进展时它不起作用，我花了几个小时尝试各种各样的事情，但是我＆＃39 ;我没有接近解决方案，我确定它与剪辑功能有关，但这是必需的，否则进度不会改变。

我当前的XML在下面，请注意，当我添加另一个带有白色轮廓的项目时，这将显示绿色进度条，因为它只有黑色边框而不是白色轮廓失去整个进度条！：

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

    <!-- Define the background properties like color and border etc (RED background with 2dp black border and overlaid 1dp white border ) -->
    <item android:id="@android:id/background">
    <shape>
         <solid android:color="#FF0000" />
        <stroke android:width="2dp" android:color="#000000" />
    </shape>

   </item>
       <!-- add our white outline over the top-->
    <item android:id="@android:id/background">
    <shape>
        <stroke android:width="1dp" android:color="#FFFFFF" />
    </shape>

   </item>


       <!-- for the actual progress bar add our colour and border-->
  <item android:id="@android:id/progress"> 
    <clip android:gravity="left">
        <shape>  
            <solid android:color="#00FF00" />
            <stroke android:width="2dp" android:color="#000000" />       
        </shape>    
    </clip>
    </item>    

</layer-list> 

现在，如果我将以下内容添加到上面的xml的底部，我会失去整个进度条，而且我没有像我期望的那样获得白色轮廓。

  <item android:id="@android:id/progress"> 
    <clip android:gravity="left">
        <shape>  
            <stroke android:width="1dp" android:color="#FFFFFF" />       
        </shape>    
    </clip>
    </item>  

有没有人对如何实现这一点有任何想法？

Answer 1

如果有人最终在这里寻找答案，我无法在XML中执行此操作，并且不得不求助于使用9补丁图像来使其工作。一旦你了解了9补丁图像格式，它就能很好地工作。

我使用了优秀的webtool：

http://romannurik.github.io/AndroidAssetStudio/nine-patches.html

生成我的。

然后编辑xml：

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

    <item android:id="@android:id/background">
    <nine-patch android:src="@drawable/progressbackground" />
   </item>


    <item android:id="@android:id/progress">
        <clip xmlns:android="http://schemas.android.com/apk/res/android"
            android:clipOrientation="horizontal"
            android:gravity="left">
            <nine-patch android:src="@drawable/progress" />
        </clip>
    </item>


</layer-list> 

它有效......

Answer 2

可以使用xml：

进行

<?xml version="1.0" encoding="utf-8"?>

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

<item >
    <shape android:shape="rectangle">

        <padding android:left="1dp"
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"/>

        <solid android:color="@android:color/white"/>

    </shape>
</item>
<item >
    <shape android:shape="rectangle">

        <padding android:left="1dp"
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"/>

        <solid android:color="@android:color/black"/>

    </shape>
</item>
<item >
    <shape android:shape="rectangle">


        <solid android:color="#d4413a"/>

    </shape>
</item>

<item android:id="@android:id/secondaryProgress">
    <clip>
        <shape>
            <solid android:color="@color/green"/>
        </shape>
    </clip>
</item>

<item android:id="@android:id/progress">
    <clip>
        <shape>
            <solid android:color="@color/green"/>
        </shape>
    </clip>
</item>

</layer-list>