如何更改 Xamarin Forms 中進度條的高度？

Question

如何在代碼中更改 Xamarin Forms ProgressBar的高度？ 我正在使用 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;
    }
}

[編輯：根據評論固定上面的代碼]

對於安卓：

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 BackgroundColor="White" ProgressColor="#BCC7EF" Progress="0.7"> <ProgressBar.ScaleY> <OnPlatform x:TypeArguments="x:Double" iOS="2" Android="1" /> </ProgressBar.ScaleY>

Answer 3

要使進度條更粗，您只需更改 ProgressBar 的 ScaleY 屬性。

例如：此代碼

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

產生這個

請注意，您可能需要相應地調整您的邊距。

Answer 4

@BillF 基本上是正確的

在 iOS 渲染器代碼中嘗試使用

this.Control.Transform = transform; 

而不是

this.Transform = transform;

Answer 5

我遇到了同樣的需求，在最新版本的 Visual Studio 16.5.2 上，我發現要獲得更大的水平條，您只需要在 xml 中的進度條聲明中設置 ScaleY。 為了避免在 Android 上出現故障並確保進度條不會壓倒其他元素，我添加了一個邊距，如下面的聲明所示。

        <ProgressBar
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/progressBar1"
        android:layout_below="@+id/message"
        android:scaleY="8"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp"/>

Answer 6

對我來說，最簡單的解決方案是使用Xamarin.Forms.Visual.Material然后在你的 XAML 中，在進度條中將HeightRequest屬性設置為你想要的，並使用Visual屬性作為 Material。