UI切图命名

2017-3-04

UI文件命名规范常用字

正常:normal                   选中:selected                 按下:pressed                禁用:disabled

已访问:visited                鼠标悬停:hover               广告横幅:AD/banner

控件——较独立的可操作界面元素

部件——描述属于控件一部分

btn按钮:可点            icon图标:不可点、非点击主体、图案部件

sign 标记                     list 列表                     menu 菜单                    view 视图

panel 面板                   sheet薄板:底部弹出菜单                              bar栏

statusbar状态栏              navibar导航栏                  tabbar标签栏 

sidebar侧栏                     toolbar工具栏                   switch切换开关

slider滑动器                     radio单选框                       checkbox复选框

bg背景:部件                  mask蒙版/遮罩

常用补充描述

top顶部                             middle中间                         bottom底部

first第一                             second第二                        last最后

header页头                       footer页脚                           content内容

main页面主体                   上导航:nav                        下标签:tab

按钮:btn                        按钮文字:btntext               单选框:rb

复选框:chb                    输入:ip                               下拉:cbb

启动界面default

启动图片:default.png

启动logo:default_logo.png

登陆界面login

登陆背景:login_bg.png

登陆logo:login_logo.png

输入框选中状态:login_input_pre.png

登录按钮选中状态:login_btn_pre.png

PS:安卓下input、btn、list等图片可用.9png格式图片

导航栏按钮nav

nav_功能描述.png

如:nav_menu.pngnav_menu_pre.png

(同一个按钮前后两种状态)

左侧导航

leftbar_功能描述.png

如:lefterbar_info.pngnav_info_pre.png

(个人中心)

底部菜单按钮

tab_功能描述.png

如:tab_set.pngnav_set_pre.png

(设置)

主页面

home_功能描述.png

如:home_btn_recommended.png

(热门推荐)

PS:描述可用英文、拼间开头字母组合等

列表页

list_功能描述.png

如:list_menu_collect.png

(列表页收藏按钮)

可重复使用按钮btn

btn_功能描述.png

一般:btn_xxx_n.png

选中:btn_xxx_s.png复选时出现

点击:btn_xxx_h.png

不能点击:btn_xxx_d.png

如:btn_blue.png、btn_blue.9.png

(蓝色按钮)

图命名

图示:icon_xxx.png

图片:img_xxx.png、pic_xxx.png

照片:pho_xxx.png

最小icon不小于44最小可点击区域不小于88


UI切图命名_第1张图片

你可能感兴趣的:(UI切图命名)