切图命名

通用切片命名格式:

组件_类别_功能_状态@2x.png

举例:[email protected]

(对应中文:标签栏_图标_主页_默认@2x.png)

启动页面

default.png(启动图片)

default_logo.png(启动logo)

登录界面(login)

login_bg.png(登录背景)

login_logo.png(登录logo)

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-n.png

点击(highlight):btn-xxx-n.png

不能点击(disabled):btn-xxx-d.png

选中(selected):btn-xxx-s.png

btn_(功能属性或色彩均可).png

其他命名:

图示:icon-xxx.png

图片:pic-xxx.png

照片:pho-xxx.png

左侧导航:

leftbar_(功能描述).png

如:leftbar_info.png\leftbar_info_per.png(个人中心)

TabBar(底部选项卡按钮)

如:tab_set.png(设置)

主页命名

home_(功能属性+描述).png

如:home_menu_recommended.png(热门推荐)

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

列表页命名规则:

list_(功能属性+描述).png

如:list_menu_collect.png(列表页收藏按钮)

UI文件命名规范常用字

normal(正常)  pressed(按下) selected(选中) disabled(禁用) visited(已访问) hover(悬停)


控件&部件(控件:较独立的可操作界面元素 部件:描述属于某控件的一部分)

btn(按钮:可点)

icon(图标:不可点、非点击主体、图案部件)

sign(标记)

list(列表)

menu(菜单)

view(视图)

panel(面板)

sheet(薄板:底部弹出菜单)

bar(栏)

statusbar(状态栏)

navibar(导航栏)

toolbar(工具栏)

switch(切换开关)

slider(滑动器)

radio(单选框) checkbox(复选框)

bg(背景) mask(蒙板、遮罩)

常用补充描述

top(顶部)

middle(中间)

bottom(底部)

first(第一)

last(第二)

header(页头)

footer(页脚)


bg(backgrond 背景)

nav(navbar 导航栏)

tab(tabbar 标签栏)

btn(button 按钮)

img(image 图片)

del(delete 删除)

msg(message 提示信息)

pop(pop up 弹出)

icon(图标)

selected(选中)

disabled(不可点击)

default(默认)

pressed(按下)

back(返回)

edit(编辑)

content(内容)

left/center/right(左/中/右)

logo(标识)

login(登录)

refresh(刷新)

banner(广告)

link(链接)

user(用户)

download(下载)

note(注释)

切图命名_第1张图片

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