如何改变Xamarin Forms中进度条的高度？

Question

如何ProgressBar在代码中更改Xamarin表单的高度？我正在使用Xamarin Forms V2.1.

.HeightRequest并且.MinimumHeightRequest似乎没有任何效果.默认进度条太薄,甚至可能都没有被注意到.

.BackgroundColor 似乎也没有用.

我在这里错过了什么？

Answer 1

您需要自定义渲染器:

首先为自定义进度条创建一个类:

public class CustomProgressBar :ProgressBar
{
  public CustomProgressBar()
   {
   }
}

然后还为自定义进度条渲染器添加新文件:

对于iOS:

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

        Control.ProgressTintColor = Color.FromRgb(182, 231, 233).ToUIColor();// This changes the color of the progress
    }


    public override void LayoutSubviews()
    {
        base.LayoutSubviews();

        var X = 1.0f;
        var Y = 10.0f; // This changes the height

        CGAffineTransform transform = CGAffineTransform.MakeScale(X, Y);
        Control.Transform = transform;
    }
}

[编辑:根据评论修正以上代码]

对于Android:

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


        Control.ProgressTintList = Android.Content.Res.ColorStateList.ValueOf(Color.FromRgb(182, 231, 233).ToAndroid()); //Change the color
        Control.ScaleY = 10; //Changes the height

    }
}

我希望这可以帮助你!

Answer 2

要使进度条变粗，只需更改 ProgressBar 的 ScaleY 属性即可。

例如：这段代码

<ProgressBar Progress=".5"/>
<ProgressBar ScaleY="2" Progress=".5"/>
<ProgressBar ScaleY="5" Progress=".5"/>

产生这个

请注意，您可能需要相应地调整边距。