barra de progreso Android con relleno

Question

Quiero hacer mi barra de progreso se ve algo así:

no quiero utilizar las imágenes, por lo que he tratado de hacer esto con las formas:

<item android:id="@android:id/background"> 
    <shape> 
     <corners android:radius="50dp" /> 

     <gradient 
      android:angle="270" 
      android:centerColor="#2a2723" 
      android:centerY="0.75" 
      android:endColor="#2a2723" 
      android:startColor="#2a2723" /> 
    </shape> 
</item> 
<item android:id="@android:id/secondaryProgress"> 
    <clip> 
     <shape> 
      <corners android:radius="50dp" /> 

      <gradient 
       android:angle="270" 
       android:centerColor="#16e61c" 
       android:centerY="0.75" 
       android:endColor="#9dfd6e" 
       android:startColor="#16e61c" /> 
     </shape> 
    </clip> 
</item> 
<item android:id="@android:id/progress"> 
    <clip> 
     <shape> 
      <corners android:radius="50dp" /> 

      <gradient 
       android:angle="270" 
       android:endColor="#9dfd6e" 
       android:startColor="#16e61c" /> 
     </shape> 
    </clip> 
</item> 

Pero no puedo configurar el relleno para la línea verde (he intentado configurarlo donde sea posible), y tampoco puedo hacer esas esquinas redondeadas (parece que corners android:radius no funciona). Por favor, ayúdenme

Answer 1

Lamentablemente no encontré la solución para mi problema. La única manera de que pudiera hacer esquinas redondeadas era utilizar la imagen 9 de paso redondeada

Hay un buen tutorial para hacer eso: http://blog.mediarain.com/2011/04/android-custom-progressbar-with-rounded-corners/

Answer 2

Una solución sencilla es envolver barra de progreso en la disposición que se forma redondeada y el mismo color de fondo como barra de progreso.

Muestra barra de progreso estirable (dibujable/progress_bar.xml):

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:id="@android:id/background"> 
     <shape> 
      <corners android:radius="50dip" /> 
      <solid android:color="@color/white"/> 
      <padding android:bottom="3dip" android:left="3dip" android:right="3dip" android:top="3dip" /> 
     </shape> 
    </item> 

    <item android:id="@android:id/progress"> 
     <bitmap android:src="@drawable/test_progress_bar_progress" android:tileMode="repeat"/> 
    </item> 
</layer-list> 

estilo Barra de progreso:

<resources> 
    <style name="ProgressBarStyle" parent="@android:style/Widget.ProgressBar.Horizontal"> 
     <item name="android:layout_width">fill_parent</item> 
     <item name="android:layout_height">10dip</item> 
     <item name="android:max">100</item> 
     <item name="android:progressDrawable">@drawable/progress_bar</item> 
    </style> 
</resources> 

forma Layout (dibujable/rounded_shape.xml):

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> 
    <padding android:top="2dip" android:left="2dip" android:right="2dip" android:bottom="2dip"/> 
    <corners android:bottomRightRadius="7dp" android:bottomLeftRadius="7dp" android:topLeftRadius="7dp" android:topRightRadius="7dp"/> 
    <solid android:color="@color/white"/> 
</shape> 

Distribución de la actividad:

<!-- ... --> 
     <LinearLayout      
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:background="@drawable/rounded_shape" 
        android:layout_marginLeft="30dip" 
        android:layout_marginRight="30dip"> 
      <ProgressBar 
        android:id="@+id/testSummaryProgressBar" 
        android:progress="10" 
        style="@style/ProgressBarStyle"/> 
     </LinearLayout> 
<!-- ... --> 

Efecto:

Aumentar el acolchado de la barra de progreso tiene que aumentar el relleno en el archivo rounded_shape.

Answer 3

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:id="@android:id/background"> 
     <shape> 
      <solid android:color="#222" /> 
      <corners android:radius="10dp" /> 
     </shape> 
    </item> 
    <item android:id="@android:id/progress"> 
     <clip> 
      <layer-list> 
       <item> 
        <color android:color="#00000000" /> 
       </item> 
       <item 
        android:left="5dp" 
        android:top="5dp" 
        android:right="5dp" 
        android:bottom="5dp"> 
        <shape> 
         <solid android:color="#00FF00" /> 
         <corners android:radius="10dp" /> 
        </shape> 
       </item> 
      </layer-list> 
     </clip> 
    </item> 
</layer-list> 

see my blog

Answer 4

Sí, es posible tener exactamente eso sin usar la imagen como @Nykakin ha sugerido. Para tener el relleno y el esquina redondeada para el progreso es usar list-layer para el progreso del elemento.

<item android:id="@android:id/progress"> 
<clip> 
    <layer-list> 
     <-- transparent background --> 
    <item> 
     <color android:color="#00000000" /> 
    </item> 
    <-- padding --> 
    <item 
     android:left="2dp" 
     android:top="2dp" 
     android:right="2dp" 
     android:bottom="2dp"> 
    <shape> 
     <corners android:radius="50dp" /> 

     <gradient 
      android:angle="270" 
      android:endColor="#9dfd6e" 
      android:startColor="#16e61c" /> 
    </shape> 
    </item> 
    </layer-list> 
</clip>