xamarin.forms - Lottie 动画作为加载指示器 - Xamarin.forms
问题描述
我有一个 xamarin 表单应用程序,其中包含使用microcharts的饼图。图的数据是从 Web API 获得的。一切正常。每次图形从 Web API 加载数据时,都会有一些延迟。所以图形的出现也需要时间。我想要做的是在图表出现之前使用Lottie 动画作为加载指示器。动画显示但它会闪烁并加载图表。
我做了什么
我的 xml
<Grid>
<forms1:AnimationView
x:Name="AnimationView"
Animation="graphloading.json"
AutoPlay="True"
Margin="10"
BackgroundColor="Transparent"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand" />
<forms:ChartView x:Name="Chart1" isVisible="False"
HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"/>
</Grid>
我的 Xaml.cs 文件
protected override async void OnAppearing()
{
await LoadDynamicGraph();
}
private async Task LoadDynamicGraph()
{
await Task.Run(() =>
{
// Graph Loading API call code
if (GraphDataObj[0] != null)
{
Device.BeginInvokeOnMainThread(() =>
{
AnimationView.IsPlaying = false;
AnimationView.IsVisible = false;
Chart1.IsVisible = true;
foreach (var item in GraphDataObj[0].DailyScore)
{
FirstGraphData = new List<ChartEntry>
{
new ChartEntry(float.Parse(item.CompletedItems))
{
Label = "Completed",
// ValueLabel = item.CompletedItems,
Color = SKColor.Parse("#c90484"),
TextColor = SKColor.Parse("#FFFFFF"),
},
new ChartEntry(float.Parse(item.TotalOpenItems))
{
Label = "Total ",
// ValueLabel = item.TotalOpenItems,
Color = SKColor.Parse("#00a8f3"),
TextColor = SKColor.Parse("#FFFFFF"),
}
};
}
Chart1.Chart = new PieChart()
{
Entries = FirstGraphData,
BackgroundColor = SKColor.Parse("#002F4F4F")
};
});
}
});
}
目前,动画只是出现并消失。我想让它显示一些时间,然后加载图表。任何帮助表示赞赏。
解决方案
设置这个
AnimationView.IsPlaying = false;
AnimationView.IsVisible = false;
Chart1.IsVisible = true;
在您的功能结束时。它仍然会很快。你可以尝试设置一次计时器。
finish = true;
Device.StartTimer(TimeSpan.FromSeconds(5), () =>
{
If(finish){
finish = false;
return true;}
//there turn off your animation
return false;
});
推荐阅读
- c++ - 有没有办法使用 C++ 实时阅读文本?
- laravel - 如何在控制器之间创建验证码会话
- python - python pandas:将字典转换为长格式,计数基于字符串变量的不同值
- c# - 在 C# 中指向或反射到对象
- python - 使用 matplotlib 制作堆栈图时出现“Keyerror”
- ios - 未调用具有 Firebase 消息回调的 Flutter 插件
- yocto - 构建 gcc-cross 失败,没有提供“gcc-cross”
- python - 如何从python中的列表中计算单词列表
- r - 如何在河图中使我的字体变小?
- reactjs - reactjs中如何根据条件隐藏按钮