Xamarin 表单中带有百分比文本的进度条

Question

我正在尝试使用 Xamarin forms PCL 项目构建一个应用程序，我需要在其中显示一个进度条，旁边填充了 % 文本，就像这样-

我试过框视图，但我很难按照我的百分比设置它的宽度。

进度条我也试过了-

  <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="0" Padding="10,0,10,0">
            <ProgressBar BackgroundColor="Transparent"  Progress="0.08"  HorizontalOptions="FillAndExpand" HeightRequest="20"/>
            <Label Text="25"></Label>
          </StackLayout>

有人知道如何实现吗？

Answer 1

在这种情况下，您必须使用带有 2 个子进度条和标签的绝对布局或相对布局，并根据进度更改文本属性。

Answer 2

将 ProgressBar 和 Label 都放入 Grid 容器中。网格容器将多个元素放置在彼此之上。接下来设置标签左边的Margin相对于进度条的百分比。您可能需要 fiddle 精确的边距才能使其正确对齐。

示例：

<Grid Grid.Row="0" Grid.Column="0" Padding="10,0,10,0">
    <ProgressBar BackgroundColor="Transparent"  Progress="0.08"  HorizontalOptions="FillAndExpand" HeightRequest="20"/>
    <Label Text="25" Margin="80,0,0,0"></Label>
</Grid>

Xamarin 表单中带有百分比文本的进度条

Progressbar with Percentage Text in Xamarin forms

c#

portable-class-library

progress-bar

xamarin.forms