在横向和纵向模式之间切换会产生一些 UI 问题

Question

我在我的应用程序屏幕中使用了 3 个文本视图作为页脚。当我将它用作纵向时，它完全适合屏幕，如下所示，

人像图片

但是当我把它变成横向时，它在两个文本视图（I 和 B）之间形成了巨大的差距。

风景图片

这是什么原因，我该如何克服它？任何帮助将不胜感激。

.xml 用于此的代码

<com.gamma.p.menu.QuickReturnListView
    android:id="@android:id/list"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

<TextView
    android:id="@+id/footerB"
    android:layout_width="106.5dip"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:background="@drawable/textview_background"
    android:gravity="center"
    android:paddingBottom="8dip"
    android:paddingLeft="16dip"
    android:paddingRight="16dip"
    android:paddingTop="8dip"
    android:text="@string/footer3"
    android:textColor="@drawable/textview_font"
    android:textSize="12sp" />

<TextView
    android:id="@+id/footerI"
    android:layout_width="107dip"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_toRightOf="@+id/footerTop"
    android:background="@drawable/textview_background"
    android:gravity="center"
    android:paddingBottom="8dip"
    android:paddingLeft="16dip"
    android:paddingRight="16dip"
    android:paddingTop="8dip"
    android:text="@string/footer2"
    android:textColor="@drawable/textview_font"
    android:textSize="12sp" />

<TextView
    android:id="@+id/footerT"
    android:layout_width="106dip"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:background="@drawable/textview_background"
    android:gravity="center"
    android:paddingBottom="8dip"
    android:paddingLeft="16dip"
    android:paddingRight="16dip"
    android:paddingTop="8dip"
    android:text="@string/footer1"
    android:textColor="@drawable/textview_font"
    android:textSize="12sp" />

已更新 我已经改变了我的 xml 如下所示，

<LinearLayout 
        android:id="@+id/shareLILayout"
        android:layout_alignParentBottom="true"
        android:weightSum="3"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="right"
        android:orientation="horizontal" >

    <lk.gamma.p.menu.QuickReturnListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/footerB"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
         android:layout_weight="1"
        android:layout_alignParentRight="true"
        android:background="@drawable/textview_background"
        android:gravity="center"
        android:paddingBottom="8dip"
        android:paddingLeft="16dip"
        android:paddingRight="16dip"
        android:paddingTop="8dip"
        android:text="@string/footer3"
        android:textColor="@drawable/textview_font"
        android:textSize="12sp" />
    <!-- android:background="#D8000000" -->

    <TextView
        android:id="@+id/footerI"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/footerTop"
        android:background="@drawable/textview_background"
        android:gravity="center"
        android:paddingBottom="8dip"
        android:paddingLeft="16dip"
         android:layout_weight="1"
        android:paddingRight="16dip"
        android:paddingTop="8dip"
        android:text="@string/footer2"
        android:textColor="@drawable/textview_font"
        android:textSize="12sp" />

    <TextView
        android:id="@+id/footerT"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:background="@drawable/textview_background"
        android:gravity="center"
        android:paddingBottom="8dip"
         android:layout_weight="1"
        android:paddingLeft="16dip"
        android:paddingRight="16dip"
        android:paddingTop="8dip"
        android:text="@string/footer1"
        android:textColor="@drawable/textview_font"
        android:textSize="12sp" />
 </LinearLayout>

现在看起来像这样，

Answer 1

您正在使用固定宽度值，而不是让视图在所需屏幕上均匀分布 space。

不要使用宽度，而是为页脚视图使用相同的权重属性：

android:id="@+id/footerT"
android:layout_width="0"
android:layout_height="wrap_content"
android:layout_weight="1"

并对其他页脚视图执行相同操作

更新：

您需要将视图包裹在 LinearLayout 而不是 RelativeLayout 中（因为后者不考虑权重属性）

Answer 2

您的问题是您正在设置特定的 width 文本框。当方向改变时，这不允许它适应新的屏幕尺寸。相反，请尝试将每个文本框的 layout_width 设置为 0dp，就像@anuj 所说的那样，通过将其设置为 1.[=16= 来利用 layout_weight 属性]

像这样：

<TextView
android:id="@+id/footerB"
android:layout_width="0dp"
android:layout_weight="1"
... 
/>

Answer 3

使用水平方向的线性布局，然后对每个 TextView 应用权重

<LinerLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
orientation="horizontal">

<TextView
android:id="@+id/footerB"
android:layout_width="0dp"
android:layout_weight="1"
... 
/>

</LinearLayout>

Answer 4

如果您使用的是线性布局，请按照以下步骤操作。如果对你有帮助请告诉我

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

<TextView
android:id="@+id/footerB"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight= "1"
android:background="@drawable/textview_background"
android:gravity="center"
android:paddingBottom="8dip"
android:paddingLeft="16dip"
android:paddingRight="16dip"
android:paddingTop="8dip"
android:text="@string/footer3"
android:textColor="@drawable/textview_font"
android:textSize="12sp" />

<TextView
android:id="@+id/footerI"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight= "1"
android:background="@drawable/textview_background"
android:gravity="center"
android:paddingBottom="8dip"
android:paddingLeft="16dip"
android:paddingRight="16dip"
android:paddingTop="8dip"
android:text="@string/footer2"
android:textColor="@drawable/textview_font"
android:textSize="12sp" />

<TextView
android:id="@+id/footerT"
android:layout_width="0dp"
android:layout_weight= "1"
android:layout_height="wrap_content"
android:background="@drawable/textview_background"
android:gravity="center"
android:paddingBottom="8dip"
android:paddingLeft="16dip"
android:paddingRight="16dip"
android:paddingTop="8dip"
android:text="@string/footer1"
android:textColor="@drawable/textview_font"
android:textSize="12sp" />
</LinearLayout>

如果需要使用Relativelayout请使用 "wrap_content" 而不是提供自定义宽度

Answer 5

将android:layout_width="match_parent"改成<lk.gamma.pizzakraft.menu.QuickReturnListView里面的android:layout_width="0dp"。然后它会为你工作。

完整代码

<LinearLayout
        android:id="@+id/shareLILayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal" >

        <com.gamma.p.menu.QuickReturnListView
            android:id="@android:id/list"
            android:layout_width="0dp"
            android:layout_height="wrap_content" />

        <LinearLayout
            android:id="@+id/shareLILayout1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:orientation="horizontal"
            android:weightSum="3" >

            <TextView
                android:id="@+id/footerB"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_alignParentRight="true"
                android:layout_weight="1"
                android:background="@drawable/textview_background"
                android:gravity="center"
                android:paddingBottom="8dip"
                android:paddingLeft="16dip"
                android:paddingRight="16dip"
                android:paddingTop="8dip"
                android:text="@string/footer3"
                android:textColor="@drawable/textview_font"
                android:textSize="12sp" />

            <TextView
                android:id="@+id/footerI"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_toRightOf="@+id/footerTop"
                android:layout_weight="1"
                android:background="@drawable/textview_background"
                android:gravity="center"
                android:paddingBottom="8dip"
                android:paddingLeft="16dip"
                android:paddingRight="16dip"
                android:paddingTop="8dip"
                android:text="@string/footer2"
                android:textColor="@drawable/textview_font"
                android:textSize="12sp" />

            <TextView
                android:id="@+id/footerT"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_alignParentLeft="true"
                android:layout_weight="1"
                android:background="@drawable/textview_background"
                android:gravity="center"
                android:paddingBottom="8dip"
                android:paddingLeft="16dip"
                android:paddingRight="16dip"
                android:paddingTop="8dip"
                android:text="@string/footer1"
                android:textColor="@drawable/textview_font"
                android:textSize="12sp" />
        </LinearLayout>
    </LinearLayout>

在横向和纵向模式之间切换会产生一些 UI 问题

switching between landscape and portrait mode makes some UI problems

user-interface

android

landscape