整体流程
- 明确外部要求：
- 确定UI设计基于什么样的分辨率。比如640*1136（这是iPhone5的分辨率）。
- 确定目标适配的机型。现在通用机型为720p和1080p。
一般而言，720p指720*1280，1080p指1080*1920。
-
制作px映射表。（方法参考：Android界面开发精要1：尺寸）
-
根据UI视觉标准，配置基本的颜色、大小和通用样式。（方法参考：Android 视觉样式设计规范）
-
根据原型、页面分解图、项目排期，明确开发的页面的先后顺序。
常规而言，登录注册、个人中心 等模块会最先开发，消息、通知 等模块会最后开发。
-
按照UI视觉设计稿，逐步绘制每个页面。
-
layout的命名规则
-
所有基于Fragment和DialogFragment的核心页面都必须采用
fragment_模块名的形式命名 -
针对List item页面采用
item_模块名的形式命名 -
针对Dialog页面采用
dialog_模块名的形式命名 -
针对PopupWindow页面采用
popup_模块名的形式命名
绘制原则
- 用
dp代替px，用dimen定义代替裸dp，即采用px映射表。 - 尽可能用线性布局、帧布局，避免相对布局，这样在这个过程中就不需要定义控件的id这个属性值。
万一真的需要用到id值，用
pos_作为前缀，表示作为定位使用。
- 每个Button按钮最好有各种状态的变化，至少有两种。（所有按钮应该要有一个background的点击响应）
- 所有文本保存在strings.xml里面：
- 对于不定长的内容，如地址、用户输入的文本等，必须采用超长文本做压力测试。
- 对于用户协议等不变的文本直接引用相关文本即可。
- 每个控件尽可能用style引用相关样式。样式的名称为
功能_控件名称_级别，采用驼峰形式，控件名称和级别可忽略
<!-- 容器类控件 -->
<style name="PandaTheme.Contain" parent="PandaTheme">
<item name="android:background">@drawable/btn_bg</item>
</style>
<!-- 输入类控件 -->
<style name="PandaTheme.Input" parent="PandaTheme">
</style>
<!-- 点击类控件 -->
<style name="PandaTheme.Button" parent="PandaTheme">
</style>
<!-- 展示类控件 -->
<style name="PandaTheme.Show" parent="PandaTheme">
</style>
- 字体颜色的变化要用xml绘制。
- ImageView加上scaleType="centerCrop"
- 所有的字符chuan定义都要引用strings.xml的内容，而不是直接定义。
- 输入型控件不要设置text，而是设置hint。
- 在Androidmanifest.xml中用label属性标志页面的名称。
参考代码
- 绘制各种状态下的Drawable
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/main_nav0_normal" android:state_selected="false"/>
<item android:drawable="@drawable/main_nav0_selected" android:state_selected="true"/>
</selector>
- 绘制GridView
<GridView
android:id="@+id/net_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:horizontalSpacing="@dimen/width_720_1280_2"
android:numColumns="2"
android:verticalSpacing="@dimen/height_720_1280_2"
tools:listitem="@layout/item_nearby" />
网友评论