如何在不同的手机屏幕上调整元素的比例

时间:2016-02-06 12:34:05

标签: android xml position screen

我想将一些图像视图设置为特定的backgorund位置,它将设置为一种类型的Android手机,如nexus 4

layout design in nexuas 4

但是在nexus 10等其他手机中更换屏幕时会改变位置

enter image description here

我在网上搜索找到解决方案,我发现设置的elemnts百分比是更好的方式,可以在不同的屏幕上设置相同的比例 我尝试使用不同的布局设计,如TableLayout,GridLayout,LinearLayout等,但不能同时为所有的anroid智能手机设置位置,

这是我的RelativeLayout代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/RelativeLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/test_backside"
    >

    <ImageView
        android:layout_width="1920dp"
        android:layout_height="1080dp"
        android:id="@+id/bgTopLeftCorner"
        android:src="@drawable/test_bg"
        />

    <ImageView
        android:layout_width="130dp"
        android:layout_height="130dp"
        android:src="@drawable/test_horizonal_layer"
        android:layout_weight="30"
        android:id="@+id/imageView5"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginLeft="44dp"
        android:layout_marginStart="44dp" />

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:src="@drawable/test_circle_1"
        android:layout_marginRight="36dp"
        android:layout_marginEnd="36dp"
        android:id="@+id/imageView7"
        android:layout_below="@+id/imageView5"
        android:layout_toLeftOf="@+id/imageView6"
        android:layout_toStartOf="@+id/imageView6" />

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:src="@drawable/test_circle_2"
        android:layout_weight="30"
        android:id="@+id/imageView6"
        android:layout_alignTop="@+id/imageView7"
        android:layout_centerHorizontal="true" />

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:src="@drawable/test_circle_3"
        android:layout_weight="30"
        android:id="@+id/imageView3"
        android:layout_alignTop="@+id/imageView6"
        android:layout_toLeftOf="@+id/imageView"
        android:layout_toStartOf="@+id/imageView"
        android:layout_marginRight="17dp"
        android:layout_marginEnd="17dp" />

    <ImageView
        android:layout_width="130dp"
        android:layout_height="130dp"
        android:src="@drawable/test_vertical_layer"
        android:layout_weight="30"
        android:id="@+id/imageView"
        android:layout_marginBottom="43dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
</RelativeLayout>

2 个答案:

答案 0 :(得分:0)

是的,正如你所说的设置百分比是好的,在你的活动/片段类中找到你的屏幕宽度和高度,并通过给它们宽度为(x * screenWidth)/ 100来设置相对布局中每个元素的宽度和高度

这将解决您的问题。

答案 1 :(得分:0)

Use the relative layout for 2 images.
Inside the layout on top of the first image, put the second (in this example uses LinearLayout) 

 <?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">


        <RelativeLayout
            android:layout_width="200dp"
            android:layout_height="200dp">


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:scaleType="centerCrop"
                android:src="@drawable/image1" />


            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_centerHorizontal="true"
                android:orientation="horizontal">

                <ImageView
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:src="@drawable/image2" />

            </LinearLayout>


        </RelativeLayout>


        <RelativeLayout
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_alignParentRight="true">


            <ImageView
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:scaleType="centerCrop"
                android:src="@drawable/image1" />


            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_centerHorizontal="true"
                android:orientation="horizontal">

                <ImageView
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:src="@drawable/image2" />

            </LinearLayout>


        </RelativeLayout>

    </RelativeLayout>