Android UI之原生——(1)、Android UI入門及常見屬性與現象

標籤：android   ui   android入門   

轉載請註明本文出自JFlex的部落格http://blog.csdn.net/jflex/article/details/46476599,請尊重他人的辛勤勞動成果，謝謝！

Android UI之原生——(1)、Android UI入門及常見屬性與現象

導讀 ：Android UI入門，對於很多人來講都是比較簡單的，教程也多如牛毛，但是這篇絕對和其他的不一樣。從接觸android開發就註定UI開發是一個一直需要研究的課題，簡單的原生UI使用可能你已經掌握，也可能發現某些組件有著一些不爽，但是只要你搞懂原因，就可以了。實在覺得用著不爽，那麼就讓自己的UI開發能力變強，然後自己寫個好點的。android UI開發需要先學會使用原生UI，然後在學會使用開源UI，最後才是自訂UI。按照這個順序才會不斷提升android UI開發的能力，一定要循序漸進。

一、一起來看看android UI1、xml和code分別畫出UI

1. xml的UI樣本（必須瞭解XML知識）
   樣本：res/layout/activity_main.xml

   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical">     <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginBottom="10dp"        android:text="這是一個TextView" /></LinearLayout>

   1、layout的組成：跟標籤可以是任意組件，但是只有繼承ViewGroup的組件才能包含子控制項
2、命名空間：android內建的命名空間，當然自訂群組件的時候，需要自訂命名空間
3、android的組件屬性：基本上都是按照英文單詞定義的，所以大部分都是很好理解，只需要多多練習就會記住

2. code的UI樣本（必須熟悉java語言）
   樣本：com/snicesoft/testlayout/MainActivity.java

   public class MainActivity extends Activity{    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //setContentView(R.layout.activity_main);        LinearLayout layout = new LinearLayout(this);        setContentView(layout);        TextView textView = new TextView(this);        textView.setText("我是代碼建立的TextView");        layout.addView(textView);    }}

   這裡只是簡單的例子。當然一般情況，xml實現的布局都可以通過java代碼實現，但是儘管這樣，還是推薦使用xml控制布局，這樣靈活性比較好，能夠分離UI。
   可能大家忽略一個問題，eclipse、android studio等IDE都提供了可視化介面開發，為啥沒提到。這裡說明下，可視化操作往往不能滿足更加細緻的UI製作，只能簡單產生控制項的輪廓代碼，如果需要製作精細的UI，那麼建議還是手動編寫xml，當然也不是很難，畢竟代碼提示還是很方便的。

2、怎麼給UI上色及資源適配

1. color的使用
   color基本上都需要存放在res\values\colors.xml或者res\color\
colors.xml

   <?xml version="1.0" encoding="utf-8"?><resources>    <color name="menu_txt_default">#333333</color>    <color name="menu_txt_checked">#48D1CC</color></resources>

2. drawable的使用
   
   1. drawable
      只需要將圖片copy到res/drawable-xxxx目錄下
      xml中使用@drawable/xxx
      java中使用R.drawable.xxx
   2. drawable適配：drawable-xxx
      ldpi：240x320
      mdpi：320x480
      hdpi：480x800、480x854
      xhdpi：至少960*720
      xxhdpi：1280×720
      注意：圖片僅支援png和jpg
3. 國際化處理（多語言）
   國際化處理主要體現在res上，解決辦法
   values檔案夾：values-國家語言
   比如：
   美國英文環境：values-en-rUS
   中文環境為：values-zh
   大陸地區中文環境： values-zh-cn
   具體更多的請查詢Locale這個類
   圖片資源以及其他資源也相同的配置

2、解析度有大有小，怎麼辦

解析度適配是android開發必備的技能。
一般的處理方式是：一份layout，通過不同解析度的values中定義dimens處理不同解析度需要的組件尺寸。
1. 常用布局
LinearLayout：線性布局，垂直和水平設定，使用比較多
RelativeLayout：相對布局，使用比較多
FrameLayout：層布局，多層View疊加處理。
TableLayout：表格版面配置，就像html中的table一樣
2. 多使用dimens

3、UI開發最佳規範

• layout盡量用最少的控制項完成需求，避免重複
• 布局複雜，多使用<inflate>
• id命名規範：組件縮寫+業務名，下面是部分組件縮寫
  
  • LayoutView：lv
  • RelativeView:rv
  • TextView:tv
  • ImageView:iv
  • ImageButton:im
  • Button:btn
• 多使用style，學會在layout中提取相同的style
• .9圖的製作
• 杜絕使用px
• layout中多使用strings.xml、dimens.xml、colors.xml中的值

二、常用的組件屬性手冊 1、通用屬性

android命名空間常用屬性

- 寬度：layout_width
取值：wrap_parent（根據內容動態計算）、match_parent（佔滿父布局）和具體的dp

平台	android	iOS	html
	layout_width	width	width

- 高度：layout_height
取值：wrap_parent、match_parent和具體的dp

平台	android	iOS	html
	layout_height	height	height

- layout_gravity

平台	android	iOS	html
	layout_gravity	無	無

- gravity

平台	android	iOS	html
	gravity	無	無

- 距離自身控制項間距：padding

平台	android	iOS	html
	padding	無	padding

- paddingLeft

平台	android	iOS	html
	paddingLeft	無	padding

- paddingTop

平台	android	iOS	html
	paddingTop	無	padding

- paddingRight

平台	android	iOS	html
	paddingRight	無	padding

- paddingBottom

平台	android	iOS	html
	paddingRight	無	padding

- 距離父控制項間距：margin

平台	android	iOS	html
	margin	無	margin

- marginLeft

平台	android	iOS	html
	marginLeft	無	margin

- marginTop

平台	android	iOS	html
	marginTop	無	margin

- marginRigth

平台	android	iOS	html
	marginRigth	無	margin

- marginBottom

平台	android	iOS	html
	marginBottom	無	margin

2、LinearLayout

• 方向：orientation
  取值：vertical或horizontal

平台	android	iOS	html
	orientation	無	無

3、RelativeLayout

RelativeLayout主要屬性配置其實是在其子控制項中配置，一下是常用的屬性

• align系列
  layout_alignParentLeft：相對父控制項左邊，取值true或false
  layout_alignParentTop：相對父控制項頂部，取值true或false
  layout_alignParentRight：相對父控制項右邊，取值true或false
  layout_alignParentBotton：相對父控制項底部，取值true或false
  layout_alignLeft：相對哪一個控制項的左邊，取值id
  layout_alignTop：相對哪一個控制項的頂部，取值id
  layout_alignRight：相對哪一個控制項的右邊，取值id
  layout_alignBottom：相對哪一個控制項的底部，取值id
• center系列
  layout_centerHorizontal：水平置中，取值true或false
  layout_centerVertical：垂直置中，取值true或false
  layout_centerInParent：水平和垂直置中，等價於上面兩個都為true，取值true或false

三、自訂群組件屬性使用1、自訂群組件

• 群組控制項：將現成的控制項綁定一起組合成新的組件，最簡單的方式是通過inflate layout實現
• 自訂屬性控制項：為了完善自訂群組件的可配置性，通過定義屬性，可以在layout中即時看到想要的效果。

2、自訂群組件的打包

• 純java編寫的組件：直接打包jar
• 組件包含layout布局：lib方式或者（jar+res）

四、原生組件常見現象1、Adapter的getView重複調用

比如ListView：當ListView的height設定為wrap_parent，則會出現getView重複執行；設定match_parent則正常

2、ScrollView、ListView、GridView之間的嵌套

嵌套常會出現ListView或者GridView的高度只顯示一行，需要重寫onMeasure方法

3、ListView、GridView等滑動View的overScrollMode

預設overScroll是有顏色動畫，本身是實現了類似iOS的反彈效果，但是為了避讓iOS的反彈效果專利，將其隱藏了。

五、最後

此博文將會不定期更新，因時間和思考不全面，當考慮到了將會添加進來，希望大家多多提意見。

Android UI之原生——(1)、Android UI入門及常見屬性與現象