Android:垂直图像按钮布局,适合所有屏幕尺寸

时间:2013-08-18 08:19:07

标签: android layout android-linearlayout relativelayout imagebutton

我的布局有问题我想垂直排列图像按钮,我希望它在不同的屏幕尺寸上具有相同的外观,这是一个打印屏幕http://flic.kr/p/fwEZn1

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/chalk"
android:gravity="center|fill_vertical"
android:orientation="vertical" >

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="1000dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="104dp" >

    <ImageButton
        android:id="@+id/m"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="62dp"
        android:layout_weight="1.30"
        android:background="@android:color/transparent"
        android:contentDescription="exam schedule button"
        android:onClick="ex"
        android:src="@drawable/exam" />

    <ImageButton
        android:id="@+id/cl"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="60dp"
        android:background="@android:color/transparent"
        android:contentDescription="classes button"
        android:onClick="cl"
        android:src="@drawable/list1" />

    <ImageButton
        android:id="@+id/lec"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="0.24"
        android:background="@android:color/transparent"
        android:contentDescription="lecture section button"
        android:onClick="lc"
        android:src="@drawable/sylla" />

    <ImageButton
        android:id="@+id/gr"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_weight="3.36"
        android:background="@android:color/transparent"
        android:contentDescription="group button"
        android:onClick="gr"
        android:src="@drawable/group" />
      </LinearLayout>

    <LinearLayout
  android:id="@+id/linearLayout2"
  android:layout_width="1000dp"
  android:layout_height="wrap_content"
  android:layout_alignParentLeft="true"
  android:layout_below="@+id/linearLayout1"
  android:layout_marginTop="123dp" >

  <ImageButton
      android:id="@+id/kl"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginRight="74dp"
      android:layout_weight="0.69"
      android:background="@android:color/transparent"
      android:contentDescription="calendar button"
      android:onClick="kl"
      android:src="@drawable/calendar" />

     <ImageButton
      android:id="@+id/d"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentRight="true"
      android:layout_alignTop="@+id/pd"
      android:layout_marginRight="84dp"
      android:layout_weight="0.38"
      android:background="@android:color/transparent"
      android:contentDescription="Schedule button"
      android:onClick="sk"
      android:src="@drawable/sked" />

     <ImageButton
      android:id="@+id/pd"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignLeft="@+id/button1"
      android:layout_alignTop="@+id/an"
      android:layout_weight="0.16"
      android:background="@android:color/transparent"
      android:contentDescription="podcast button"
      android:onClick="pd"
      android:src="@drawable/podcast" />

  <ImageButton
      android:id="@+id/an"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignTop="@+id/kl"
      android:layout_marginLeft="60dp"
      android:layout_toRightOf="@+id/kl"
      android:layout_weight=".92"
      android:background="@android:color/transparent"
      android:contentDescription="announcement button"
      android:onClick="an"
      android:src="@drawable/announce" />
  </LinearLayout>
  <ImageButton
  android:id="@+id/button1"
  android:layout_width="53dp"
  android:layout_height="40dp"
  android:layout_alignParentBottom="true"
  android:layout_alignParentLeft="true"
  android:layout_marginBottom="106dp"
  android:layout_marginLeft="342dp"
  android:layout_weight="0.38"
  android:background="@android:color/transparent"
  android:contentDescription="logout button"
  android:onClick="logout"
  android:src="@drawable/logout"
  android:text="Logout" />
 </RelativeLayout>

所以基本上我想修复图像按钮的排列。我怎样才能做到这一点?我是否需要为每个可绘制文件夹调整图像大小?

2 个答案:

答案 0 :(得分:0)

当您说“看”时,您对所有屏幕尺寸的意思是相同吗?一种可行的方法是在你的xml中设置ImageButton:

    scaleType="centerInside"

并将所有权重从“图像”按钮设置为1

    layout_weight="1"

如果您想将每个按钮设置为垂直,请在您的LinearLayout中声明

    android:orientation="vertical"

顺便说一句,最好为每个drawable设置不同的图像以适应多个屏幕。

答案 1 :(得分:0)

有一个简单的解决方案。我看到你希望所有屏幕尺寸的布局看起来都一样,但你使用的是硬编码值layout_height,margin,padding等。为此,请使用values文件夹中的dimens.xml。指定所有屏幕的值,在资源文件夹中创建这些文件夹:

   values-small
   values-normal(The default values folder is values-normal)       
   values-large
   values-xlarge(You can use values-sw600 for tablets after Android 3.2)

在所有这些文件夹中创建dimens.xml,您可以在dp中指定边距,高度,宽度,填充等,甚至可以指定字体大小。希望这有帮助!