progresso blu sottile barra

Question

Sto cercando di creare un sottile barra blu di avanzamento, simile a questo:

Non sono così bravo con Drawables, ma quello che ho cambia il ProgressBar a verde, ma non sono sicuro di come renderlo sottile e blu:

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:orientation="vertical" 
    > 
     <ProgressBar 
     android:id="@+id/ProgressBar" 
     android:layout_centerInParent="true" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:progressDrawable="@drawable/progress" 
     style="@android:style/Widget.ProgressBar.Horizontal" 
     android:visibility="gone" 
    /> 

</LinearLayout> 

Drawable

<?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="5dip" /> 
      <gradient 
        android:startColor="#ff9d9e9d" 
        android:centerColor="#ff5a5d5a" 
        android:centerY="0.75" 
        android:endColor="#ff747674" 
        android:angle="270" 
      /> 
     </shape> 
    </item> 

    <item android:id="@android:id/secondaryProgress"> 
     <clip> 
      <shape> 
       <corners android:radius="5dip" /> 
       <gradient 
         android:startColor="#80ffd300" 
         android:centerColor="#80ffb600" 
         android:centerY="0.75" 
         android:endColor="#a0ffcb00" 
         android:angle="270" 
       /> 
      </shape> 
     </clip> 
    </item> 
    <item 
     android:id="@android:id/progress" 
    > 
     <clip> 
      <shape> 
       <corners 
        android:radius="5dip" /> 
       <gradient 
        android:startColor="#33FF33" 
        android:endColor="#008000" 
        android:angle="270" /> 
      </shape> 
     </clip> 
    </item> 

</layer-list> 

Answer 1

L'altezza è definita dall'attributo android:layout_height="wrap_content. Ad esempio, è possibile impostarlo su 2 dpi, per creare una barra di avanzamento più sottile.

Cambiare il colore sarà un po 'più difficile, dal momento che si utilizzano gradienti. Quindi dovrai cambiare il colore iniziale & in un qualche tipo di blu.

quello che sto usando

<ProgressBar 
    android:id="@+id/progressbar" 
    style="?android:attr/progressBarStyleHorizontal" 
    android:layout_width="match_parent" 
    android:layout_height="4dp" 
    android:layout_marginTop="0.01dp" 
    android:max="100" 
    android:progress="50" 
    android:progressDrawable="@drawable/myprogressbar" 
    android:secondaryProgress="0" /> 

MyProgressBar.xml nella cartella drawable

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:id="@android:id/background"> 
     <shape> 
      <corners android:radius="0dip" /> 
      <gradient android:startColor="#C0C0C0" android:centerColor="#F8F8FF" 
       android:centerY="0.75" android:endColor="#ffffff" android:angle="90" /> 
      <stroke android:width="0.01dp" android:color="#6B8E23" /> 
     </shape> 
    </item> 
    <item android:id="@android:id/progress"> 
     <clip> 
      <shape> 
       <corners android:radius="0dip" /> 
       <gradient android:startColor="#9ACD32" android:endColor="#FFFF00" 
        android:angle="90" /> 
       <stroke android:width="1dp" android:color="#6B8E23" /> 
      </shape> 
     </clip> 
    </item> 
</layer-list> 

Sostituire i codici di colore con i propri codici di colore blu:

android: startColor = "# C0C0C0" android : CenterColor = "# F8F8FF" Android: EndColor = "# ffffff"