Android прогресс бар с прокладкой

Question

Я хочу, чтобы мой прогресс бар выглядит так:

Я не хочу использовать изображения, так что я пытался сделать это с формами:

<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> 

Но я не могу установить прокладку для зеленой линии (Ive пытался установить ее везде, где это было возможно), а также я не могу сделать такие круглые углы (выглядит как corners android:radius не работает). Пожалуйста, помогите мне

Answer 1

К сожалению, я не нашел решения для своей проблемы. Единственный способ, которым я мог бы сделать круглые углы, чтобы использовать округлую 9-шаг изображение

Существует хороший учебник, чтобы сделать это: http://blog.mediarain.com/2011/04/android-custom-progressbar-with-rounded-corners/

Answer 2

Простое решение является обертывание прогресс бар в макете, который имеет округлую форму и тот же цвет фона в качестве индикатора выполнения.

Sample прогресс бар вытяжке (рисуем/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> 

Прогресс бар стиль:

<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> 

Макет формы (рисуем/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> 

Оперативная площадь:

<!-- ... --> 
     <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> 
<!-- ... --> 

Эффект:

Чтобы увеличить отступы прогресс бар вы должны увеличить отступы в 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

Да, это возможно, чтобы иметь точно, что без использования изображения как @Nykakin предложил. Чтобы иметь прокладку и округленный угол , для достижения прогресса необходимо использовать слой списка для улучшения позиции.

<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>