UI知识扫盲贴!我猜UI设计师你也没知道几个

我们在做设计的时候,经常会忘记某个控件的名称,比如:心中知道某个控件的形态,却不知道如何称呼,所以今天给大家整理了设计规范中的一些控件合集,清晰明确的叫出某个控件的名称,也是一种专业性的体现!

1.状态栏 Status Bar/ 导航栏 Navigation Bar/ 标签栏 Tab Bar

2.工具栏 Toolbars

ios系统样式

3.搜索栏 Search Bar

4.浮层弹框/气泡弹出框/浮出框  Popover

5.编辑菜单  Edit Menu

6.工具提示/文字提示 Tooltips

常见网页端悬停状态

7.溢出菜单 Overflow Menu

安卓样式

8.对话框  Dialog/Alerts + 遮罩/蒙版 Mask

系统样式

9.吐司提示/弹出式提示  Toast

10.HUD

ios音量调节提示样式

11.动作菜单(动作栏)  Action Sheet/Activity View

ios系统样式

12.通告栏 Notification Bar/Notice Bar

13.Snackbar

属于安卓控件

14.输入框/文本框 Text Fields

15.列表 List

16.表单页眉页脚  Table View Header and Footer

17.开关 Switch

开关颜色可修改

18.步进器 Stepper

19.选择器/拾取器 Picker

单列选择器 iOS样式

日期选择器 Date Picker

时间选择器 Time Picker

20.页面指示器 Page Indicator/Page Controls

ios系统样式

21.Home指示器/Home条  Home Indicator

iPhone X系统样式

22.滑块 Slider

ios系统样式,也可自定义样式

23.进度条 Progress

ios系统样式

24.字母索引导航  A-Z Index Scroller

这种控件一般出现在页面右侧,点击字母可以快速找到字母对应内容的位置;

25.分段控件 Segment Controls

ios系统样式

26.标签 Tabs

来自安卓系统样式,现在ios也适用

27.卡片 Cards

28.小红点/徽标/徽章 Badge

29.加载占位图  Skeleton Screen

30.按钮 Button

按钮各种状态

31.悬浮按钮 Floating Action Button

Material Design中的一种设计语言,现在iOS内也会使用,常置于页面右下角,这种设计有利有弊,谨慎使用;

32.键盘/软键盘/虚拟键盘  Keyboard/Soft Keyboard/ Virtual Keyboard

33.单选按钮 Radio Button

34.复选框 Checkbox

35.九宫格 Grid

36.页脚 Footer

以上,欢迎留言补充~

参考链接:

https://zhuanlan.zhihu.com/c_87416856?utm_source=wechat_timeline&utm_medium=social&utm_member=ZWQwOWUyMmRmM2ZiNTlhODZhNGJmZjNhNmZkOGYwM2Q%3D%0A&from=timeline&isappinstalled=0

https://weui.io

原文地址:EasonZhangUED(公众号)

作者:Eason张UED

非特殊说明,本文版权归原作者所有,转载请注明出处!
本文地址:https://www.zuimeiui.cn/tutorials/2255.html

发表评论

微信扫一扫

微信扫一扫

微信扫一扫,分享到朋友圈

UI知识扫盲贴!我猜UI设计师你也没知道几个
返回顶部

显示

忘记密码?

显示

显示

获取验证码

Close