android 系统的切图方式_App切图命名规范

1、常见界面、控件、功能、状态命名集合：

APP产品经理、APP设计师、APP开发工程师，包括H5前端开发人员都可以记住的文件命名规范。

免费视频教程：www.mlxs.top

免费视频教程：www.mlxs.top

免费视频教程：www.mlxs.top

2、以iOS为范例(安卓通用)的切片文件命名规范如下：

个人觉得标识符命名原则，尽可能的用最少的字符而又能完整的表达标识符的含义（如：Navigation bar可以缩减成nav）。

免费视频教程：www.mlxs.top

总之，切图命名规范的要求

1、所有命名全部为小写英文字母

原因是开发小哥哥的代码里面全是小写的英文字母，如何切图命名成中文的话，会导致开发小哥哥将命名全部更改，这样会耽误产品开发的进度。

2、所有命名不得出现大写以及中文和空格或其他符号，单词之间用_隔开

• 切图格式：Png格式
• 通用切片命名格式：组件_类别_功能_状态@2x.png

举例：

tabbar_icon_home_default@2x.png（中文对应的是：标签栏_图标_主页_默认@2x.png）

模块特有切图命名规则

模块_类别_功能_状态 @2x.png

举例：

mail_icon_search_pressed@2x.png（对应的中文为：邮件_图标_搜索_ 默认@2x.png）

如果出现了很多图标的时候，可以命名为icon1、icon2、icon3...等，这样就不会出现重复的命名了。

大家可以举一反三，例如同一个banner广告位有三条banner，可以命名为banner1、banner2、banner3等。

目前市场上有很多切图插件，虽然切图插件众多，但是我们团队用的最多的就是蓝湖，蓝湖有很多插件，并且可以自动标注，设计图可以树状连线，一键切图，还可以制作交互原型，产品文档共享。

• Axure 插件
• Sketch 插件
• Photoshop 插件
• Adobe XD 插件

常用英文单词表：

如果所有命名都写为全称，名字就会特别长，所以我们可以将一些常用的英文单词进行缩写，减少工作成本与开发代码资源。至于怎么缩写，只要整个团队能够达成共识并且输出一份缩写清单，任何缩写规则都是可以的。

下面提供一些命名时常用的英文单词列表（有些是已经缩写过的，仅供参考）

• 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. 自身层面

对我们自己的文件整理有很大的帮助，后期修改文件、图层的时候更加方便快捷，而且规范的命名也显得我们自身比较专业。

2. 团队层面

如果命名不统一，大家就很难达成共识，任务交接时需要很大的学习成本，所以规范的命名对于团队协同也有极大的推动作用。

3. 开发层面

这一点是最重要的，可以极大的节省程序开发的时间成本，减少很多不必要的沟通与重复切图的概率，因为只要我们的命名足够规范，并且和开发达成共识，他们完全可以直接使用的我们切片而不更改切片的名称，后期我们更换切图，只要切片名称不变，开发看都不用看直接替换就可以了。

总结

1、Android平台不支持“-”，所以请用“_”作为连接符。

2、按钮一共有四种状态：

normal：正常情况下的状态。

highlighted：突出显示，即用户点击按钮不放时按钮的状态。

selected：选中的状态。

disabled：不可用状态。最典型的例子就是iPod touch中的拨打电话和发送短信的按钮

其中disabled状态极少出现。在iOS 上开发能在使用者点击按钮时将原图变暗做为点击提示，所以不需要highlight状态下的切图。但Android平台highlight状态下就需要设计并切图。

关于切图命名规范就到这里了，有什么不懂的、不明白的地方，要多去和开发的同事请教和沟通，去了解所有表层背后的思考与逻辑，也许下一个规范就是你制定的！

免费视频教程：www.mlxs.top