Stretched ImageButton

Question

Я создал Android 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) Создайте новую папку с именем «layout-land» в папке «res» и создайте свой xml-файл с тем же именем (как и с вашим основным файлом xml) в этой папке. Просто скопируйте и вставьте код вашего основного xml-файла в этот файл. Теперь создайте метод (фактически переопределите) «onConfigurationChanged()» в вашем классе активности и скопируйте в него код метода onCreate() ».

После выполнения вышеуказанных двух шагов вы увидите, что независимо от размера или ориентации устройства, расположение вашего приложения всегда будет правильным и, по желанию.