2011-07-01 148 views
2

我想我現在的觀點分爲4個區域(不把屏幕劃分爲4,但劃分視圖)類似以下內容:如何實現這種佈局?

我想有一種觀點以下尺寸的佈局:

enter image description here

這是水平劃分到不同的視圖的一半。垂直方向,上方區域有1/3視圖高度和下方兩個區域持有2/3視圖高度。

我做成功分我的看法分爲4個大小相同的區域由:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical"> 
    <LinearLayout 
     android:id="@+id/top_area" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1" 
     android:orientation="horizontal" 


    > 
     <LinearLayout 
      android:id="@+id/top_left_area" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:layout_weight="1" 
      android:background="@drawable/content_blue_bg" 
      > 
      <TextView 

       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:text="TOP LEFT"/> 
     </LinearLayout> 

     <LinearLayout 
      android:id="@+id/top_right_area" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:layout_weight="1" 
      android:background="@drawable/content_blue_bg" 
      > 
      <TextView 

       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:text="TOP RIGHT"/> 
     </LinearLayout> 

    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/bottom_area" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1"  
     android:orientation="horizontal" 
     > 

     <LinearLayout 
      android:id="@+id/bottom_left_area" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 

      > 

       <TextView 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:text="BOTTOM LEFT"/> 
     </LinearLayout> 

     <LinearLayout 
      android:id="@+id/bottom_right_area" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:layout_weight="1" 
      android:background="@drawable/content_blue_bg" 
      > 
      <TextView 

       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:text="BOTTOM RIGHT"/> 
     </LinearLayout> 
    </LinearLayout> 

</LinearLayout> 

但我怎麼能有對UPER領域下部1/3視圖高度和2/3視圖高度領域?

回答

3
<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" 
android:orientation="vertical"> 
<LinearLayout 
    android:id="@+id/top_area" 
    android:layout_width="fill_parent" 
    android:layout_height="0dip" 
    android:layout_weight="1" 
    android:orientation="horizontal" 
> 
    <LinearLayout 
     android:id="@+id/top_left_area" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1" 
     android:background="@drawable/content_blue_bg" 
     > 
     <TextView 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:text="TOP LEFT"/> 
    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/top_right_area" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1" 
     android:background="@drawable/content_blue_bg" 
     > 
     <TextView 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:text="TOP RIGHT"/> 
    </LinearLayout> 
</LinearLayout> 

<LinearLayout 
    android:id="@+id/bottom_area" 
    android:layout_width="fill_parent" 
    android:layout_height="0dip" 
    android:layout_weight="2"  
    android:orientation="horizontal" 
    > 
    <LinearLayout 
     android:id="@+id/bottom_left_area" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1" 
     > 

      <TextView 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:text="BOTTOM LEFT"/> 
    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/bottom_right_area" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="1" 
     android:background="@drawable/content_blue_bg" 
     > 
     <TextView 

      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:text="BOTTOM RIGHT"/> 
    </LinearLayout> 
</LinearLayout> 

所有你缺少的是底部佈局,70%和頂部佈局設置到30%

這剛剛被貼在我的Twitter http://blog.stylingandroid.com/archives/297 :-)

1

只需更改bottom_area LinearLayout的android:layout_weight2而不是1