|
实现效果:点击"加载"按钮开始动作,进度条动态滚动。加载完毕后显示完成。
【第一步】绘制界面:
1、插入活动面板,设置其高度、宽度。
2、在活动面板中插入背景矩形框。
3、增加“加载”的按钮。
【第二步】增加遮罩条(进度条)
1、在活动面板中再次插入与背景矩形大小相当的矩形,设置其背景颜色。用以当作进度条显示使用。
2、设置遮罩条的X坐标绝对位置。将X坐标设置成负的W值。也就是说宽度往左移动一个身位。使其不显示,但又刚好在背景条的左边。
【第三步】增加进度条加载的各步骤提示
新建一个活动面板,添加三层,第一层为“点击按钮进行加载”(默认显示),第二层为“加载中...”,第三层为“加载完毕”。
【第四步】添加“加载”按钮事件
1、在加载按钮触发时显示活动面板为第二层“加载中...”。
2、设置遮罩条往右水平移动。
3、在遮罩条移动完毕后显示活动面板为第三层“完载完毕”。
【第五步】加载完毕,演示效果
总结:
本案例采用两个矩形利用面板显示区域的绝对位置布局,然后进行矩形移动,进行遮罩另一个矩形。达到滚动条效果。
|
|