android - 拉伸图像按钮

Question

我layout用很少的ImageButtons. 我的布局在小屏幕（例如 3.6 英寸到 4.2 英寸）上运行良好，但是当我在 7 英寸或 9 英寸平板电脑上使用我的应用程序时layout，纵向和横向模式都变得丑陋。我没有为ImageButton. 我怎样才能解决这个问题？

在 4 英寸屏幕上：

在 7 英寸屏幕上：

这是我的布局代码：

<?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="fill_parent" 
android:orientation="vertical" >

   <LinearLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="fill_parent"
       android:layout_height="35dp"
       android:background="#81BEF7"
       android:orientation="vertical"
       android:scrollbars="vertical" >

        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:id="@+id/buttonlayout" android:orientation="horizontal"
                android:layout_width="fill_parent" android:layout_height="wrap_content"
                android:height="32dp" android:gravity="left|top" android:background="#000000"
                android:paddingTop="2dp" android:paddingBottom="2dp">
                <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                        android:id="@+id/buttonlayout2" android:orientation="horizontal"
                        android:layout_height="wrap_content" android:gravity="left|center_vertical"
                        android:layout_gravity="left" android:layout_width="wrap_content">
                        <ImageButton android:id="@+id/imgbtn1"
                                android:layout_width="32dp" android:layout_height="32dp"
                                android:background="@drawable/logo" />
                        <TextView android:id="@+id/txtTest" android:layout_width="fill_parent"
                                android:layout_height="fill_parent" android:textStyle="bold"
                                android:text="Max-Apps" android:textColor="#ffffff"
                                android:textSize="15sp" android:gravity="center_vertical"
                                android:paddingLeft="5dp" />
                        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                                android:id="@+id/buttonlayout2" android:orientation="horizontal"
                                android:layout_height="wrap_content" android:gravity="right"
                                android:layout_gravity="right" android:layout_width="fill_parent">
                        </LinearLayout>
                </LinearLayout>
                <TableLayout android:id="@+id/TableLayoutTop"
                        android:layout_gravity="left" android:scrollbars="horizontal|vertical"
                        android:scrollbarAlwaysDrawVerticalTrack="true"
                        android:scrollbarAlwaysDrawHorizontalTrack="true"
                        android:layout_height="wrap_content" android:layout_width="fill_parent"
                        android:orientation="horizontal">
                        <TableRow android:id="@+id/TableRowTop"
                                android:layout_height="wrap_content" android:layout_width="fill_parent" />
                </TableLayout>
        </LinearLayout>
</LinearLayout>
<HorizontalScrollView
        android:id="@+id/scrollView1"
        android:layout_height="50dp"
        android:layout_width="fill_parent" >

<LinearLayout
    android:id="@+id/select_names_tags_ll1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="@android:drawable/bottom_bar" 
    android:orientation="horizontal"
    android:paddingBottom="1.0dip"
    android:paddingLeft="4.0dip"
    android:paddingRight="4.0dip"
    android:paddingTop="5.0dip" 
    android:gravity="center">

    <Button
        android:id="@+id/btnPageTwo"
        android:layout_width="80dp"
        android:layout_height="wrap_content"        
        android:padding="5dp"
        android:text="Featured" 
        />

    <Button
        android:id="@+id/button3"
        android:layout_width="130dp"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="Category"
        android:onClick="onClickCategory" />

    <Button
        android:id="@+id/button2"
        android:layout_width="130dp"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="Top Download" 
        android:onClick="onClickList"/>

    <Button
        android:id="@+id/button3"
        android:layout_width="130dp"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="About us" />
</LinearLayout>    
</HorizontalScrollView>

<ScrollView
        android:id="@+id/scrollView2"
        android:layout_height="fill_parent"
        android:layout_width="fill_parent" >

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

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true">

    <LinearLayout
        android:orientation="horizontal"        
        android:paddingLeft="4.0dip"
        android:paddingTop="5.0dip"
        android:paddingRight="4.0dip"
        android:paddingBottom="1.0dip"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:layout_below="@+id/TextView01">

        <ImageButton
            android:id="@+id/imageButton1"
            android:layout_width="wrap_content" 
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:layout_margin="2dip"
            android:background="@drawable/winnie"
            android:onClick="onClickPageTwo" /> 0       

        <ImageButton
                 android:id="@+id/imageButton2"
                 android:layout_width="wrap_content" 
                 android:layout_weight="1"
                 android:layout_height="wrap_content"
                 android:layout_margin="2dip"                                 
                 android:background="@drawable/games"
                 android:onClick="onClickPageTwo" /> 
    </LinearLayout>   
</RelativeLayout>

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true">

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:gravity="center_horizontal" 
        android:layout_below="@+id/TextView01">

        <ImageButton
            android:id="@+id/imageButton1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/papago"
            android:onClick="onClickPageTwo" />
    </LinearLayout>
</RelativeLayout>

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true">

    <LinearLayout
        android:orientation="horizontal"        
        android:paddingLeft="4.0dip"
        android:paddingTop="1.0dip"
        android:paddingRight="4.0dip"
        android:paddingBottom="1.0dip"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:layout_below="@+id/TextView01">        

        <ImageButton
                 android:id="@+id/imageButton3"
                 android:layout_width="fill_parent" 
            android:layout_weight="1"
                 android:layout_height="wrap_content"
                 android:layout_margin="2dip"                                 
                 android:background="@drawable/winnie"
                 android:onClick="onClickPageTwo"  />

        <ImageButton
            android:id="@+id/imageButton4"
            android:layout_width="fill_parent" 
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:layout_margin="2dip"
            android:background="@drawable/mickey"
            android:onClick="onClickPageTwo" />
    </LinearLayout>   
</RelativeLayout>           


<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"    
    android:layout_centerHorizontal="true">

    <LinearLayout
        android:orientation="horizontal"        
        android:paddingLeft="4.0dip"
        android:paddingTop="1.0dip"
        android:paddingRight="4.0dip"
        android:paddingBottom="1.0dip"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:gravity="center_horizontal" 
        android:layout_below="@+id/TextView01">

        <ImageButton
            android:id="@+id/imageButton1"
            android:layout_width="wrap_content"            
            android:layout_height="wrap_content"
            android:layout_margin="1dip"
            android:background="@drawable/fb"                         
            android:onClick="onClickPageTwo" />
    </LinearLayout>   
</RelativeLayout>
        </LinearLayout>            
    </ScrollView>

</LinearLayout>

Answer 1

您应该为可能的屏幕尺寸设计布局和图像，并将它们放在下面的相应文件夹中。

 res/layout/my_layout.xml // layout for normal screen size ("default") 
 res/layout-small/my_layout.xml // layout for small screen size 
 res/layout-large/my_layout.xml // layout for large screen size 
 res/layout-xlarge/my_layout.xml // layout for extra large screen size 
 res/layout-xlarge-land/my_layout.xml // layout for extra large in landscape orientation 

 res/drawable-mdpi/my_icon.png // bitmap for medium density 
 res/drawable-hdpi/my_icon.png // bitmap for high density 
 res/drawable-xhdpi/my_icon.png // bitmap for extra high density

花时间阅读http://developer.android.com/design/index.html

Answer 2

(1) 大屏、中屏、小屏可以将不同尺寸的图片分别放在不同的文件夹中，即hdpi、mdpi、ldpi。设备将根据其大小自动为自己挑选图像。

(2) 在“res”文件夹中创建一个名为“layout-land”的新文件夹，并在此文件夹中创建具有相同名称（与您的主 xml 文件相同的名称）的 xml 文件。只需将主 xml 文件的代码复制并粘贴到此文件中即可。现在在您的活动类中创建一个方法（实际上是覆盖）“onConfigurationChanged()”，并将“onCreate()”方法的代码复制粘贴到其中。

完成上述 2 个步骤后，您会看到无论设备的大小或方向如何，您的应用程序的布局都将始终正确且符合要求。