首页
学习
活动
专区
圈层
工具
发布

最新iOS设计规范四|3大界面要素:视图(Views)

五、图像视图(Image Views) 图像视图是在透明或不透明背景上,显示的单个图像或动画图像序列。在图像视图中,图像可以被拉伸、缩放、调整大小以适合或固定到特定位置。...如果传达的含义足够清晰明确,可以使用“关闭”按钮(例如“取消”或“完成”),例如退出是否保存更改。若无存在的必要,弹出窗口应自动关闭。当用户点击浮层之外的区域或浮层中的关闭/取消按钮时,浮层应该关闭。...行可以被分隔为不同标记的部分,并且会有索引标记显示在屏幕右侧。页眉可以出现在一节中的第一项之前,页脚可以出现在最后一项之后。 ? 分组列表。...用户在与列表进行交互时,希望被点击的列表可以突出显示。然后,用户还会期待出现新的视图或者要改变的东西,例如已勾选按钮,是表示用户已经做出了选择。 为非标准表行设计自定义表格单元格样式。...十二、网页视图(Web Views) 网页视图可以在APP中加载和显示丰富的网页内容。例如:嵌入式HTML和网站;邮箱APP使用网页视图来在消息中显示HTML内容。 ? 适当地使用前进和后退导航。

12.8K31

iOS 9人机界面指南(四):UI元素(上) - 腾讯ISUX

这样能够保证在关联特定意义的按钮改变了外观的情况下,你的应用中的UI仍然是可用而有意义的。...这样能够保证在关联特定含义的按钮改变了外观的情况下,你的应用中的UI仍然是可用而有意义的。...如果用户很难点中集合视图中的项,他们是不会愿意用你的应用的。跟所有用户可以点击的UI对象一样,请确保你的集合视图中每一个项的最小点击区域有44×44pt,尤其是在iPhone上。...在点击后,用户期望出现新的视图,或者出现一个复选标记以表明先前点击的项已经被选中或激活。 如果表格的内容庞大而且复杂,不要在所有数据都加载完之后才一起显示出来。...可以首先展示文本信息,图片等较为复杂的内容则在加载完后再显示。这样可以将有用的信息立即传达给用户,同时也提高了应用的响应能力。 在等待信息加载的时候,可以考虑展示“过期”信息。

14.7K51
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    UI自动化 --- UI Automation 基础详解

    引言 上一篇文章UI自动化 --- 微软UI Automation中,介绍了UI Automation能够做什么,且借助 Inspect.exe 工具完成了一个模拟点击操作的Demo,文章结尾也提出了自己的一些想法...这种方法允许客户端根据其特定需求自定义通过UI自动化呈现的结构。 客户端有两种方式来自定义视图:通过作用域和过滤。...控件视图是原始视图的一个子集。它包括原始视图中的所有UI项,这些项被用户理解为可交互,或对UI中的控件的逻辑结构起作用。...例如,一个本身不包含任何信息,仅用于布局对话框中的控件的面板。 控件视图中可见的非交互项例如有包含信息的图形和对话框中的静态文本。 控件视图中包含的非交互项不能接收键盘焦点。...它包含传达用户界面中真实信息的UI项,包括可以接收键盘焦点的UI项以及一些不是UI项上的标签的文本。例如,下拉组合框中的值将出现在内容视图中,因为它们代表终端用户正在使用的信息。

    7.3K20

    C++ Qt开发:StandardItemModel数据模型组件

    Model/View 是Qt中的一种数据编排结构,其中Model代表模型而View则代表视图,视图是显示和编辑数据的界面组件,而模型则是视图与原始数据之间的接口,通常该类结构都是用在数据库中较多,例如模型结构负责读取或写入数据库...数据模型组件通常会配合TableView等相关组件一起使用,首先绘制UI界面,界面中包含顶部ToolBar组件,底部是一个TableView视图表格,最下方是一个PlainTextEdit文本框,如下图所示...StatusBar组件上,代码如下所示; // 【选中单元格时响应】:选择单元格变化时的响应,通过在构造函数中绑定信号和槽函数实现触发 void MainWindow::on_currentChanged...// 【打开文件】:当工具栏中打开文件被点击后则触发 void MainWindow::on_actionOpen_triggered() { QString curPath=QCoreApplication...,点击打开按钮后可以选择项目中的data.txt文本文件,此时就可以将文本中的内容映射到组件中,其输出效果如下图所示; 1.3 保存文件 接着我们来看下保存文件与预览TableView视图的实现方法,其实保存文件与预览是一个功能

    1.7K20

    C++ Qt开发:TableView与TreeView组件联动

    本章我们继续实现表格的联动效果,当读者点击TableView或TreeView中的某一行时,我们让其实现自动跟随功能,且当用户修改行中特定数据时也让其动态的跟随改变,首先绘制一个主界面如图,分别放置两个组件框...通常用于与视图组件(如 QTableView、QTreeView 等)一起使用。它提供了一个表格结构,可以包含行和列,每个单元格可以存储一个 QStandardItem 对象。...,以及在模型中项的选择状态发生变化时发出信号。...如下图所示;DialogSize.ui接着来看on_pushButton_clicked按钮是如何实现的,该按钮主要用于实现改变表格行与列,当点击后则会弹出一个DialogSize自定义对话框,至于对话框是如何添加的在之前的文章中已经详细介绍过了...对于第二个按钮on_pushButton_2_clicked的功能实现与第一个按钮完全一致,该按钮主要实现对父窗体中TableView的表头进行重新设置,在弹出对话框之前,需要将当前表头元素复制到strList

    1.3K10

    FullCalendar 日历插件中文说明文档

    '} theme 是否允许使用jquery的ui主题,如果设置为true,则需要加载jquery ui相关css和js文件。 ...false selectHelper 当点击或拖动选择时间时,显示默认加载的提示信息,该属性只在周/天视图里可用。...url 可选,当指定后,事件被点击将打开对应url。 className 指定事件的样式。 editable 事件是否可编辑,可编辑是指可以移动, 改变大小等。...日程事件拖动和缩放 拖动和缩放功能依赖于jQuery ui的draggable和resizable,所以在使用时要提前加载jQuery ui相关插件。...在一个日程事件改变大小之前之后发生(不一定要改变成功),用法:function( event, jsEvent, ui, view ) { } eventResize callback,在日程事件改变大小并成功后调用

    36.8K90

    CC++ Qt StandardItemModel 数据模型应用

    QStandardItemModel 是标准的以项数据为单位的基于M/V模型的一种标准数据管理方式,Model/View 是Qt中的一种数据编排结构,其中Model代表模型,View代表视图,视图是显示和编辑数据的界面组件...,而模型则是视图与原始数据之间的接口,通常该类结构都是用在数据库中较多,例如模型结构负责读取或写入数据库,视图结构则负责展示数据,其条理清晰,编写代码便于维护。...// 选择单元格变化时的响应,通过在构造函数中绑定信号和槽函数实现触发// https://www.cnblogs.com/lysharkvoid MainWindow::on_currentChanged...:"+aItem->text()); //显示item的文字内容 }}当页面被初始化时,默认界面如下:图片打开并填充组件: 当工具栏中打开文件被点击后则触发,打开文件时通过aFile.open打开...aItem->setFont(font); //重新设置字体 }}加粗代码效果演示:图片实现保存文件: 当保存文件被点击后触发,通过便利TableWidget模型组件中的数据,并将数据通过

    2.1K30

    将Hbase ACL转换为Ranger策略

    ColumnFamily – 在 ColumnFamily 范围内授予的权限适用于该 ColumnFamily 中的单元格。 单元格 - 在单元格范围授予的权限适用于该精确单元格坐标。...创建 Ranger 策略 在 Cloudera Manager 中,选择 Ranger 服务。 找到将您重定向到 Ranger UI的webUI链接。 登录到 Ranger UI。...选择覆盖后,策略中的访问权限将覆盖现有策略中的访问权限。此功能可与添加有效期一起使用以创建覆盖现有策略的临时访问策略。 HBase 表 选择合适的数据库。可以为特定策略选择多个数据库。...例如,您可以允许财务组中的所有用户访问财务表,但拒绝实习生组中的所有用户访问。假设实习生组的一名成员scott需要处理一项需要访问财务表的任务。...条件按照策略中列出的顺序进行评估。首先应用列表顶部的条件,然后是第二个,然后是第三个,依此类推。拒绝条件总是更强。以下流程图提供了有关 Ranger 策略评估流程的信息。 3.4 最后点击添加。

    1.4K20

    CC++ Qt StandardItemModel 数据模型应用

    QStandardItemModel 是标准的以项数据为单位的基于M/V模型的一种标准数据管理方式,Model/View 是Qt中的一种数据编排结构,其中Model代表模型,View代表视图,视图是显示和编辑数据的界面组件...,而模型则是视图与原始数据之间的接口,通常该类结构都是用在数据库中较多,例如模型结构负责读取或写入数据库,视图结构则负责展示数据,其条理清晰,编写代码便于维护。...// 选择单元格变化时的响应,通过在构造函数中绑定信号和槽函数实现触发 // https://www.cnblogs.com/lyshark void MainWindow::on_currentChanged...:"+aItem->text()); //显示item的文字内容 } } 当页面被初始化时,默认界面如下: 打开并填充组件: 当工具栏中打开文件被点击后则触发,打开文件时通过aFile.open...aItem->setFont(font); //重新设置字体 } } 加粗代码效果演示: 实现保存文件: 当保存文件被点击后触发,通过便利TableWidget模型组件中的数据

    2K20

    OneCode3.0低代码引擎核心技术:常用动作事件速查手册及注解驱动开发详解

    引言 在现代企业级应用开发中,低代码平台已成为提升开发效率、降低技术门槛的关键工具。...加载子节点后 子节点加载完成时 {nodeId:节点ID, treeId:树ID, childCount:子节点数量} - 1.2.3 数据绑定事件(DataBinderEventEnum) 事件枚举...AFTER_LOAD 加载后事件 数据加载完成后触发 {binderId:绑定器ID, data:返回数据, success:是否成功} - BEFORE_SUBMIT 提交前事件 数据提交前触发 {...:行ID, rowData:行数据} CELL_CLICK 单元格点击 点击表格单元格时 {gridId:表格ID, rowId:行ID, columnId:列ID, cellValue:单元格值} CELL_EDIT...例如,在UI设计器中设置的组件名称"topBar"会自动转换为@ComponentAnnotation(name = "topBar")注解属性。

    18210

    《iOS Human Interface Guidelines》——Table View表视图

    表视图 表视图在一个由多行组成的滚动单列清单中显示数据。...在两种风格中,表行会在用户点击选中时简短地高亮。如果一行的选择导致导航到一个新的界面,选中的行会高亮并且伴随着新的界面滑动进来。...图片在这种风格中不太适合。 在Value 2的布局中,文本间清爽的垂直边缘帮助用户专注于详细文本的第一个单词。 NOTE 所有四个标准表单元格风格都允许额外的表视图元素,比如勾选符号和扩展指示器。...添加这些元素会减少标题和子标题可使用的单元格宽度。 清晰而有效地使用表视图来显示大量或少量的信息。比如说: 提供用户可以选择的选项清单。你可以使用勾选符号来告诉用户当前列表中选中的项。...使用简单或分组表视图来显示用户点击表中一行条目时的选项清单。使用简单表视图来显示用户点击一个按钮或其他不在表的行中的UI元素时的选项清单。 显示层级信息。简单表风格很适合显示层级信息。

    3.6K20

    OneCode基础组件介绍——表格组件(Grid)

    在企业级应用开发中,表格组件是数据展示与交互的核心载体。...列表视图组成展示样例二,领域功能分解视图配置是本文主要讲解的部分,在列表配置中,主要由模块配置和子域配置两个部分组成。...模块配置(2) 环境变量设置:在模块构建时通常是在特定环境下运行的,这些特性环境一般是由,聚合实体以及聚合跟的组件值配合当前用户等环境值对象来完成。...在列表视图中如果需要添加环境变量,只需要在视图类中添加。相应的 聚合KEY 并且在字段上添加@Pid,或者@Uid (参考下面具体示例),Uid 代表当前实体的组件值。...(1)视图子域概览在实际应用中,列表通常是以独立的模块来呈现,但在用户在操作时会涉及到操作行甚至操作到表格应用。

    28410

    机房收费系统(VB.NET)——超详细的报表制作过程

    在“ 应用程序连接数据库应使用哪个数据库连接? ”后点击“ 新建连接 ”: ?        ...如上图,分别选择或输入相应项,测试连接,如果测试成功,则确定,自动返回到“ 数据源配置向导 ”窗体,下一步:         【拓展】 这个步骤如果您出现了【未能加载文件或程序集“Microsoft.SqlServer.Management.Sdk.Sfc...第一行为列标题,第二行为数据关联行,即与数据库中数据的关联,鼠标放到第二行每个单元格时,单元格右上角会出现一个小图标,点击则可以为该单元格以及该单元格所在的整列关联数据集中的数据。      ...(注:如果您没有找到【工具箱】或【报表数据】那么就需要去【视图】中添加。)        ...最后,重新单击第一步添加的ReportViewer空间,点击右上角的小三角,在“选择报表”后选择您刚制作的报表就大功告成了。

    2.5K30

    QTabView增删改使用教程

    setVisible(False)  # 垂直标题栏不可见 self.table_view.horizontalHeader().setVisible(False) # 水平标题栏不可见 设置表格标题栏是否可被点击...QAbstractItemView.DoubleClicked 2 鼠标双击时触发编辑 QAbstractItemView.SelectedClicked 4 在一个已经选中的行中单击鼠标时触发编辑...QAbstractItemView.EditKeyPressed 8 在一个视图选中行中点击鼠标时触发编辑 QAbstractItemView.AnyKeyPressed 16 在当前选中的数据(单元格...)按下任意键触发当前数据项进入编辑状态 QAbstractItemView.AllEditTriggers 31 以上所有操作行为都触发当前数据项进入编辑状态 设置选中背景色 self.table_view.setStyleSheet...= Ui_MainWindow() ui.setupUi(MainWindow) MainWindow.show() sys.exit(app.exec_())

    26310

    C# WPF MVVM开发框架Caliburn.Micro Screens, Conductors 和 Composition⑦

    屏幕集合中的任何内容都保持打开状态,但一次只有其中一项处于活动状态。在像VS这样的MDI风格的应用程序中,导体将管理在ScreenCollection成员之间切换活动屏幕。...如果导体使用“屏幕采集”,它也会将其添加到当前进行的项目中 DeactivateItem–调用此方法以停用特定项。第二个参数指示是否也应关闭该项。...您可能已经注意到,CM的IConductor接口使用术语“项”而不是“屏幕”,我在引号中加了术语“屏幕集合”。原因是CM的导体实现不需要执行的项目来实现IScreen或任何特定接口。...在选项卡ViewModel OnActivate和OnActivate中编写代码,以便在激活特定选项卡ViewModel时从工具栏中添加/删除上下文项。...第二个屏幕是相同的,但其视图/视图模型对是三维旋转的,因此您可以看到UI是如何组成的。

    3.7K20

    Visual Studio Code1.67版本已正式发布,新增Rust指南

    特定于语言的设置在设置中限定作用域。...下面是在Handy Dandy Notebook中演示的,它支持以各种不同语言执行单元格 显示无效或不兼容的扩展 Extensions视图现在在Installed扩展列表中显示无效或不兼容的扩展,并显示错误状态...为了减少Comments视图的干扰,新的默认值是firstFile,它导致Comments视图只在会话期间第一次打开带有注释的文件时打开 多行注释 在幕后,VS Code自从注释UX完成后就支持多行注释...,但是多行注释从未出现在UI中。...启用 “在文件中查找” 后,Visual Studio 将在加载或打开文件夹时启动附属进程 “ServiceHub.IndexingService.exe”,然后将文件列表发送给它进行索引。

    1.3K30

    【软件开发规范七】《Android UI设计规范》

    编辑 ​编辑 网格由单元格构成,单元格中的瓦片用来承载内容 ​编辑 瓦片可以横跨多个单元格 瓦片内容包括主要内容(primary content)和次要内容(secondary content)...在同一个列表中,主、副操作区的内容与位置要保持一致。 ​编辑 在同一个列表中,滑动手势操作保持一致。 ​...编辑 当前不可用的选项要显示出来,让用户知道在特定条件可以触发这些操作。 ​编辑 菜单原地展开,盖住当前选项,当前选项应该成为菜单的第一项。 ​...编辑 单选按钮(Radio button) ​编辑 复选框(Checkbox) ​编辑 开关(Switch) Tabs ​编辑 在一个 app 中,tabs 使在不同的视图和功能间探索和切换以及浏览不同类别的数据集合起来变得简单...编辑 ​编辑 输入框提示文字,可以在输入内容后,缩小停留在输入框左上角 ​编辑 整个点击区域增高,提示文字也是点击区域的一部分 ​编辑 通栏输入框是没有横线的,这种情况下通常有分隔线将输入框隔开

    7.1K20

    基于OEA框架的客户化设计(一) 总体设计

    7是所有版本都应该有的领域实体,2是可以进行配置以说明是否具备的领域实体,而1就是在主干之外,为特定版本开发的实体。所以以上目标中,支持对“2”的定制和对“1”的扩展是最重要的。    ...这里主要对最重要的两项进行详细的叙述。 配置?     一般来说,要实现客户化,使用配置可能是最直接的想法。一开始我想也没想就觉得可能客户化的内容需要存储在配置文件中,可能是一个自定义的XML文档。...各客户的版本中,分别把他自己的配置类和主配置类结合,然后以配置文件的方式注入到整个应用程序中。 当应用程序读取某个配置项时,直接从注入的配置类中获取;此时,按照一定的寻找顺序,定位该配置项。...这些定义在一开始被设置好版本的值后,将会被冻结,所以内容不再改变,变为“不可变类”。一,这是其运行期不需要改变的体现;二,不可变类是高效的类。    ..._pathProvider.MapAllPathes("Library", true); } /// /// 获取所有此版本中需要加载的模块Dll集合。

    2.1K80
    领券