Android XML调整大小/适合ImageButton不同的屏幕

时间:2016-09-28 16:19:58

标签: android xml imagebutton screens

我做了ImageButton菜单设计,希望它的大小可以调整屏幕: 但在我测试使用智能手机3英寸320x480后 ,4英寸480x800,5英寸720x1280,查看ImageButton很乱。

我尝试过使用TableLayout,LinearLayout,GridLayout, 和FrameLayout,但结果是一样的。

提前谢谢。This picture my trial results

这是我的XML代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg"
    android:orientation="vertical"
    tools:context=".MainActivity" >

     <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:id="@+id/linear1">
            <ImageView 
                android:id="@+id/title"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:scaleType="fitCenter" 
                android:layout_gravity="center"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="20dp"
                android:src="@drawable/title"
                android:contentDescription="title"/>
    </LinearLayout>


      <ImageButton
        android:id="@+id/imagebutton0"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/linear1"
        android:layout_centerHorizontal="true" 
        android:scaleType="fitXY"              
        android:background="@drawable/image"
        android:tag="0"
        tools:ignore="contentDescription" />

    <ImageButton
        android:id="@+id/imagebutton2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imagebutton0"
        android:layout_toLeftOf="@+id/imagebutton4"
        android:scaleType="fitXY"            
        android:background="@drawable/image" 
        android:tag="2"
        tools:ignore="contentDescription" />

    <ImageButton
        android:id="@+id/imagebutton4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imagebutton0"
        android:layout_centerHorizontal="true" 
        android:scaleType="fitXY"            
        android:background="@drawable/image"
        android:tag="4"
        tools:ignore="contentDescription" />

    <ImageButton
        android:id="@+id/imagebutton3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imagebutton0"
        android:layout_toRightOf="@+id/imagebutton4"
        android:scaleType="fitXY"            
        android:background="@drawable/image"
        android:tag="3"
        tools:ignore="contentDescription" />

   <ImageButton
        android:id="@+id/imagebutton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imagebutton4"
        android:layout_centerHorizontal="true" 
        android:scaleType="fitXY" 
        android:background="@drawable/image"   
        android:tag="1"
        tools:ignore="contentDescription" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal|center_vertical"
        android:orientation="horizontal" 
        android:layout_alignParentBottom="true"
        android:id="@+id/linear2"
         android:layout_below="@+id/imagebutton1">

        <TextView
            android:id="@+id/ib1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:layout_weight="1"
            android:drawableTop="@drawable/ib1"
            android:gravity="center"
            android:text="" 
            android:scaleType="fitXY"/>

        <TextView
            android:id="@+id/ib2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:layout_weight="1"
            android:drawableTop="@drawable/ib2"
            android:gravity="center"
            android:text="" 
            android:scaleType="fitXY"/>

        <TextView
            android:id="@+id/ib3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:layout_weight="1"
            android:drawableTop="@drawable/ib3"
            android:gravity="center"
            android:text="" 
            android:scaleType="fitXY"/>

         <TextView
            android:id="@+id/ib4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:layout_weight="1"
            android:drawableTop="@drawable/ib4"
            android:gravity="center"
            android:text="" 
            android:scaleType="fitXY"/>
    </LinearLayout>
</RelativeLayout>

1 个答案:

答案 0 :(得分:1)

我创建了一个划痕,用于定义线性和重量

的布局

我希望它会帮助你

还附带屏幕截图的代码 enter image description here

enter image description here

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.4"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitCenter"
            android:src="@mipmap/ic_launcher" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="horizontal">

            <ImageView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:src="@mipmap/ic_launcher" />

            <ImageView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:src="@mipmap/ic_launcher" />

            <ImageView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:src="@mipmap/ic_launcher" />

        </LinearLayout>


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher" />

        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.1"
        android:gravity="center"
        android:orientation="horizontal">


        <ImageView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:src="@mipmap/ic_launcher" />


    </LinearLayout>


</LinearLayout>