首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

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

将“取消按钮作为默认按钮,并使用粗体文本。 允许用户通过退出APP到主屏幕来取消警示框。警示框出现时,退出到主屏幕可以退出APP。这个操作产生与点击取消按钮的效果是相同的。...非模态浮层可以通过点击屏幕上浮层以外的部分或浮层上的按钮取消/关闭。而模态浮层则是通过点击浮层上的取消其他按钮来关闭/取消的。...浮层出现时,其他视图的交互行为会被禁止,直到浮层被取消/关闭。使用浮层所显示的内容要与当前页面中的内容关联。例如:当你点击“操作”按钮,许多iPad应用会弹出一个浮层(如下图)。 ?...浮层接近系统浮层,往往效果最好。 需要改变浮层的大小时,提供一个平滑过渡的方案。一些浮层对于相同信息提供了精简视图和扩展视图两种展示方式。...滚动视图的缩放选项被打开,设置比较合适的最大及最小值。例如:放大文本直到一个单一的字符充满整个屏幕,即使其可能对于大部分应用来说是没有意义的。 滚动视图处于页面模式考虑显示页面控制元素。

8.4K31

Material Design — 提示框( Dialogs)

操作机制: ·立即选择一个选项,提交选项并关闭菜单; ·触摸提示框外部或按下后退键,取消操作并关闭对话框。 减少打扰 简单提示框比简单菜单更具中断性,应该谨慎使用。 ?...不该有明确的取消按钮 明确说明 ·在简单提示框中,行高可以变化; ·简单的对话框在屏幕上垂直和水平都居中显示; ·提示框与屏幕左右边缘的距离应该至少40dp,距离顶部和底部至少24dp; ·该对话框的内容距离提示框边缘...例如,用户可以聆听多个铃声,但只能在触摸“ok”进行最终选择。 点击确认对话框中的“取消”,或按Android的“后退”,取消操作,放弃所有更改并关闭对话框。 ?...左:选择日期    右:选择时间 取消与确定按钮 确认提示框需要提供明确的确认按钮和明确的取消按钮。 点击取消按钮、返回按钮或离开确认提示框将放弃之前的更改。 ?...全屏提示框可用于满足以下标准的内容或任务: ·该提示框包含需要输入编辑器(IME)的组件(如选择器或form fields),例如键盘 ·没有实时保存更改时 ·app中没有草稿功能(无法自动存到草稿

5K101
您找到你想要的搜索结果了吗?
是的
没有找到

Qt Style Sheet实践(三):QCheckBox和QRadioButton

单选按钮只允许用户在一组选项中选择一个,且其中一个被选中的时候,按钮组中的其他单选按钮自动取消。复选框则可以让用户同时选中多个选项,这在多项选择的情况下非常有用。...基本实现       单选按钮(QRadioButton)的基本特征是互斥。一个按钮选中,系统自动取消其他按钮的选中状态。当然,前提是这些按钮都要放置同一个父组件(Parent Widget)中。...这样,一个按钮选中的时候其他选中的按钮将被自动取消。但是缺点是:如果我们想要获取当前被选中的按钮是哪一个,不太方便判断。一个简单而粗暴的方法是,循环遍历每个单选按钮的状态进行检查。...另外的一个方法是,将这一组单选按钮全部添加到QButtonGroup中去。...样式定制的重点是::indicator,利用伪状态::indicator设置好不同状态的背景图片。        2. 理解QRadioButton和QCheckBox的不同状态。

8.9K60

AngularDart Material Design 选择

deselectOnActivate bool  如果true且selectOnActivatetrue,则触发此项目组件将取消选择当前选定的值;如果false,则在选择触发此组件将不执行任何操作...与单个选择模型一起使用时,下拉选择关闭。 使用多选模型,用户必须通过单击其外部来关闭下拉列表。 可以通过传递material-select-item元素手动声明选择选项。...deselectLabel String  选择项目的文本标签,取消选择当前选择。...listAutoFocus bool  弹出窗口打开是否默认聚焦选项列表。 弹出窗口中的另一个元素专注于打开,应设置false,例如一个搜索框。...preferredPositions List  enforceSpaceConstraintstrue,对齐的首选位置 raised bool  按钮是否凸起。

6K20

【译】W3C WAI-ARIA最佳实践 -- 表单

其他 WAI-ARIA 组件角色一样,应用link角色到一个元素,浏览器不会自动添加标准链接行为,例如导航到链接目标或上下文菜单操作。使用 link 角色元素提供这些特性是开发者的责任。...菜单或菜单栏 menu 是一个组件,用户提供一个选择列表,例如一组操作或功能。...- (可选):焦点位于未选中的menuitemradio上,不会关闭菜单,选中聚焦的 menuitemradio,并取消选中同一组中的任何其他已选中的 menuitemradio 元素。...如果按钮一个切换按钮,则其具有 aira-pressed 状态属性。按钮被打开,该状态属性的值 true,被关闭,该状态属性的值false。...任何其他字符输入不会更改文本字段的内容和按钮的值。 NOTE 操作过程中焦点仍在文本字段上。 适用于设备平台的标准单行文本编辑键: 包括输入键,光标移动,选择和文本操作。

8.2K30

AngularDart Material Design 下拉列表 顶

与单个选择模型一起使用时,下拉选择关闭。 使用多选模型,用户必须通过单击其外部来关闭下拉列表。 可以通过传递material-select-item元素手动声明选择选项。...如果OptionGroup空并且已定义emptyLabel,则下拉列表将包含其他组。 如果没有为空组定义emptyLabel,它将不会出现在列表中。...deselectLabel String 选择项目的文本标签,取消选择当前选择项。 deselectOnActivate bool  是否在单击或enter/space键上取消选择所选选项。...listAutoFocus bool  弹出窗口打开是否默认聚焦选项列表。 弹出窗口中的另一个元素专注于打开,应设置false,例如一个搜索框。...preferredPositions List enforceSpaceConstraintstrue,对齐的首选位置 raised bool  按钮是否凸起。

5K20

Android widget之CompoundButton

简介 具有两个状态的按钮,已选中或未选中。按下或点击按钮,状态会自动更改。...setOnCheckedChangeListener(CompoundButton.OnCheckedChangeListener listener) 这个按钮的检查状态发生变化时,注册一个回调...RadioButton 单选按钮:是可以选中或取消选中的双状态按钮单选按钮取消选中,用户可以单击来选中它。 注:单选按钮通常与RadioGroup在一起使用。...多个单选按钮在RadioGroup内,检查一个单选按钮取消选中所有其他单选按钮。 <?xml version="1.0" encoding="utf-8"?...Switch 开关:是一个双状态切换开关小部件,可以在两个选项之间进行选择。用户可以来回拖动“拇指”来选择选择的选项,或者只需轻按以切换,就像复选框一样。

2.2K20

Material Design — 按钮( Buttons)

·切换按钮(Toggle buttons)将选项汇聚在一起。 图标切换允许选择取消选择单个选项。...对于其他语言,平面按钮上的彩色文本将它们与普通文本区分开来。 无障碍 为了确保残疾人的可用性,需要按钮的高度36dp,热区的最低高度48dp。 ?...左:页面内容多    右:内容分界 ? 背景比较嘈杂的时候使用浮动按钮 浮动按钮就像一块放在另一张纸上的材料 - 点击浮起并填充颜色。 ? 按钮海拔 浮动按钮的默认海拔2dp。...例如,可用状态可以显示文字,颜色或icon的列表。 当用户与按钮交互,Menus会覆盖按钮并显示可能的状态。 按下某个状态会取消Menus并更新按钮以显示此新状态。...例如,聚焦一个切换按钮,焦点可能会同时显示组中的其他切换按钮

3.8K160

单选按钮的用户体验设计

单选按钮是表单系统的一个基本元素。它们被使用在当存在互斥的两个或多个选项列表而用户必须选择其中一个。换句话说,点选某个尚未选中的单选按钮,之前的选择就会恢复成未选中。...一、单选按钮的名字由何而来 单选按钮的命名源自于旧式汽车中收音机用来切换频道的物理按键—一个按钮被按下,其他的就会被弹出,留下唯一的按钮处于被选中的状态。...同时,改变的设置不应该在用户点击命令按钮(标记为“前进”或“保存”例)前生效。如果用户点击返回或取消按钮,任何在该单选按钮组所做的更改都应该被丢弃而且回到初始状态。...如果用户可能需要避免作出选择,你应该提供一个选项,比如“没有”。用户提供一个明确的,中立的默认选项比要求的内隐行为不是从列表中选择要好。...当你有一个简单的问题而用户只需回答是或否的时候,使用复选框还是正确无误的。 三、结论 设计单选按钮,最重要的是遵循设计标准,因为这能增强用户预测哪个选项能做什么和如何操作它。

6.1K100

MessageBox用法详解

(1)按钮组合常量  MB_OK = $00000000;         //一个确定按钮  MB_OKCANCEL = $00000001;      //一个确定按钮一个取消按钮  MB_ABORTRETRYIGNORE...= $00000002;  //一个异常终止按钮一个重试按钮一个忽略按钮  MB_YESNOCANCEL = $00000003;     //一个按钮一个按钮一个取消按钮  MB_YESNO...= $00000004;        //一个按钮一个按钮  MB_RETRYCANCEL = $00000005;     //一个重试按钮一个取消按钮  (2)缺省按钮常量  MB_DEFBUTTON1...调用应用程序或库没有一个可以得到的窗口句柄,使用此标志。但仍需要阻止到调用 应用程序甲其他窗口的输入而不是搁置其他线程。 另外,可以指定下列标志。...缺省桌面是一个在用户已经纪录且以后应用程序在此上面运行的桌面。 MB_HELP:把一个Help按钮增加到消息框。选择Help按钮或按F1产生一个Help事件。

1.3K10

HarmonyOS实战——CommonDialog组件的基本使用

CommonDialog 组成和使用 在鸿蒙当中,这种普通和弹框其实是有默认布局的 下面的选择按钮最多只有三个 [在这里插入图片描述] 弹框并不是APP启动立马弹出来的,一般会有两种情况: 点击按钮的时候会弹出来...: [在这里插入图片描述] 再次点击灰色区域也没有反应 点击或 取消 按钮没有任何反应,因为在上面的那里设置了 null 一般点击弹框的两种情况: 点击灰色区域也不能取消,必须点击取消按钮才能取消弹框...点击灰色区域或取消按钮都能达到取消弹框的效果 下面就实现上面这两种情况: 点击灰色区域也能取消按钮的情况,在上面的代码基础上补充如下 [在这里插入图片描述] 当鼠标点击取消按钮的时候也能让弹框消失,把上面设置取消按钮的...,点击了一个按钮后会出现弹框 [在这里插入图片描述] 弹框里面有三个东西:一行文本和两个按钮 [在这里插入图片描述] 点击了 确定 按钮后,上面的文本就会变成“点击了确定按钮”,点击了 取消 按钮后弹框就会消失...//parse方法:加载一个 xml 文件,返回一个布局对象 //参数一:要加载的 xml 文件 //参数二:该 xml 文件是否跟其他 xml 文件有关

66100

【IOS开发基础系列】UIAlertController专题

下面的代码片段展示了如何初始化和显示一个带有“取消”和“好的”按钮的对话框视图。...您向对话框控制器中添加文本框,您需要指定一个用来配置文本框的代码块。         ...Observer模式定义对象间的一对多的依赖关系,一个对象的状态发生改变, 所有依赖于它的对象都得到通知并被自动更新。我们可以在构造代码块中添加如下的代码片段来实现。     ...,除非在“登录”文本框中输入3个以上的字符: 上拉菜单         需要给用户展示一系列选择的时候(选择恐惧症患者杀手),上拉菜单就能够派上大用场了。...当我们使用iPad或其他常规宽度的设备,就会得到一个运行时异常: Terminating app due to uncaught exception ‘NSGenericException’, reason

35230

文档和元素的几何滚动

文档和元素的几何滚动 浏览器在窗口中渲染文档,它将会创建文档一个视觉表现层,在哪里每个元素都有自己的位置和尺寸。通常web应用程序将文档看做元素的树。...还有一个onreset事件处理程序来检测表单的重置。表单提交前将会调用onsubmit程序,如果回调函数的返回值false则会取消表单的提交动作。这是js程序一个用来检查用户的输入错误。...onclick事件处理程序能概念化为跟随此链接一个链接,否则用按钮。 提交和重置元素本就是按钮,不同的是它们有与之相关联的默认动作。 即,按钮和超链接类似,都具有共同的作用。...单选元素整组有相关性的元素而设计的,组内所有按钮的HTML属性name值都相同。按照这种方式创建的按钮互斥的。利用表单属性的名字选中元素,它返回的一个类数组对象而不是单个元素。...选择框和选项元素 当用户选取或取消选择一个选项,select元素将会触发onchange事件处理程序。

5.2K00

C++ Qt开发:LineEdit单行输入组件

是构建用户交互界面的基础组件之一,通常与其他控件一起使用,例如按钮、标签等,以构建完整的用户输入界面。...标准按钮和返回值: QMessageBox 提供了一组标准按钮,用户可以选择,每个按钮都对应一个返回值,便于判断用户的选择。...QMessageBox::Question(提问框) 通常用于询问用户一个问题,用户可以选择"是"、"否"、"取消"等答案。...QMessageBox::exec() 执行消息框并等待用户的响应,返回用户选择按钮。 QMessageBox::button() 获取消息框中指定类型的按钮,用于自定义按钮的属性和行为。...", QMessageBox::Ok); } } 如下图,当用户点击代码提示框按钮,会自动弹出对话框,当用户选择不同的按钮则又会再次弹出令一个不同的对话框; 接着我们来扩展一个非常实用的案例技巧

34910

JQuery上传插件Uploadify使用详解

queueSizeLimit : 允许多文件生成,设置选择文件的个数,默认值:999 。 multi : 设置true可以上传多个文件。...rollover : 值true和false,设置true当鼠标移到浏览按钮上时有反转效果。 width : 设置浏览按钮的宽度 ,默认值:110。...cancelImg :选择文件到文件队列中后的每一个文件上的关闭按钮图标,如下图: 上面介绍的key值的value都为字符串或是布尔类型,比较简单,接下来要介绍的key值的value一个函数,可以在选择文件...onCancel : 点击文件队列中文件的关闭按钮或点击取消上传触发。...fileCount:取消一个文件后,文件队列中剩余文件的个数。 allBytesTotal:取消一个文件后,文件队列中剩余文件的大小。

1.5K30

Matlab系列之GUI设计基础

如果单选按钮或复选框指定 CData 属性,则图像可能与文本字符串重叠。另外,单选按钮或复选框指定图像会禁用在选择取消选择它们显示的功能。... Visible 'off' ,控件不可见,可以查询并设置其属性。 要使程序更快启动,请将最初未显示的所有 件的 Visible 属性设置 'off'。...•'inactive' – 控件未处于工作状态,但其外观与 Enable 设置 'on' 相同。 Enable 属性的值和按钮点击的类型共同确定响应。...当用户在其上点击并释放鼠标按钮,状态发生变化。 'radiobutton' 可具有两种状态(选择取消选择)的按钮。单选按钮在一组相关的单选按钮中有意安排互斥。 'edit' 可编辑的文本字段。...'checkbox' 取消选中复选框,Value 属性更改为 Min 属性的值。 'radiobutton' 取消选择单选按钮,Value 属性更改为 Min 属性的值。

5.8K10

HTML 表单 (form) 的作用解释

表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。 下面对表单的三个部分分别进行说明。...虽然它们都是数据的提交方式,但是在实际传输确有很大的不同,并且可能会对数据产生严重的影响;其他说明见注; enctype=cdata:指明用来把表单提交给服务器 method 值 POST)的互联网媒体形式...(因此取消所有其它框架);这个值等价于当前框没有你框的_self....; Physical:让文本换行,数据被提交处理,换行符也将被一起提交处理。...下拉选择框 下拉选择框允许你在一个有限的空间设置多种选项。

5K71

Human Interface Guidelines —— Popovers

Popover Popover是一个短暂的视图,您点击某个控件或某个区域,它会出现在屏幕上的其他内容上方。 通常,Popover包含指向其出现位置的箭头。...Popover分为非模态或模态的: ·通过点击屏幕的另一部分或 popover上的按钮,可以解除非模态popover 。  ·点击弹出窗口上的取消其他按钮即可解除模态popover。...在大多数情况下,有人在popover之外区域点击或选择popover中的项目后,popover应该关闭。...·自动关闭非模态popover始终保存工作数据 通过点击屏幕的另一部分很容易无意中消除非模态popover。但是只有当用户点击明确的取消按钮才丢弃之前的数据。...·可能的话,让用户点击一次就能关闭一个popover的同时打开另一个popover 几个不同的按钮每个都打开一个popover,避免额外的点击是特别明智的。

1.3K110

Human Interface Guidelines —— 搜索栏(Search Bars)

显示在navigation bar中,search bar可以固定到navigation bar,以便始终可以访问,或者可以collapse search bar,直到用户向下滑动才显示。...·启用清除按钮。 大多数搜索栏都包含一个清除按钮,用于删除该区域的内容。 ·适当时启用取消按钮。 大多数专用搜索栏包含一个立即终止搜索的“取消按钮。 ?...左:清除按钮    右:取消按钮 ·如有必要,请在navigation bar中展示提示和上下文。...由此可以在没有需输入任何搜索条件选择一个书签即可进入。 您在搜索区域中输入时,股票会显示结果列表。 随时轻击一个,无需再输入更多字符。...Scope Bar 可以加入一个scope bar,以改善搜索结果。 对搜索结果有明确定义的类型,scope bar会非常有用。 但是,最好的办法是改进搜索结果,因此就可以不使用范围。

1.2K80

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

    运营活动

    活动名称
    广告关闭
    领券