GridLayout与TableLayout布局

记录下GridLayout与TableLayout布局的一些知识点，这两个布局对比起来弄，感觉明显比较更能加深印象。

GridLayout的使用设置：

GridLayout 布局在 Level14才被支持，之前版本要使用的话，要按以下步骤设置:

1. import -> Existing Android Code Into Workspace
2. 选择目录: 在sdk下的GridLayout目录
sdk\extras\android\support\v7\gridlayout
3. 勾选"Copy projects into workspace"

TableLayout 的一些不足:
至于有了TableLayout又搞个GridLayout的原因，简单试了下TableLayout，我认为至少有下面两个原因
1.不能同时向水平和垂直方向做控件的对齐
TableLayout继承了LinearLayout,因此只能向一个方向做控件的对齐。

2.不能跨行跨列
因为TableLayout,不明确指定包含多少行，多少列，而是通过向TableRow里面添加其他组件，每添加一个组件该表格就增加一列。
如果向TableLayout里面添加组件，那么该组件就直接占用一行。所以这种方式造成控件不能跨行跨列。
而GridLayout，则用columnCount设置列数后，增加的控件在超过列数后自动换行进行排列。

简单汇总下TableLayout的特点:
Shrinkable : 该列的宽度可以进行收缩，以使表格能够适应父容器的大小
Stretchable : 该列可以进行拉伸，以填满表格中空闲的空间
Collapsed : 该列将会被隐藏

GridLayout的特点:
android:layout_row : 固定显示在第几行。
android:layout_column : 固定显示在第几列，前面几列没控件的话就空着。
android:layout_rowSpan : 跨几行
android:layout_columnSpan: 跨几列

用GridLayout弄计算器的例子都烂大街了，自己写了个好玩的例子来展示下这两个布局:

代码如下:

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center" 
    android:orientation="vertical"
    android:rowCount="5"
    android:columnCount="4"    
    android:background="#FFE4C4" 
   >  
  <ImageView      
        android:layout_column="0"
        android:layout_gravity="left|top"
        android:layout_row="0"
        android:src="@drawable/emoji_436" />
   
  <TextView                           
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_gravity="left|top"                        
          android:layout_row="0"
          android:layout_column="1"
          android:layout_columnSpan="2"
          android:background="@drawable/chatfrom_bg_app_normal" 
    android:text="我喜欢你......（表白进行中）"                         
        />  
           
   <TextView                               
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_gravity="right|top"
           android:layout_row="1"
          android:layout_column="1"
          android:layout_columnSpan="2"
           android:background="@drawable/chatto_bg_focused"                          
      android:text="一公斤苹果等于多少克?"            
           />  
           
    <ImageView      
        android:layout_column="3"
        android:layout_gravity="right|top"
        android:layout_row="1"
        android:src="@drawable/emoji_443" />
    
     <ImageView       
        android:layout_column="0"
        android:layout_gravity="left|top"
        android:layout_row="2"
        android:src="@drawable/emoji_436" />
          
      <TextView                          
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_gravity="left|top"                        
          android:layout_row="2"
          android:layout_column="1"
          android:layout_columnSpan="2"
          android:background="@drawable/chatfrom_bg_app_normal" 
    android:text="啊，1024..."                         
        />             
   <TextView                            
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_gravity="right|top"
           android:layout_row="3"
          android:layout_column="1"
          android:layout_columnSpan="2"
           android:background="@drawable/chatto_bg_focused"                          
      android:text="嗯，你是一个好人.但..."            
           />  
                
      <ImageView
        android:id="@+id/imageView1"
        android:layout_column="3"
        android:layout_gravity="right|top"
        android:layout_row="3"
        android:src="@drawable/emoji_443" />
     
        <TableLayout 
         android:id="@+id/tablelayout1"            
         android:layout_row="4"
         android:layout_column="0"
         android:layout_columnSpan="4"
                     
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content"
  android:shrinkColumns="1" 
  android:stretchColumns="2">
 
  <!-- 在TableLayout中，在TableRow以外，直接添加的对象会独占一行 -->
  <Button android:text="上面GridLayout,下面是TableLayout"/>
  <TableRow>
   <TextView
         android:id="@+id/imageView222"
         android:background="@drawable/chatto_bg_voiceforward_focused"
          android:text="好人卡1"   />
   
   <TextView
         android:id="@+id/imageView222"
         android:background="@drawable/chatto_bg_voiceforward_focused"
          android:text="好人卡2"   />
    
   <TextView
         android:id="@+id/imageView222"
         android:background="@drawable/chatto_bg_voiceforward_focused"
          android:text="好人卡3"   />
  </TableRow>
 </TableLayout>
     
</GridLayout>

MAIL: xcl_168@aliyun.com

BLOG: http://blog.csdn.net/xcl168