Question

我试图用登录表单创建一个简单的应用程序。

我的问题是它在Nexus 4上看起来不错，但在Nexus 5或Nexus 7上，布局不是我想要的......

我需要做些什么来制作适用于Nexus S，Nexus 4,5,7等的布局。？

XML

     <?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/AMOB_gray"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.example.tiagosilva.amob_android.Log"
    tools:showIn="@layout/activity_log">

<LinearLayout
    android:layout_width="368dp"
    android:layout_height="495dp"
    android:orientation="vertical"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="8dp">

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

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/logo_amob" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:layout_editor_absoluteX="8dp"
            tools:layout_editor_absoluteY="8dp">

            <EditText
                android:id="@+id/et_email"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_alignParentTop="true"
                android:layout_marginTop="122dp"
                android:background="@drawable/round"
                android:ems="10"
                android:hint="Email"
                android:inputType="textEmailAddress"
                android:padding="10dp" />

            <EditText
                android:id="@+id/et_password"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_centerVertical="true"
                android:background="@drawable/round"
                android:ems="10"
                android:hint="Password"
                android:inputType="textPassword"
                android:padding="10dp" />

            <Button
                android:id="@+id/btn_login"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentEnd="true"
                android:layout_alignParentLeft="true"
                android:layout_alignParentRight="true"
                android:layout_alignParentStart="true"
                android:layout_below="@+id/et_password"
                android:layout_marginTop="13dp"
                android:background="@color/AMOB_yellow"
                android:text="Login"
                android:textColor="@color/AMOB_gray" />

            <TextView
                android:id="@+id/tv_recuperarPassword"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/btn_login"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="17dp"
                android:text="Recuperar Password"
                android:textColor="@android:color/white"
                android:textSize="17sp" />

            <Button
                android:id="@+id/btn_noAccount"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_alignParentEnd="true"
                android:layout_alignParentLeft="true"
                android:layout_alignParentRight="true"
                android:layout_alignParentStart="true"
                android:text="No Account yet? Register here!"
                android:background="#ff0000"/>

        </RelativeLayout>

    </LinearLayout>

</LinearLayout>

Answer 1

属性* { margin: 0; padding: 0;} nav { width: 100%; background-color: black; position: fixed; top: 0;} nav ul { width: 50%; margin: 0 auto; list-style-type: none; text-align: center;} nav ul li { display: inline; width: 100%;} nav ul li a { font-size: 40px; color: white; text-decoration: none;} .sections { width: 100%; height: 2000px;} #sec_one { background-color: blue;} #sec_two { background-color: red;} #sec_three { background-color: yellow;} .active { background-color: #666666;} p { color: white;}和<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <nav> <ul> <li><a href="" id="link_1" class="active">Link 1</a></li> <li><a href="" id="link_2">Link 2</a></li> <li><a href="" id="link_3">Link 3</a></li> </ul> <p></p> </nav> <div id="sec_one" class="sections"></div> <div id="sec_two" class="sections"></div> <div id="sec_three" class="sections"></div>确定UI组件大小obvius。有时您应该将它们设置为android:layout_width或android:layout_height，而不是固定大小，以适应设备屏幕大小。

快速查看布局，我将wrap_content设置为match_parent，

<强>之前

android:layout_width

<强>后

match_parent

Answer 2

您可以使用SDP库而不是DP。

此外，使用RelativeLayout或LinearLayout而不是ConstraintLayout

Android - 如何支持多种屏幕尺寸？

2 个答案: