如何使用自定义渲染器在 Xamarin Forms 中制作带圆角的进度条 [英] How to make a progress bar with rounded corners in Xamarin Forms using Custom Renderer
问题描述
我想以 Xamarin 形式显示带圆角的进度条.我能够使用自定义渲染器在 iOS 中做到这一点:
I want to display progress bar with rounded corners in Xamarin forms. I was able to do it in iOS using a custom renderer:
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 中实现相同的效果.这就是我希望进度条(圆角)的外观.
How can I achieve the same in Android using Custom Renderer. This is how I want the progress bar(rounded corners) to look.
推荐答案
如何在 Xamarin 表单中制作带有圆角的进度条
How to make a progress bar with rounded corners in Xamarin forms
您可以在您的 android ProgressBar
上添加一个 Drawable
来实现此功能.
You could add a Drawable
on your android ProgressBar
to implement this feature.
设置 ProgressBar
的样式,Drawablear_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>
Drawableprogress_bar_background.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="20dp" />
<solid android:color="#FFCBC2C2" />
</shape>
Drawableshape_progressbar_progress.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<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;
//below is now deprecated
//var draw = Resources.GetDrawable(Resource.Drawable.bar_color);
var draw = Context.GetDrawable(Resource.Drawable.bar_color);
progressBar.ProgressDrawable = draw;
}
}
}
效果:
这篇关于如何使用自定义渲染器在 Xamarin Forms 中制作带圆角的进度条的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!