对于像进度条这样的UI元素的动画,即使在Microsoft文档中,也总是建议(仅)从代码背后工作,如下所示:
await progressBar.ProgressTo(0.75, 500, Easing.Linear);
我找不到从ViewModel中执行此操作的方法,因为不可能(也不打算)从ViewModel中访问XAML元素。我尝试使用BindableProperty进行数据绑定,但无法使其工作。因此,是我的操作有误,还是不可能?
我创建了一个Drawable类:
public class ProgressArcDrawable : GraphicsView, IDrawable
{
public double ArcProgress
{
get => (double)GetValue(ArcProgressProperty);
set => SetValue(ArcProgressProperty, value);
}
public float Stroke
{
get => (float)GetValue(StrokeProperty);
set => SetValue(StrokeProperty, value);
}
public Color ArcColor
{
get => (Color)GetValue(ArcColorProperty);
set => SetValue(ArcColorProperty, value);
}
public static readonly BindableProperty ArcProgressProperty =
BindableProperty.Create(nameof(ArcProgress), typeof(double), typeof(ProgressArcDrawable));
public static readonly BindableProperty StrokeProperty =
BindableProperty.Create(nameof(Stroke), typeof(float), typeof(ProgressArcDrawable));
public static readonly BindableProperty ArcColorProperty =
BindableProperty.Create(nameof(ArcColor), typeof(Color), typeof(ProgressArcDrawable));
public void Draw(ICanvas canvas, RectF dirtyRect)
{
var endAngle = 90 - (int)Math.Round(ArcProgress * 360, MidpointRounding.AwayFromZero);
canvas.StrokeColor = ArcColor;
canvas.StrokeSize = Stroke;
canvas.DrawArc(Stroke / 2, Stroke / 2, (dirtyRect.Width - Stroke), (dirtyRect.Height - Stroke), 90, endAngle, false, false);
}
}
当我使用MVVM工具包时,我在视图模型中创建了ObservableProperties,如下所示:
[ObservableProperty]
double arcProgress;
在我看来,我将drawable与数据绑定集成在一起:
<ContentPage.Resources>
<drawables:ProgressArcDrawable
x:Key="progressArcDrawable"
ArcProgress="{Binding ArcProgress}"
Stroke="20"
ArcColor="{Binding Scrum.ScrumTheme.AccentColor}" />
</ContentPage.Resources>
...
<Grid>
<GraphicsView
Drawable="{StaticResource progressArcDrawable}"
HeightRequest="350"
WidthRequest="350" />
</Grid>
唯一有效的绑定是将笔画设置为离散值。AccentColor绑定适用于页面上的其他元素,因此其中有数据,但不适用于可绘制对象。这对于ArcProgress也是一样的,它应该每秒更改一次进度弧。
1条答案
按热度按时间dsekswqp1#
尝试将
Drawable
与StaticResource
一起使用: