如何在Xamarin表单中制作带圆角的进度条

我想在Xamarin表单中显示带圆角的进度条。我能够在iOS中使用自定义渲染器来实现它：如何在Xamarin表单中制作带圆角的进度条

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

我该如何在Android中实现同样的效果？这就是我想要的进度条（圆角）。

来源

2017-09-26 Debasish

能否请你张贴的图片，当你使用'iOS'这个'进步bar'，只有我自己知道？效果可以理解你想要什么。 –

我在原始帖子中添加了一个图像@ YorkShen-MSFT – Debasish

如何使圆角Xamarin的进度条形成

你可以在你的Android ProgressBar添加Drawable来实现此功能。

设置样式为您ProgressBar，绘制对象\ 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>

绘制对象\ progress_bar_background.xml：

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

绘制对象\ shape_progressbar_progress.xml：

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

在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; 
     } 
    } 
}

效果：

来源

2017-09-27 14:31:06

如何在Xamarin表单中制作带圆角的进度条

回答

相关问题