效果:
目标:
1、向左滑动,环形进度条从0%--100%
2、向右滑动,环形进度条从100%--0%
思路:
1、放置3个arc组件,rotationangle设置为270,stroke的thickness设为30;
2、放置gesturemanager组件和actionlist。
属性设置:
arc1,arc2,arc3(正反动画组件1组,共3组)
object Arc1: TArc //3个arc组件
Position.X = 104 //位置
Position.Y = 40
RotationAngle = 270 //旋转角度,使得符合设计人员的习惯
Size.Width = 185 //弧度的度数
Size.Height = 185//弧度的度数
Stroke.Color = claBlue //弧度的颜色
Stroke.Thickness = 10 //弧度的宽度
EndAngle = 360
object FloatAnimation1: TFloatAnimation //动画效果
AnimationType = Out
Duration = 10
Interpolation = Sinusoidal
PropertyName = 'EndAngle'
StartValue = 0 //开始0%
StopValue = 360 //结束100%
end
object FloatAnimation2: TFloatAnimation //同floatanimation1,相反:100%--0%
AnimationType = Out
Duration = 10
Interpolation = Sinusoidal
PropertyName = 'EndAngle'
StartValue = 360
StopValue = 0
end
end
gestturemanager1:
actionlist1:
//actup
actup.Name := 'actup';
actup.Text := 'actup';
actup.OnExecute := actupExecute;
//actdown
actup.Name := 'actdown';
actup.Text := 'actdown';
actup.OnExecute := actdownExecute;
代码:
procedure TForm1.actdownExecute(Sender: TObject);
begin
Self.FloatAnimation2.Enabled := True;
Self.FloatAnimation4.Enabled := True;
Self.FloatAnimation6.Enabled := True;
end;
procedure TForm1.actupExecute(Sender: TObject);
begin
self.FloatAnimation1.Enabled := True;
self.FloatAnimation2.Enabled := True;
self.FloatAnimation3.Enabled := True;
end;
代码下载:
链接:https://pan.baidu.com/s/1AVaaHyMci5bDRw1paNylhw
提取码:bhpd