`
Virgo_S
  • 浏览: 1151186 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

简单的等待进度条

    博客分类:
  • .NET
阅读更多

最近我需要制作一些简单的进度条以显示“等待状态”(就像Vista里这样:

)。 Microsoft Expression Blend 使你能在一分钟甚至更少的时间内就完成具有非常眩目效果的动画。
我将向你展示如何制作非常简单的连续动画,并针对制作快速动画给出一些提示。
在你继续之前的最小要求是: 这篇文章并不是写给菜鸟的, 这意味着你在操作 Microsoft Expression Blend上必须具有一些基本的知识和经验。
1. 绘图
使用工具: Microsoft Expression Blend 1/2/3
打开 Microsoft Expression Blend 并创建一个新的WPF应用程序工程。(如果是创建Silverlight应用程序,在Blend的Window菜单下没有Trigger菜单,只有WPF应用程序才有)
在主窗体中绘制两个圆形。
选择 椭圆形 并按住 Shift键 来画出正圆 (小圆的半径大约是大圆的60%).





2. 对齐
现在我们要把小圆对齐在大圆的中心。
选择两个圆并单击鼠标右键, 然后选择 对齐 > 水平居中 和 对齐 > 垂直居中 。



3. 合并
现在要将两圆合并成为一个图形。
选择两圆,然后单击鼠标右键,选择 合并 > 排除重叠 。



4. 填充颜色
先来填充背景色:
我们选择自己喜好的色彩,然后用 渐变画笔 来填充。一侧颜色深一些,另一侧颜色浅一些,可以设置成半透明。





再来填充轮廓的颜色:

是用纯色画笔或者渐变画笔均可 (也可以设置成半透明)。





现在就要转换这一环状图形成为控件了。

在图形上单击鼠标右键,然后选择 生成控件 。




这样 Microsoft Expression Blend就会从我们声明的图形来创建一个新的用户控件 (并且用我们生成的实例“ucWaiting”替换 “Window1”中的图形路径)。




现在,在你继续下面的工作之前,必须重新生成一下工程,以更新控件的引用。
5. 创建简单的旋转动画
由于控件必须在其加载事件触发时就播放连续动画,所以我建议从触发器面板中添加一个新的事件触发器来新建一个 stroryboard。

单击在 触发器 面板上的 + 事件 按钮 , Microsoft Expression Blend 将会添加一个默认的事件 'Loaded' (即当控件在可见的父容器中加载时就触发事件)。
再单击 + 按钮 并在弹出的询问你是否创建新的Stroryboard(动画)的对话框中单击 确定。




这些操作将会在 时间线 上创建一个叫做 “OnLoaded1” 的新的storyboard (动画)。
这时 Microsoft Expression Blend会自动切换到 时间线记录模式, 单击 红色的圆 以关闭该模式(见图中标注):


通过在时间线中录制新的关键帧,来保存当前图形的位置。放大时间线,并将坐标移动到 0.5秒 的位置。选择图形,也就是我们的环状控件,然后单击上述步骤中的红色的圆,开始录制动作。



将图形旋转360度 (按住 Shift键 来旋转45度。 每个运动阶段个旋转一次。)。 在一个周期完成后,关闭录制模式。这时你可以通过 播放 按钮来预览动画了。




Storyboard 包含了 两个关键帧 的动画, 动画又使得图形产生了简单的旋转。这一动画将在 Load 事件触发时开始播放。

6. 连续的动画

在上一步的基础上我们再来制作连续的动画:

在对象和时间线面板中展开 “path” 对象,再展开 “RenderTransform” 和 “Rotation” 动画。在 “Angle” 上单击右键,并选择 “编辑重复次数”。
在打开的“编辑重复” 窗口中单击 “设置为永久的” 图形按钮, 然后单击 “确定” 关闭对话框。




这样动画就用永远地播放下去了。
7.完成

最后,在主窗体中调整控件的大小,然后测试工程。
设置控件的大小为 24x24 像素,然后按 F5键 进行测试

现在它彻底完成了!

>> 当然你也可以通过添加额外的函数、属性来扩展这个控件 (比如一个 boolean 类型的属性'EnableAnimation' 或者 'ContinuouseAnimation'), 还可以使用更多更眩目的图形设计或者颜色。
提示…
以下是有关动画的一些提示:
这个子菜单允许你通过更简单的方式创建动画:


许多初学者对这些选项不熟悉:

[复制] - 复制选中的动画,在你想要复制已经存在的动画时非常有用

[反转] - 反转关键帧,在你想要反转关键帧或者通过反转关键帧复制某些动画时非常有用。比如, 一个动画用于显示某些 GUI 元素, 而另一个又用于隐藏这一元素;这时你就可以创建一个显示的动画,然后通过复制反转关键帧的动画来制作隐藏的动画。
希望这篇文章对你能有帮助 ;-)
  • 大小: 11.2 KB
  • 大小: 903 Bytes
  • 大小: 10.5 KB
  • 大小: 7.8 KB
  • 大小: 9.5 KB
  • 大小: 17.6 KB
  • 大小: 18.1 KB
  • 大小: 16.3 KB
  • 大小: 7.7 KB
  • 大小: 44.8 KB
  • 大小: 45.1 KB
  • 大小: 9.9 KB
  • 大小: 55.2 KB
  • 大小: 9.6 KB
  • 大小: 12.1 KB
  • 大小: 12.4 KB
  • 大小: 76.5 KB
  • 大小: 9.9 KB
  • 大小: 8.8 KB
  • 大小: 9.3 KB
  • 大小: 68.4 KB
  • 大小: 17 KB
  • 大小: 16.4 KB
  • 大小: 82 KB
  • 大小: 14.6 KB
  • 大小: 18.5 KB
  • 大小: 5.5 KB
  • 大小: 11.2 KB
  • 大小: 10.8 KB
分享到:
评论

相关推荐

    C# winfom 等待窗口 等待进度条 源码实例

    "C# WinForm等待窗口等待进度条源码实例"就是这样一个例子,它展示了如何在C#应用程序中实现这种功能。 首先,让我们理解等待窗口(Splash Screen)的作用。等待窗口是一个简化的窗体,通常在主应用启动时显示,...

    WPF点击弹出等待进度条

    至此,一个简单的WPF应用已经实现了点击按钮后弹出等待进度条的功能。用户点击“开始”按钮,BackGroundWorker将在后台执行任务,同时在主线程上更新进度条。当任务完成后,进度条将恢复为不确定状态,提示用户任务...

    wp7下等待进度条

    在提供的压缩包文件中,可能包含了示例代码或者一个简单的项目,展示了如何在实际应用中使用等待进度条。下载并运行这个项目,你可以看到实际效果并学习如何在自己的WP7应用中实现类似的功能。 总的来说,创建一个...

    C# Winform进度条 数据加载等待控件

    "C# Winform进度条 数据加载等待控件"就是这样一个组件,它在数据加载或执行耗时操作时提供视觉反馈,告诉用户程序仍在运行,并且预计何时会完成。 这个控件的设计原则是简单易用,开发者只需一行代码就能快速地将...

    android webview 顶部进度条+旋转等待dialog例子

    当我们加载一个网页时,尤其是在网络状况不佳的情况下,用户可能需要等待一段时间,此时为了提供更好的用户体验,通常会显示进度条来指示加载进度,并且在需要的时候显示旋转等待对话框(ProgressDialog)以告知用户...

    BAT批处理脚本-提示窗口进度条-娱乐进度条.cmd.zip

    批处理脚本(BAT)是基于DOS或Windows环境下的一种简单程序,用于自动化执行一系列命令。这种特定的脚本可能被设计用来模拟执行过程,如安装程序或数据迁移,通过在屏幕上显示进度条来提供用户反馈。 描述中提到,...

    Qt自绘带动画的简单进度条Demo

    在本文中,我们将深入探讨如何使用Qt库中的QPainter类创建一个自定义的、带有动画效果的等待进度条。Qt是一个跨平台的应用程序开发框架,广泛应用于GUI编程,而QPainter是Qt提供的一种用于2D图形绘制的强大工具。在...

    C# 进度条显示处理进度

    以下是一个简单的实现步骤: 1. **创建进度条控件**:在Windows Forms或WPF应用中,你可以添加一个ProgressBar控件到界面。设置其最大值为预期的最大处理进度。 2. **定义线程安全的进度变量**:创建一个`int`类型...

    C# 画面带进度条的等待提示框(bbBackgroundWorker)

    描述"**简单的实现进度条的等待提示框功能**"表明我们将关注如何简洁高效地在C#中实现这一功能。下面将详细介绍如何实现: 1. **添加BackgroundWorker组件**: 在Windows Forms设计视图中,从工具箱中拖放一个`...

    基于QT QML的进度条控件

    QT QML是一种强大的框架,用于构建富媒体、跨平台的...总之,QT QML的`ProgressBar`控件为开发者提供了一种简单而灵活的方式来展示任务的进度,你可以通过调整其属性和与其他组件交互,创建出符合设计需求的进度条。

    C#圆形进度条

    而Windows Forms则更为传统,适合快速开发简单的桌面应用。 2. 自定义控件:在C#中,创建自定义控件通常需要继承已有的UI元素(如Panel或UserControl),并重绘控件以实现所需外观。对于圆形进度条,我们需要重写`...

    gif 动画 滚动条 等待图 进度条

    在IT行业中,尤其是在网页设计和用户体验优化领域,"gif 动画 滚动条 等待图 进度条"是常见的元素,它们在提升用户交互体验方面扮演着重要角色。 首先,我们来详细了解这些概念: 1. **GIF动画**:GIF(Graphics ...

    水平进度条和默认进度条

    在IT界,进度条是一种非常常见的用户界面元素,它用于可视化地表示某个任务或操作的完成进度。...无论是移动应用开发还是网页设计,合理运用进度条可以提升产品的用户体验,使用户在等待过程中感到更加安心和舒适。

    80个GIF进度条,漂亮的动态加载进度条

    GIF是一种常见的动画格式,尤其适用于创建简单的循环动画,如进度条。这些80个GIF进度条可能包含了多种设计风格,包括但不限于线性、圆形、填充型、扁平化、3D效果等,以满足不同设计需求。每种进度条都有其独特的...

    PHP100视频教程49:Ajax.PHP打造等待进度条效果(二).rar

    在本教程中,我们将深入探讨如何使用PHP和Ajax技术创建一个动态的等待进度条效果。这一部分是系列教程的第二部分,重点在于实现交互性和用户体验的提升,使得用户在后台处理任务时能有一个可视化的反馈。 首先,让...

    无尽的进度条3.0

    通过"无尽的进度条3.0",我们可以学习到如何在软件开发中利用创新的视觉元素提升用户体验,以及如何将简单的UI组件转化为吸引人的交互设计。同时,它也提醒我们,优秀的软件不仅要功能强大,其界面设计同样需要注重...

    安卓自定义Dialog带有进度条的效果的ProgressDialog

    2. **布局定制**:如果简单的样式调整不能满足需求,可以创建自定义的布局文件,然后在ProgressDialog中加载这个布局。通过`setContentView()`方法,可以将自定义的视图设置为ProgressDialog的内容。 3. **进度更新...

    winform竖向进度条

    确保进度条的更新速度适中,既不过快让用户感到困扰,也不过慢导致用户等待。根据任务的性质,可以设置合适的更新间隔。 总的来说,实现WinForm竖向进度条需要一定的编程技巧,包括自定义控件的绘制、事件处理以及...

    wpf进度条,wpf等待条,wpf loading

    在Windows Presentation Foundation (WPF) 中,进度条和等待条(通常称为loading指示器)是用户界面中的关键元素,它们提供了用户体验的反馈,表明应用程序正在执行后台任务或数据加载过程。这些组件对于保持用户对...

    windows进度条美化工具

    它可能是一个简洁易用的工具,旨在提供一个简单的方法来改变Windows的默认进度条样式。 【标签解析】 “美化工具”标签表明该软件的主要目的是为了改善和装饰用户的计算机界面。这包括但不限于窗口边框、图标、鼠标...

Global site tag (gtag.js) - Google Analytics