Wie mache ich einen Fortschrittsbalken mit abgerundeten Ecken in Xamarin Formen

Question

Ich möchte Fortschrittsbalken mit abgerundeten Ecken in Xamarin Formen anzeigen. Ich war in der Lage, es in iOS mit einem benutzerdefinierten Renderer zu tun:

class CustomProgressBarRenderer: ProgressBarRenderer 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ProgressBar> e) 
    { 
     base.OnElementChanged(e); 
     Control.ProgressTintColor = Color.FromRgb(255, 201, 74).ToUIColor(); 
    } 

    public override void LayoutSubviews() 
    { 
     base.LayoutSubviews(); 
     var X = 1.0f; 
     var Y = 7.0f; 
     CGAffineTransform transform = CGAffineTransform.MakeScale(X, Y); 
     this.Transform = transform; 
     this.ClipsToBounds = true; 
     this.Layer.MasksToBounds = true; 
     this.Layer.CornerRadius = 5; // This is for rounded corners. 
    } 
} 

Wie kann ich das gleiche in Android erreichen? So möchte ich den Fortschrittsbalken (abgerundete Ecken) sehen.

Answer 1

Wie einen Fortschrittsbalken mit abgerundeten Ecken in Xamarin machen bildet

Sie könnten ein Drawable auf Ihrem Android ProgressBar hinzufügen, um dieses Feature zu implementieren.

Stellen Sie den Stil für Ihre ProgressBar, Drawable \ bar_color.xml:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <!--set progressbar backgound style--> 
    <item 
     android:id="@android:id/background" 
     android:drawable="@drawable/progress_bar_background" /> 

    <!--set progressbar schedule style--> 
    <item android:id="@android:id/progress"> 
     <scale 
      android:drawable="@drawable/shape_progressbar_progress" 
      android:scaleWidth="100%" /> 
    </item> 

</layer-list> 

Drawable \ progress_bar_background.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <corners android:radius="20dp" /> 
    <solid android:color="#FFCBC2C2" /> 
</shape> 

Drawable \ shape_progressbar_progress.xml:

<corners android:radius="20dp" /> 
    <solid android:color="#3F8CC4" /> 
    <stroke 
     android:width="0dp" 
     android:color="#FFFFFF"></stroke> 
</shape> 

Verwenden Sie es in Ihrem CustomProgressBarRenderer:

public class CustomProgressBarRenderer : ProgressBarRenderer 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ProgressBar> e) 
    { 
     base.OnElementChanged(e); 

     if(Control != null) 
     { 
      var progressBar = Control as Android.Widget.ProgressBar; 
      var draw = Resources.GetDrawable(Resource.Drawable.bar_color); 
      progressBar.ProgressDrawable = draw; 
     } 
    } 
} 

Wirkung: