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

时间：2015-03-23 12:15:38

标签： android user-interface landscape

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

肖像图片

enter image description here

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

风景图片

enter image description here

这是什么原因，我该如何克服它？任何帮助将受到高度赞赏。

.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>

现在看起来像这样，

enter image description here

5 个答案:

答案 0 :(得分：1)

您使用的是固定宽度值，而不是让视图在所需的屏幕空间中均匀分布。

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

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

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

<强>更新

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

答案 1 :(得分：1)

使用方向为水平的线性布局，然后对每个TextViews

应用权重 
<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>

答案 2 :(得分：1)

将android:layout_width="match_parent"更改为android:layout_width="0dp"内的<lk.gamma.pizzakraft.menu.QuickReturnListView。然后它会对你有用。

完整代码 

<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>

答案 3 :(得分：0)

您的问题是您要设置特定width的文本框。当方向改变时，这不允许它适应新的屏幕尺寸。相反，请尝试将每个文本框的layout_width设置为0dp，并像@anuj所说，将layout_weight属性设置为1，然后使用<TextView android:id="@+id/footerB" android:layout_width="0dp" android:layout_weight="1" ... /> 。

像这样：

{{1}}

答案 4 :(得分：0)

如果您使用的是Linearlayout，请按以下步骤操作。如果有帮助，请告诉我

 <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，请使用     ＆＃34; WRAP_CONTENT＆＃34;提供自定义宽度的内容

相关问题
最新问题