Android中的多行和列布局

Question

我想在Android中创建以下布局。

什么是实现多个屏幕尺寸这个UI的最佳布局？我试图使用LinearLayout并设置layout_weight，但第二行将需要另一个layout_weight，这对性能不利。我也尝试过使用TableLayout，但由于大图像大小，第三行并未出现。

我应该使用LinearLayout并为每个屏幕大小（mdpi，hdpi等）创建图像吗？

任何帮助表示赞赏。谢谢。

Answer 1

以下是您需要的lyout。除非明智地使用，否则使用体重不是性能问题。性能问题只有在使用过多的嵌套布局时才会发生。无论何时我们正在开发支持多种分辨率的屏幕，重量是最好的选择。

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" > 

    <ImageView 
     android:id="@+id/img_1" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="@drawable/ic_launcher" /> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:weightSum="2"> 

     <ImageView 
      android:layout_weight="1" 
      android:id="@+id/img_2" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/ic_launcher" /> 

     <ImageView 
      android:layout_weight="1" 
      android:id="@+id/img_3" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/ic_launcher" /> 
    </LinearLayout> 

    <ImageView 
     android:id="@+id/img_1" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="@drawable/ic_launcher" /> 
</LinearLayout> 

Answer 2

试试这个方法。这是一个在所有屏幕上都进行了有效的布局设计工作。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" > 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" > 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:src="@drawable/ic_launcher" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" > 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:src="@drawable/ic_launcher" /> 

     <ImageView 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:src="@drawable/ic_launcher" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" > 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:src="@drawable/ic_launcher" /> 
    </LinearLayout> 

</LinearLayout> 

输出

Answer 3

这里的布局的轮廓

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent" > 

<ImageView 
    android:id="@+id/image_1" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_alignParentTop="true" 
    android:scaleType="fitXY" 
    android:background="@android:color/transparent" 
    android:src="@drawable/abox"/> 

<LinearLayout 
    android:id="@+id/lin_lt" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:weightSum="10" 
    android:orientation="horizontal" 
    android:layout_below="@+id/image_1"> 
    <ImageView 
    android:id="@+id/image_2" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_weight="5" 
    android:scaleType="fitXY" 
    android:src="@drawable/abox" 
    android:background="@android:color/transparent"/> 
    <ImageView 
    android:id="@+id/image_3" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_weight="5" 
    android:scaleType="fitXY" 
    android:src="@drawable/abox" 
    android:background="@android:color/transparent"/> 
</LinearLayout> 
<ImageView 
    android:id="@+id/image_4" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/lin_lt" 
    android:scaleType="fitXY" 
    android:src="@drawable/abox" 
    android:background="@android:color/transparent"/> 

</RelativeLayout> 

可以摆脱的LinearLayout，如果您为每个屏幕提供适当大小的图像大小/密度组。对于每种屏幕尺寸/密度使用适当大小的图像或使用9张图像，总是一个更好的主意。