progressbar、combobox的widget资源-CSDN文库

共32个文件

png：14个

js：7个

gif：6个

5星 · 超过95%的资源需积分: 6 2 浏览量 2014-07-11 13:44:48 上传评论收藏 602KB RAR 举报

在GUI（图形用户界面）设计中，`progressbar` 和 `combobox` 是两种常见的控件，它们极大地提升了用户的交互体验。下面将详细解释这两种控件的功能、用途以及如何在不同的编程环境中使用它们。 **进度条（Progress Bar）** 进度条，通常表示为`progressbar`，是一种可视化组件，用于展示任务或过程的完成度。它常被用在需要执行长时间操作的场景中，如文件上传、下载、解压缩等，让用户了解当前操作的进度，从而提供更好的反馈。进度条有两种主要类型：固定长度和可扩展长度。固定长度的进度条通常用于已知工作量的任务，而可扩展长度的进度条则适用于未知工作量的任务。在Python的Tkinter库中，可以使用`ttk.Progressbar`创建一个进度条。例如： ```python from tkinter import ttk root = tk.Tk() progress_bar = ttk.Progressbar(root, orient="horizontal", length=200, mode="determinate") progress_bar.pack() ``` 此外，在Qt、wxPython、JavaFX等其他GUI库中也有相应的进度条组件。 **下拉列表框（ComboBox）** 下拉列表框，通常称为`combobox`，结合了输入框和下拉菜单的功能，用户可以在输入框中直接键入选择项，也可以点击下拉箭头浏览并选择已定义的选项。这种控件广泛应用于设置、配置界面，以减少用户界面的复杂性。在Python的Tkinter库中，我们可以使用`ttk.Combobox`创建一个下拉列表框： ```python from tkinter import ttk root = tk.Tk() comboBox = ttk.Combobox(root, values=["Option1", "Option2", "Option3"]) comboBox.pack() ``` 同样，Qt的`QComboBox`、wxPython的`wx.ComboBox`以及JavaFX的`ComboBox`也提供了类似的功能。 **在实际应用中的组合** `progressbar` 和 `combobox` 经常一起使用，例如在下载管理器中，用户可能通过`combobox`选择要下载的文件，同时`progressbar`展示下载进度。这样的组合提供了良好的用户体验，因为用户可以清晰地看到自己的操作状态。总结来说，`progressbar` 和 `combobox` 是GUI设计中不可或缺的元素，它们能够有效地提升软件的可用性和用户体验。理解并熟练掌握这两种控件的使用，对于开发出高效、直观的图形界面至关重要。无论是简单的桌面应用程序还是复杂的Web应用，`progressbar` 和 `combobox` 都能帮助我们构建出更加用户友好的界面。

资源推荐

资源详情

资源评论

收起资源包目录

widget.rar （32个子文件）

widget

images

progressbg_red.gif 1KB

progressbg_black.gif 2KB

progressbg_green.gif 1KB

progressbar.gif 120B

progressbg_yellow.gif 1KB

progressbg_orange.gif 1KB

ui-lightness

jquery-ui-1.8.18.custom.css 33KB

images

ui-bg_glass_100_fdf5ce_1x400.png 125B

ui-bg_highlight-soft_100_eeeeee_1x100.png 90B

ui-icons_ffffff_256x240.png 4KB

ui-bg_glass_65_ffffff_1x400.png 105B

ui-icons_228ef1_256x240.png 4KB

ui-bg_diagonals-thick_18_b81900_40x40.png 260B

ui-bg_diagonals-thick_20_666666_40x40.png 251B

ui-bg_gloss-wave_35_f6a828_500x100.png 4KB

ui-bg_flat_10_000000_40x100.png 178B

ui-icons_ef8c08_256x240.png 4KB

ui-icons_ffd27a_256x240.png 4KB

ui-bg_highlight-soft_75_ffe45c_1x100.png 129B

ui-icons_222222_256x240.png 4KB

ui-bg_glass_100_f6f6f6_1x400.png 104B

一个更好的 jQuery UI 自动完成的 Combo Box - 开源中国社区.mht 526KB

Scripts

combobox.js 4KB

text.js 2KB

jquery-ui-1.8.18.custom.min.js 205KB

jquery-1.7.1.intellisense.js 150KB

progressbar.js 6KB

jquery-1.7.1.min.js 92KB

jquery-1.7.1.js 242KB

widget.html 1KB

使用 jQuery UI Widget Factory 编写有状态的插件（Stateful Plugins） - 一粒沙 - 博客园.mht 224KB

jQuery插件开发全解析 - jQuery - web - ITeye论坛.mht 823KB

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>jQuery </title> <link href="ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" /> <script src="Scripts/jquery-1.7.1.min.js"></script> <script src="Scripts/jquery-ui-1.8.18.custom.min.js"></script> <script src="Scripts/text.js"></script> <script src="Scripts/progressbar.js"></script> <script src="Scripts/combobox.js"></script> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function () { $(function () { $('#combolist').combobox(); $("#spaceused1").progressBar(0); $("#tx").textboxdecorator(); }); }) function jindu() { $('#spaceused1').progressBar(50); } </script> </head> <body> <input type="button" value="50%进度" onclick="jindu();" /> <div id="wd"> <span id="spaceused1">75%</span> </div> <div class="combowrap"> <select id="combolist" name="combolist"> <option value="0">Option 0</option> <option value="1">Option 1</option> <option value="2">Option 2</option> <option value="3">Option 3</option> <option value="4">Option 4</option> </select> </div> <input id="tx" type="text" value="" style="width:200px;"/> </body> </html>

评论收藏

内容反馈