在 Android Studio 中排列 xml 中的元素

Question

我用过

drawerlayout

在我的 xml 中。我可以在相对布局中正确对齐，但我挣扎这个抽屉布局。

无法使用我在相对布局中使用的大部分功能。

但我设法在我想要的地方对齐了元素。但这又给我带来了另一个问题。

• 在 Android Studio 的 XML 预览 中，完美对齐，

• 在Emulator（编译时）我看不到元素 Textview 和Button。

• 当我在 我的手机 中安装时，这些元素从底部略高于。

你可以看到下面三张图片，

Q1。所以为什么我得到这些不同类型的对齐。

Q2。我如何编码才能使 UI 在所有设备中看起来相同

Q3。我在 XML 代码 中犯了什么错误以及获得相同 UI 的替换代码是什么在所有设备中。

XML 代码：

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/coordinator"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark">
    <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways"/>
    </android.support.design.widget.AppBarLayout>
        <android.support.v7.widget.RecyclerView
            android:id="@+id/dbListrv"
            android:layout_width="match_parent"
            android:layout_height="450dp"
            android:layout_alignParentTop="true"
            android:layout_alignParentStart="true"
            android:layout_marginTop="55dp"
            />
        <EditText
            android:layout_width="300dp"
            android:layout_height="62dp"
            android:id="@+id/et"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="0dp"
            android:layout_marginTop="505dp"
            />
        <Button
            style="?android:attr/buttonStyleSmall"
            android:layout_width="wrap_content"
            android:layout_height="62dp"
            android:text="New Button"
            android:id="@+id/addButton"
            android:padding="0dp"
            android:layout_marginLeft="300dp"
           android:layout_marginTop="505dp"
            android:layout_marginBottom="0dp" />
    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/drawer_header"
        app:menu="@menu/drawer"/>
</android.support.v4.widget.DrawerLayout>

还请大家说说灵活排列元素的小窍门。提前致谢。 (:

Answer 1

我认为您的问题是因为您为 RecyclerView 使用了固定高度。

它在某些屏幕上 space 比在其他屏幕上占用更多 space，从而产生您所看到的效果。

尝试将 RecyclerView 放入 RelativeLayout 并将其高度设置为 MATCH_PARENT。

同时使用 RelativeLayout 将您的按钮和文本视图与屏幕底部对齐，我认为您正在努力实现这一目标。

Answer 2

我的问题得到了解决方案。在您的 xml 中为元素使用固定高度可能看起来很完美。但它们在具有不同 屏幕尺寸 的不同手机之间会有所不同。

因此提供固定高度不是一个好主意。

因此，使用 LinearLayout（如果需要，嵌套 LinearLayout）并设置每个元素的 Weight。

如果您想将元素对齐为 Columns.

，请将方向设置为 Horizontal

如果您想将元素对齐为行，请将方向设置为垂直。

权重会影响 space 一个元素在定义的布局中应占据多少。

这是我的代码，没有使用固定高度，

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/coordinator"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark">
    <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways"/>
    </android.support.design.widget.AppBarLayout>
    </LinearLayout>
        <LinearLayout
            android:id="@+id/FirstRL"
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">

        <android.support.v7.widget.RecyclerView
            android:id="@+id/dbListrv"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true"
            android:layout_weight="1" />

            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:orientation="horizontal"
                android:layout_weight="10">
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/et"
            android:layout_alignParentBottom="true"
            android:layout_weight="2" />
        <Button
            style="?android:attr/buttonStyleSmall"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:text="New Button"
            android:id="@+id/addButton"
            android:layout_weight="5" />
            </LinearLayout>
        </LinearLayout>

</LinearLayout>

    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/drawer_header"
        app:menu="@menu/drawer"/>
</android.support.v4.widget.DrawerLayout>

我终于找到了解决我自己问题的方法。希望它也能帮助其他人..

在 Android Studio 中排列 xml 中的元素

Arranging elements in xml in Android Studio

xml

android

drawerlayout