粗談Android中的對齊


在談這個之前先啰嗦幾個概念。

基線:書寫英語單詞時為了規范書寫會設有四條線,從上至下第三條就是基線。基線對齊主要是為了兩個控件中顯示的英文單詞的基線對齊,如下所示:

  

Start:在看API的時候經常會有Start對齊,End對齊,Start對齊主要是為了能夠在不同的textDirection(文本排列方向)的時候更好的對齊的一種方式,在textDirection為LTR(從左到右)時Start對齊就等於左對齊,當textDirection為RTL(從右到左)時Start對齊就等於右對齊。End同理。

文本對齊

  通過gravity來實現view的文本對齊方式.先看下官方解釋。

  android:gravity:Specifies how to align the text by the view's x- and/or y-axis when the text is smaller than the view.

Must be one or more (separated by '|') of the following constant values.

  意思是說,當文本比view小的時候指定如何通過view的x、y軸線去對齊。這個屬性的值必須是下面給出的一個或多個,如果是多個則用'|'隔開。

  可以用的屬性有:topbottomleftrightcenter_verticalfill_verticalcenter_horizontalfill_horizontalcenterfillclip_verticalclip_horizontalstartend

  這些屬性中就談兩類,其他的類似,一個是上下左右這種基本類型的,還有一種是組合的,比如左下角,這是為:left|bottom。

  左對齊:

  

1 <TextView
2         android:layout_width="100dip"
3         android:layout_height="60dip"
4         android:layout_marginTop="10dip"
5         android:background="#ffff33"
6         android:gravity="left"
7         android:text="left" 
8 />

  左下角:

1  <TextView
2         android:layout_width="100dip"
3         android:layout_height="60dip"
4         android:layout_marginTop="10dip"
5         android:background="#ffff33"
6         android:gravity="left|bottom"
7         android:text="leftbottom"
8  />

  效果圖如下所示:

  

LinearLayout對齊

  gravity:Specifies how an object should position its content, on both the X and Y axes, within its own bounds.

Must be one or more (separated by '|') of the following constant values.

    意思是,規定了一個對象以什么樣的方式根據x、y軸去擺放自己的內容。這個屬性的值必須是下面給出的一個或多個,如果是多個則用'|'隔開。

    可以用的屬性有:topbottomleftrightcenter_verticalfill_verticalcenter_horizontalfill_horizontalcenterfillclip_verticalclip_horizontalstartend。

    同樣,這些屬性中就談兩類,其他的類似,一個是上下左右這種基本類型的,還有一種是組合的,比如左上角,這是為:left|bottom。

   居右對齊:

  

 1 <LinearLayout
 2         android:layout_width="match_parent"
 3         android:background="#0000ff"
 4         android:layout_height="0dip"
 5         android:gravity="right"
 6         android:layout_weight="1" >
 7         
 8         <Button 
 9             android:layout_height="wrap_content"
10             android:layout_width="wrap_content"
11             android:text="right"
12             />
13         
14 </LinearLayout>

  居左下角對齊:

 1 <LinearLayout
 2         android:layout_width="match_parent"
 3         android:background="#ffff33"
 4         android:layout_height="0dip"
 5         android:layout_marginTop="10dip"
 6         android:gravity="left|bottom"
 7         android:layout_weight="1" >
 8         
 9          <Button 
10             android:layout_height="wrap_content"
11             android:layout_width="wrap_content"
12             android:text="left_bottom"
13             />
14 </LinearLayout>

  效果圖如下:

  

RelativeLayout對象

  RelativeLayout主要用到相對位置的對齊,主要屬性有以下幾種

  

layout_above

該布局文件的底部設置到指定ID的對象的上方
layout_below

layout_alignBaseline

該布局文件的基線與指定ID的對象的基線對齊

layout_alignBottom

將該布局文件的底部域指定的ID的對象的底部對齊
 

layout_alignLeft


layout_alignRight
layout_alignTop

layout_alignStart

該布局文件的開始(左邊)與指定ID對象的開始(左邊)位置對齊

layout_alignEnd

該布局文件的結束(右邊)與指定ID對象的結束(右邊)位置對齊

layout_toLeftOf

該布局文件的右邊放到指定ID對象的左邊
類似:
layout_toStartOf

layout_toRightOf

該布局文件的左邊放到指定ID對象的右邊

layout_centerHorizontal

如果設置為true,則將該布局文件中的自對象設置為水平居中
layout_centerInParent
layout_centerVertical

layout_alignParentLeft

如果設置為true,則將該布局文件的左邊與其父對象的左邊對齊
layout_alignParentRight
layout_alignParentStart
layout_alignParentTop

layout_alignParentEnd

layout_alignParentBottom

   拿出兩個例子來簡單說明下,一個是將一個button放到另一個button右邊,另外一個是將一個button放到另一個button的右下角

  右邊:

  

 1  <RelativeLayout
 2         android:layout_width="match_parent"
 3         android:layout_height="wrap_content" >
 4 
 5         <Button
 6             android:id="@+id/btnStand"
 7             android:layout_width="wrap_content"
 8             android:layout_height="wrap_content"
 9             android:text="標准物1" />
10 
11         <Button
12             android:layout_width="100dip"
13             android:layout_height="wrap_content"
14             android:layout_toRightOf="@id/btnStand"
15             android:text="right->標准物1" />
16  </RelativeLayout>

 

  右下角:

 1 <RelativeLayout
 2         android:layout_width="match_parent"
 3         android:layout_height="wrap_content" >
 4 
 5         <Button
 6             android:id="@+id/btnStand2"
 7             android:layout_width="wrap_content"
 8             android:layout_height="wrap_content"
 9             android:text="標准物2" />
10 
11         <Button
12             android:layout_width="100dip"
13             android:layout_height="wrap_content"
14             android:layout_below="@id/btnStand2"
15             android:layout_toRightOf="@id/btnStand2"
16             android:text="right_bottom->標准物2" />
17 </RelativeLayout>

  效果圖如下所示:

 

后記:

  這次談的內容比較粗,僅作拋磚引玉用。

原文連接:http://www.cnblogs.com/luoaz/p/3719767.html

Demo下載地址:https://github.com/xiaoai-opensource/alignDemo


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM