在 Xamarin Android 上更改比例时进度条模糊

Question

更改比例 Y=10。在我见过的例子中，它长得很整齐，但在我的例子中，它变得异常大。这可能是一个错误吗？

这是我所指内容的链接。

参考

<ContentView
    x:Class="POP.Controls.CtrlBlurProgress"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:Lang="clr-namespace:KLAB.Localizations.Words;assembly=Localizations"
    xmlns:controls="clr-namespace:POP.Controls"
    xmlns:input="clr-namespace:Plugin.InputKit.Shared.Controls;assembly=Plugin.InputKit"
    xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
    BackgroundColor="{StaticResource ColorBackBlur}">


    <StackLayout
        Grid.Row="0"
        Grid.Column="0"
        Margin="10,0,10,0"
        HorizontalOptions="FillAndExpand"
        Orientation="Vertical"
        VerticalOptions="FillAndExpand">

        <Label x:Name="xTitle"
            FontAttributes="Bold"
            FontSize="45"
            HorizontalOptions="FillAndExpand"
            HorizontalTextAlignment="Center"
            Text="테스트 중"
            TextColor="{StaticResource ColorText111}"
            VerticalOptions="EndAndExpand"
            VerticalTextAlignment="Center" />

        <controls:CtrlProgressBar x:Name="xPrgs"
            Margin="20,0,20,0"
            HorizontalOptions="FillAndExpand"
            VerticalOptions="EndAndExpand" />

        <controls:CtrlButton
            Grid.Row="0"
            Grid.Column="1"
            Margin="0,0,10,10"
            Clicked="CtrlButton_Clicked"
            HeightRequest="80"
            HorizontalOptions="End"
            Text="{x:Static Lang:General.Cancel}"
            WidthRequest="300" />

    </StackLayout>
</ContentView>

我添加了我的示例代码。请参考它。

<Grid
    x:Class="POP.Controls.CtrlProgressBar"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>


    <ProgressBar x:Name="xPrg"
        Grid.Row="0"
        Grid.Column="0"
        Margin="10,0,0,10"
        HorizontalOptions="FillAndExpand"
        Progress="0.8"
        ProgressColor="{StaticResource ColorBack008}"
        ScaleY="15"
        VerticalOptions="FillAndExpand" />

    <Label x:Name="xTxtPercent"
        Grid.Row="0"
        Grid.Column="0"
        FontSize="40"
        HorizontalTextAlignment="Center"
        Text="0 %"
        TextColor="White"
        VerticalTextAlignment="Center" />
</Grid>

进度条创建为继承自网格布局的类（CtrlProgressBar），与CtrlBlurProgress类中的其他控件结合使用。

Answer 1

您是否尝试过您提供的链接中的答案？我创建了一个新样本进行测试。如：

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

HeightRequest 是进度条的最大高度。而ScaleY可以改变进度条的粗细。

所以你可以在没有自定义渲染器的情况下使用两个属性的不同值来获得你想要的进度条效果。如：

<ProgressBar HeightRequest="50" ScaleY="2" Progress=".5"/>
<ProgressBar HeightRequest="50" ScaleY="5" Progress=".5"/>
<ProgressBar HeightRequest="80" ScaleY="3" Progress=".5"/>

Answer 2

你项目中的进度条没有高度要求的值。而且 scale.y 的值太大了。

所以你可以尝试为高度请求属性设置一个值。并减小 scale.y 的值。如：

<Grid
    x:Class="POP.Controls.CtrlProgressBar"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>


    <ProgressBar x:Name="xPrg"
        Grid.Row="0"
        Grid.Column="0"
        HeightRequest="30"
        Margin="10,0,0,10"
        HorizontalOptions="FillAndExpand"
        Progress="0.8"
        ProgressColor="{StaticResource ColorBack008}"
        ScaleY="5"
        VerticalOptions="FillAndExpand" />

    <Label x:Name="xTxtPercent"
        Grid.Row="0"
        Grid.Column="0"
        FontSize="40"
        HorizontalTextAlignment="Center"
        Text="0 %"
        TextColor="White"
        VerticalTextAlignment="Center" />
</Grid>

另外，真的不建议大家把laber和进度条放在同一行同一列