android四边进度条,[教程] FMX-实现简单的环形进度条

谁说进度条一定要是长长的一条？太三俗，特三俗！今天，利用 FMX 我们来做一个环形的进度条。

1、创建一个空白的 FMX 应用(这个步骤略过了，New->Project->Delphi Project->Multi-Device Application)；

2、放一个TCircle，我们命名为clBase，将 Stroke 的 Kind 属性设置为 None，Fill 属性修改下，给我们一个喜欢的发型，比如玩下渐变(Kind 属性改为Gradient，然后设置 Gradient 属性调整激变的配色)，另外设置下 Width 和 Height 为同样的值；

3、再放一个TCircle，将它的父调整为clBase，我们命名为clMask，Align 设置为 Client，然后将Stroke同样设置为None，然后设置设置 Fill 属性修改下，做为环形的内圈。为了形成环形，我们将clMask的Margins的四边都设置成10，缩进就保留出了环的位置了。

4、再放一个TArc，将它的父调整为clBase，我们命名为acProgress，Align 设置为 Client，设置 Stroke 的 Thickness 值为10。设置它的颜色为半透明，比如 #80000000。由于我们习惯顺时针从正中算0，所以设置 StartAngle 为 -90，EndAngle 设置先随便设置一个值，如45.

5、再放一个 TLabel，将它的父调整为clBase，我们命名为lblHint，设置 Align 为Center，TextSettings 的 HorizAlign 也为 Center，Text 设置为 0%。

好了，上面的一切就绪，我们先看一下大概的效果：

我们现在为了演示进度条的实际效果，我们在 acProgress.EndAngle 上添加一个 FloatAnimation(我们命名为faProgress)，让它从 0->360 之间变化，Duration 设置的稍长一点，比如5秒，Enabled 设置为True，Trigger 改为 Visible=True，其它属性看着设置就好。在FloatAnimation.OnProcess 事件中，添加下面的代码来更新 lblHint 的文本：

Delphi/Pascal

procedure TForm1.faProgressProcess(Sender: TObject);

begin

lblHint.Text:=IntToStr(Trunc(acProgress.EndAngle*100/360))+'%';

end;

1

2

3

4

procedureTForm1.faProgressProcess(Sender:TObject);

begin

lblHint.Text:=IntToStr(Trunc(acProgress.EndAngle*100/360))+'%';

end;

OK，现在运行程序看效果吧，我抓一个 Windows 平台下的动画截图参考效果：

好了，为了重用这个东西，你可以将它做成一个Frame，然后加一个 Progress 属性来来代替动画来修改进度和提示。附上 全部源码