如何更改布局以使其适合平板电脑尺寸屏幕？

Question

我在移动设备上测试了这个应用程序并且布局看起来很好但是在7英寸平板电脑上进行测试时，主要活动是缺少textViews和图像，其余的活动都很好。

有人可以告诉我如何解决这种情况，因为我确信这是一个相当简单的修复。活动的布局如下所示。

<ScrollView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fillViewport="true"
    android:scrollbars="none" 
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"

    tools:context=".MainActivity"
     >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        >

        <LinearLayout
            android:id="@+id/llayout"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="271dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_weight="0.68"
                android:src="@drawable/mark3" />

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="50dp"
                android:text="@string/depth_"
                android:textColor="#90f030"
                android:textSize="30sp" />

            <EditText
                android:id="@+id/ductDepth"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="20dp"
                android:ems="10"
                android:hint="@string/enter_duct_depth_mm"
                android:inputType="numberDecimal"
                android:singleLine="true" >

                <requestFocus />
            </EditText>

            <TextView
                android:id="@+id/textView3"
                android:layout_width="wrap_content"
                android:layout_height="50dp"
                android:text="Duct Depth:"
                android:textColor="#90f030"
                android:textSize="30sp" />

            <EditText
                android:id="@+id/offDepth"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="14dp"
                android:ems="10"
                android:hint="@string/enter_offset_depth_mm"
                android:inputType="numberDecimal"
                android:singleLine="true" />

            <TextView
                android:id="@+id/textView1"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:text="Length:"
                android:textColor="#90f030"
                android:textSize="30sp" />

            <EditText
                android:id="@+id/offLength"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="20dp"
                android:ems="10"
                android:hint="@string/enter_offset_length_mm"
                android:inputType="numberDecimal"
                android:singleLine="true" />
        </LinearLayout>

    <android.support.v4.view.ViewPager     
    android:id="@+id/pager"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
     >

    <!--
    This title strip will display the currently visible page title, as well as the page
    titles for adjacent pages.
    -->

    <android.support.v4.view.PagerTitleStrip
        android:id="@+id/pager_title_strip"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:background="#33b5e5"
        android:paddingBottom="4dp"
        android:paddingTop="4dp"
        android:textColor="#fff" />

</android.support.v4.view.ViewPager>

    <ImageButton
        android:id="@+id/calc"
        android:layout_width="200dp"
        android:layout_height="70dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/llayout"
        android:background="@drawable/calcbttrans" />


</RelativeLayout>

</ScrollView>

Answer 1

究竟是什么问题？底部的拉伸图像？

如果是这样，可能是因为你已经将它设置为一个确切的大小而不允许自由保持其宽高比。一种可能的解决方案是使用9-patch图像或xml drawable，或者只保留当前图像的纵横比。

顺便说一句，操作栏看起来不太好。你考虑过使用支持库或actionBarSherlock吗？谷歌已经有关于原生外观的指南（例如：http://developer.android.com/design/patterns/pure-android.html）

---

编辑：似乎问题出在布局上。

看起来viewPager在所有布局之上，而imageButton在linearLayout之下，当你一直滚动到底部（不是本机android UX，顺便说一下）。

只需检查UI设计器和大纲。它清楚地显示了问题（我必须更换所有图像，因为我没有它们，但这不重要）：