android開發-界面設計基本知識

-Advertisement-

一個好的APP不僅有美觀，好看的界面，更需要良好的性能和穩定性。作為一名開發人員，需要理解界面設計原則並寫出優秀的界面設計代碼。本章主要講述基本控制項的使用，界面佈局及一些常用的界面設計屬性。 (1) LinearLayout 相對佈局 android:android:layout_weight=”

一個好的APP不僅有美觀，好看的界面，更需要良好的性能和穩定性。作為一名開發人員，需要理解界面設計原則並寫出優秀的界面設計代碼。

本章主要講述基本控制項的使用，界面佈局及一些常用的界面設計屬性。

1.常用佈局

(1) LinearLayout 相對佈局

android:android:layout_weight=”1”    //百分比屬性
android:layout_above                        //表示與某個元素綁定後，在某個元素之上
android:layout_toLeftOf // 表示與某個元素綁定後，在某個元素左邊
android:layout_alignLeft //依賴於某個元素的左邊（平行對齊）
android:layout_margin    //表示與邊界的距離，沒有方向的margin是與四邊的距離
android:padding                                           //是內邊距

android:orientation=”vertical” //垂直展示子控制項列表

android:orientation=”horizontal” //水平展示子控制項列表

控制項可見性設置：

設置成gone為隱藏（完全不在，不占用空間）

設置成invisible不可見（看不見，但還存在，占用空間）

(2) RelativeLayout
android:layout_alignParentRight //相對於父控制項；
android：layout_toRightOf //相對於xx控制項
android：alighLeft //控制項左邊和某控制項的左邊平行

(3)FrameLayout 幀佈局

控制項會一直疊加在一起

(4)AbsoluteLayout（很少用）

android不建議用，因為android屏幕很多

(5)TableLayout（很少用）

2.佈局技巧及優化

Android佈局官方建議不超過10層。
佈局儘量用相對佈局，儘量使用layout_above、layout_toLeftOf、layout_alignLeft、layout_margin、padding等方法達到想要的佈局效果。
重用佈局文件
減少視圖層級，替換相應的層級開頭，並不會改變層級的結構
需要時才載入
不要嵌套多個使用layout_weight屬性的LinearLayout
<include /> 重用佈局文件
<merge /> 減少視圖層級

兩個小工具：

Android lint：刪除無用的資源、佈局、文件、引用、類、控制項。
HierarchyViewer：分析佈局層級

巧用LayoutInflater

LayoutInflater(載入資源文件格式)

LayoutInflater 是一個抽象類。LayoutInflater這個類，它的作用類似於findViewById()；不同點是LayoutInflater是用來找res/layout/下的xml佈局文件，並且實例化；而 findViewById()是找xml佈局文件下的具體widget控制項。

在文檔中如下聲明： public abstract class LayoutInflater extends Object

LayoutInflater inflater = getLayoutInflater();//調用Activity的getLayoutInflater()
LayoutInflater inflater = LayoutInflater.from(context);
LayoutInflater inflater = (LayoutInflater)context.getSystemService
(Context.LAYOUT_INFLATER_SERVICE);

layoutInflater在項目中的使用實例代碼：

LayoutInflater inflater = (LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE);

View view = inflater.inflate(R.layout.custom, (ViewGroup)findViewById(R.id.test));

EditText editText = (EditText)view.findViewById(R.id.content);

對於上面代碼，指定了第二個參數 ViewGroup root，當然你也可以設置為 null 值。

View復用

View復用可以有效的提高頁面載入的速度，從而提高整體程式的性能。View復用舉例如下：

 1 public View getView(int i, View view, ViewGroup viewGroup) {
 2         LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 3 
 4         ViewHolder viewHolder;
 5         //1、view復用：只有當view為空時，才讀取xml佈局文件；不為空則繼續使用view，取控制項。
 6         if (view == null) {
 7             view = inflater.inflate(R.layout.item_listview, null);
 8             viewHolder = new ViewHolder();
 9             viewHolder.avatarImageView = (ImageView) view.findViewById(R.id.avatar_imageview);
10             viewHolder.nameTextView = (TextView) view.findViewById(R.id.item_name);
11             viewHolder.ageTextView = (TextView) view.findViewById(R.id.item_age);
12 
13             //打標簽
14             view.setTag(viewHolder);
15         } else {
16             viewHolder = (ViewHolder) view.getTag();
17         }
18 
19         viewHolder.avatarImageView.setImageResource(R.drawable.avatar);
20         viewHolder.nameTextView.setText(mUserInfo.get(i).getName());
21         viewHolder.ageTextView.setText(mUserInfo.get(i).getAge() + "");
22 
23         return view;
24     }
25 }
26 //2、創建一個類，用於緩存控制項。
27 class ViewHolder {
28     ImageView avatarImageView;
29     TextView nameTextView;
30     TextView ageTextView;
31 }

ViewDemo

3.常用數據控制項

android中常用的數據控制項包括,ScrollView，GridView，ListView。作為數據交互，一般會結合adapter使用。

Adapter是連接後端數據和前端顯示的適配器介面，是數據和UI（View）之間一個重要的紐帶。在常見的View(ListView,GridView) 等地方都需要用到Adapter。如下圖直觀的表達了Data、Adapter、View三者的關係：

您的分享是我們最大的動力!

-Advertisement-