整體流程
- 明確外部要求：
- 確定UI設(shè)計(jì)基于什么樣的分辨率钓账。比如640*1136（這是iPhone5的分辨率）却盘。
- 確定目標(biāo)適配的機(jī)型〔龋現(xiàn)在通用機(jī)型為720p和1080p迈套。
一般而言，720p指720*1280拓诸，1080p指1080*1920侵佃。
制作px映射表。（方法參考：Android界面開(kāi)發(fā)精要1：尺寸）
根據(jù)UI視覺(jué)標(biāo)準(zhǔn)恰响，配置基本的顏色趣钱、大小和通用樣式涌献。（方法參考：Android 視覺(jué)樣式設(shè)計(jì)規(guī)范）
根據(jù)原型胚宦、頁(yè)面分解圖、項(xiàng)目排期燕垃，明確開(kāi)發(fā)的頁(yè)面的先后順序枢劝。
常規(guī)而言，登錄注冊(cè)卜壕、個(gè)人中心 等模塊會(huì)最先開(kāi)發(fā)您旁，消息、通知 等模塊會(huì)最后開(kāi)發(fā)轴捎。
按照UI視覺(jué)設(shè)計(jì)稿鹤盒，逐步繪制每個(gè)頁(yè)面。
layout的命名規(guī)則
所有基于Fragment和DialogFragment的核心頁(yè)面都必須采用
fragment_模塊名的形式命名針對(duì)List item頁(yè)面采用
item_模塊名的形式命名針對(duì)Dialog頁(yè)面采用
dialog_模塊名的形式命名針對(duì)PopupWindow頁(yè)面采用
popup_模塊名的形式命名
繪制原則
- 用
dp代替px侦副，用dimen定義代替裸dp侦锯，即采用px映射表。 - 盡可能用線性布局秦驯、幀布局尺碰，避免相對(duì)布局，這樣在這個(gè)過(guò)程中就不需要定義控件的id這個(gè)屬性值译隘。
萬(wàn)一真的需要用到id值亲桥，用
pos_作為前綴，表示作為定位使用固耘。
- 每個(gè)Button按鈕最好有各種狀態(tài)的變化题篷，至少有兩種。（所有按鈕應(yīng)該要有一個(gè)background的點(diǎn)擊響應(yīng)）
- 所有文本保存在strings.xml里面：
- 對(duì)于不定長(zhǎng)的內(nèi)容厅目，如地址番枚、用戶輸入的文本等偿枕，必須采用超長(zhǎng)文本做壓力測(cè)試。
- 對(duì)于用戶協(xié)議等不變的文本直接引用相關(guān)文本即可户辫。
- 每個(gè)控件盡可能用style引用相關(guān)樣式渐夸。樣式的名稱為
功能_控件名稱_級(jí)別，采用駝峰形式渔欢，控件名稱和級(jí)別可忽略
<!-- 容器類控件 -->
<style name="PandaTheme.Contain" parent="PandaTheme">
<item name="android:background">@drawable/btn_bg</item>
</style>
<!-- 輸入類控件 -->
<style name="PandaTheme.Input" parent="PandaTheme">
</style>
<!-- 點(diǎn)擊類控件 -->
<style name="PandaTheme.Button" parent="PandaTheme">
</style>
<!-- 展示類控件 -->
<style name="PandaTheme.Show" parent="PandaTheme">
</style>
- 字體顏色的變化要用xml繪制墓塌。
- ImageView加上scaleType="centerCrop"
- 所有的字符chuan定義都要引用strings.xml的內(nèi)容，而不是直接定義奥额。
- 輸入型控件不要設(shè)置text苫幢，而是設(shè)置hint。
- 在Androidmanifest.xml中用label屬性標(biāo)志頁(yè)面的名稱垫挨。
參考代碼
- 繪制各種狀態(tài)下的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" />
