4

我LinearLayout随着屏幕方向的变化而变化。在纵向模式下，它看起来很完美：

人像模式

但在横向模式下，它看起来像这样：

横向模式

如何修复我的 UI 以在两种模式下看起来相同？

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/border"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/imgfourth1"
            android:layout_width="70dp"
            android:layout_height="50dp"
            android:layout_marginRight="25dp"
            android:layout_marginLeft="25dp"
            android:paddingTop="2dp"    
            android:src="@drawable/amlet1" />

        <ImageView
            android:id="@+id/imgfourth2"
            android:layout_width="70dp"
            android:paddingTop="2dp"
            android:layout_height="50dp"  
            android:layout_marginRight="25dp"    
            android:contentDescription="@null"
            android:src="@drawable/lnch1" />

        <ImageView
            android:id="@+id/imgfourth3"
            android:layout_marginRight="25dp"
            android:paddingLeft="20dp"
            android:layout_width="70dp"
            android:layout_height="50dp"
            android:paddingTop="2dp"
            android:contentDescription="@null"   
            android:src="@drawable/supper" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="20dp"
        android:background="@drawable/border4"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/txtfth1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="2dp"
            android:layout_marginLeft="25dp"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:gravity="center"
            android:contentDescription="@null"
            android:text="Breakfast" />

        <TextView
            android:id="@+id/txtfth2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="25dp"
            android:paddingLeft="10dp"
            android:gravity="center"
            android:paddingRight="35dp"      
            android:layout_marginTop="2dp"   
            android:contentDescription="@null"
            android:text="Lunch" />

        <TextView
            android:id="@+id/txtfth3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="2dp"
            android:gravity="center"
            android:paddingRight="30dp"
            android:contentDescription="@null"
            android:text="Supper" />
    </LinearLayout>
</LinearLayout>
4

5 回答 5

2

补充taxeeta 的答案，只需android:layout_gravity="center_horizontal"为您的内部LinearLayout 标签添加。

于 2013-08-16T13:56:22.853 回答
2

您有 3 个线性布局，1 个外部和 2 个内部。在内部布局上放这个android:layout_gravity="center_horizontal"。这应该以两者为中心。

此外，您认为您的肖像作品是不正确的事实。注意右侧的空白区域。

<?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="wrap_content"
    android:background="@drawable/border"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/imgfourth1"
            android:layout_width="70dp"
            android:layout_height="50dp"
            android:layout_marginLeft="25dp"
            android:layout_marginRight="25dp"
            android:paddingTop="2dp"
            android:src="@drawable/amlet1" />

        <ImageView
            android:id="@+id/imgfourth2"
            android:layout_width="70dp"
            android:layout_height="50dp"
            android:layout_marginRight="25dp"
            android:contentDescription="@null"
            android:paddingTop="2dp"
            android:src="@drawable/lnch1" />

        <ImageView
            android:id="@+id/imgfourth3"
            android:layout_width="70dp"
            android:layout_height="50dp"
            android:layout_marginRight="25dp"
            android:contentDescription="@null"
            android:paddingLeft="20dp"
            android:paddingTop="2dp"
            android:src="@drawable/supper" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="20dp"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/border4"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/txtfth1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="25dp"
            android:layout_marginTop="2dp"
            android:contentDescription="@null"
            android:gravity="center"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:text="Breakfast" />

        <TextView
            android:id="@+id/txtfth2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="25dp"
            android:layout_marginTop="2dp"
            android:contentDescription="@null"
            android:gravity="center"
            android:paddingLeft="10dp"
            android:paddingRight="35dp"
            android:text="Lunch" />

        <TextView
            android:id="@+id/txtfth3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="2dp"
            android:contentDescription="@null"
            android:gravity="center"
            android:paddingRight="30dp"
            android:text="Supper" />
    </LinearLayout>

</LinearLayout>
于 2013-08-16T13:30:39.807 回答
1

您可以创建两种不同的布局，一种用于纵向模式，一种用于横向模式。这将解决你的问题。

Keep your
1. portrait mode layout in res/layout folder and
2. landscape mode layout in res/layout-land folder.

Android 将根据您的方向采用适当的布局。

*编辑：单一布局* **

如果您想对纵向和横向使用单一布局，那么以下内容应该可以帮助您

我已经使用android:weightsum并android:layout_weight使它看起来合适。

<?xml version="1.0" encoding="utf-8"?>


<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:weightSum="100">

    <ImageView
        android:id="@+id/imgfourth1"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="33"            
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/imgfourth2"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="33" 
        android:src="@drawable/ic_launcher" />

    <ImageView
        android:id="@+id/imgfourth3"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="33"  
        android:src="@drawable/ic_launcher" />
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="20dp"        
    android:orientation="horizontal"
    android:weightSum="100" >

    <TextView
        android:id="@+id/txtfth1"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="33"  
        android:gravity="center_horizontal" 
        android:text="Breakfast" />

    <TextView
        android:id="@+id/txtfth2"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="33"   
        android:gravity="center_horizontal" 
        android:text="Lunch" />

    <TextView
        android:id="@+id/txtfth3"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="33"  
        android:gravity="center_horizontal"  
        android:text="Supper" />
</LinearLayout>

于 2013-08-16T13:14:07.927 回答
0

尝试以下几行：

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:weightSum="3"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/imgfourth1"
        android:layout_width="0dip"
        android:layout_height="50dp"
        android:layout_weight="1" 
        android:src="@drawable/amlet1" />

    <ImageView
        android:id="@+id/imgfourth2"
        android:layout_width="0dip"
        android:layout_height="50dp"
        android:layout_weight="1"
        android:src="@drawable/lnch1" />

    <ImageView
        android:id="@+id/imgfourth3"
        android:layout_width="0dip"
        android:layout_height="50dp"
        android:layout_weight="1" 
        android:src="@drawable/supper" />
</LinearLayout>

大多数情况下，你应该认为你填满了屏幕，然后根据你的需要划分它，所以它会适合横向，纵向，甚至不同的密度。而且我还建议您将图像的高度放入不同密度尺寸的文件夹中，这样它也可以是多种多样的。

于 2013-08-16T14:02:44.517 回答
0

简单地说 android:layout-weight="33" 这将为所有三个元素提供 33% 的空间，并且适合任何方向的任何分辨率

于 2014-09-15T17:02:43.577 回答