|
关于UI界面的切图命名的规范,关键是在于团队能够有一个统一的规则,所以这里只介绍一种通用的命名规则,当然大家也可以根据自己的实际情况去制定,这里只提供一种方法与思路,仅供参考。
规范的命名方式可以提高开发人员的开发效率和整个开发团队的友好合作。要尽可能用最少的字符而又能完整的表达标识符的含义。
一、 切图命名英文缩写的3个原则 1. 较短的单词可通过去掉“元音”形成缩写 2. 较长的单词可取单词的头部几个字母形成缩写 3. 还有一些约定俗成的英文单词缩写
二、命名规则 模块_类别_功能_状态.png 举个栗子:nav_button_search_default.png 释义为:导航_按钮_搜索_默认.png
启动界面(default): 启动图片 default.png 启动logo default_logo.png 如:default.png\defoult@2x.png\defauLt-568@2x.png
登录界面(login) 登录背景 login_bg.png 登录logo login_logo.png 输入框 login_input.png 输入框选中状态 login_input_pre.png 登录按钮 login_btn.png 登录按钮选中状态 login_btn_pre.png
导航栏按钮 (nav) 命名 nav_功能描述.png 如:nav_menu.png\nav_menu_pre.png(同按钮选中前后两种状态命名 )
按钮命名(btn可重复使用按钮) 一般 normal btn_xxx_normal.png 点击 highlight btn_xxx_highlight.png 不能点击 disabled btn_xxx_disable.png 按下 pressed btn_xxx_pressed.png 选中 selected btn_xxx_selected.png 做为复数选择出现机会不高 btn_功能属性或色彩均可.png 如:btn_blue.png\btn_blue.9.png 蓝色按钮
其他命名 图标 icon_xxx.png 图片 pic_xxx.png或是img_xxx.png 照片 pho_xxx.png 左侧导航 命名 leftbar_功能描述.png 如:leftbar_info.png\leftbar_info_pre.png 个人中心
底部选项卡按钮(TabBar) 命名 Tab_功能描述.png 如:tab_set.Png\nav_set_pre.png 设置
主页命名 命名 home_功能属性+描述.png 如:home_menu_recommended.png 热门推荐 ps:描述可用英文或拼间开头字母组合等
列表页命名规则 命名 List_功能属性+描述.png 如:list_menu_collect.png 列表页收藏按钮
UI文件命名规范常用词 常用状态 正常 normat 按下 pressed 选中 selected 禁用 disabled 已访问 visited 悬停 hover
控件&部件 控件:较独立的可操作界面元素 部件:描述属于某控件一部分
按钮(可点) Btn 图标 Icon不可点、非点击主体、图案部件 标记 Sign 列表 List 菜单 Menu 视图 View 面板 Panel 薄板 Sheet 底部弹出菜单 栏 Bar 状态栏 StatusBar 导航栏 NaviBar 标签栏 TabBar 工具栏 ToolBar 切换开关 Switch 滑动器 Slider 单选框 Radio 复选框 CheckBox 背景 Bg 蒙版、遮罩 Mask 收藏 collect 评论 comment 广告 ad 时间 time 音频 audio 视频 viedio 不喜欢 dilike 用户 user 首页 hone 排名 ranked 搜索 search 标志 logo 进度条 progress bar 默认图片 def_ 分隔图片 seg_ 选 择 sel_ 关闭 close 返回 back 编辑 eidt 内容 content 左 中 右 left center right 提示信息 msg 个人资料 porfile 弹出 pop 删除 delete 下载 download 登录 login 注册 regsiter 标题title 注释 note 链接 link 图片 image(img) 刷新 refresh
常用补充描述 顶部 Top 中间 Middle 底部 Bottom 第一 First 第二 Second 最后 Last 页头 Header 页脚 Footer |
本文共分 1 页 |
上一篇:用JS限制网页只能在微信浏览器打开 下一篇:phpexcel中文教程-设置表格字体颜色背景样式、数据格式、对齐方式、添加图片、批注、文字块、合并拆分单元格、单元格密码保护 |
|
意汇 · 与您相约 需要网站建设和系统开发的伙伴们,赶紧约起来! |
||||||
|
|
|