Android：UIdesign

Question

我在UI中的android设计上遇到了问题。我尝试在Fragment的底部放置一个按钮，并通过在顶部元素上放置60dp的边距进行设置。

它在IDE中的emulator中处于良好位置，但是当我在手机中运行项目时，该按钮将退出屏幕。

仿真器设备：像素2 我的设备电话：s8

<FrameLayout 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"
             tools:context=".sabtHazine" android:layout_weight="1"
             android:background="@android:color/holo_blue_light">


        <LinearLayout
                android:orientation="vertical"
                android:layout_width="match_parent"
                android:layout_height="match_parent" android:background="@android:color/holo_purple"
                android:padding="3dp" android:layout_alignParentStart="true" android:layout_alignParentTop="true"
                android:paddingBottom="0dp">
            <LinearLayout
                    android:orientation="horizontal"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">
                <EditText
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:inputType="textPersonName"
                        android:text="Name"
                        android:ems="10"
                        android:id="@+id/editText" android:layout_weight="1"/>
                <TextView
                        android:text="مبلغ"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" android:id="@+id/textView" android:layout_weight="1"/>
            </LinearLayout>
            <LinearLayout
                    android:orientation="horizontal"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">
                <EditText
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:inputType="textPersonName"
                        android:text="Name"
                        android:ems="10"
                        android:id="@+id/editText" android:layout_weight="1"/>
                <TextView
                        android:text="بابت"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" android:id="@+id/textView" android:layout_weight="1"/>
            </LinearLayout>
            <LinearLayout
                    android:orientation="horizontal"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">
                <EditText
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:inputType="textPersonName"
                        android:text="Name"
                        android:ems="10"
                        android:id="@+id/editText2" android:layout_weight="1"/>
                <TextView
                        android:text="تاریخ"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" android:id="@+id/textView2" android:layout_weight="1"/>
            </LinearLayout>
            <LinearLayout
                    android:orientation="vertical"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" android:gravity="right" android:layout_marginBottom="150dp">
                <TextView
                        android:text="مشترک با"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content" android:id="@+id/textView" android:layout_weight="1"/>
                <LinearLayout
                        android:orientation="horizontal"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent" android:layout_weight="1">
                    <CheckBox
                            android:text="CheckBox"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content" android:id="@+id/checkBox" android:layout_weight="1"/>
                    <CheckBox
                            android:text="CheckBox"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content" android:id="@+id/checkBox8" android:layout_weight="1"/>
                    <CheckBox
                            android:text="CheckBox"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content" android:id="@+id/checkBox7" android:layout_weight="1"/>
                </LinearLayout>
                <LinearLayout
                        android:orientation="horizontal"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent" android:layout_weight="1">
                    <CheckBox
                            android:text="CheckBox"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content" android:id="@+id/checkBox8" android:layout_weight="1"/>
                    <CheckBox
                            android:text="CheckBox"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content" android:id="@+id/checkBox6" android:layout_weight="1"/>
                </LinearLayout>
            </LinearLayout>
            <Button
                    android:text="ثبت هزینه"
                    android:layout_width="match_parent"
                    android:layout_height="80dp" android:id="@+id/button3" tools:layout_editor_absoluteY="415dp"
                    tools:layout_editor_absoluteX="67dp" android:textSize="30sp"
                    android:textColor="@android:color/holo_green_light" android:background="#1b0387"
                    android:layout_alignParentStart="true" android:layout_alignParentBottom="true"
                    android:gravity="center" android:layout_marginTop="150dp" android:layout_marginBottom="0dp"/>
        </LinearLayout>

</FrameLayout>

谢谢您的任何帮助。

Answer 1

您使用了60dp的余量，但是它的大小和模拟器的分辨率和大小（xxhdpi）都很好，但手机的分辨率却不同（xxxhdpi）

以hdpi xhdpi xxhdpi xxxhdpi sw600dp和sw720dp大小设置布局

它将帮助您使布局在其他手机中的运行效果很好

或执行其他操作，例如使用滚动视图或其他类型的布局

Answer 2

两个位置，150 dp高度边距分配。因此该按钮不会出现在屏幕上。编辑：

<FrameLayout 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:layout_weight="1"
android:background="@android:color/holo_blue_light">


<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:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_weight="1"
        android:background="@android:color/holo_purple"
        android:orientation="vertical"
        android:padding="3dp"
        android:paddingBottom="0dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <EditText
                android:id="@+id/editText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:inputType="textPersonName"
                android:text="Name" />

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="مبلغ" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <EditText
                android:id="@+id/editText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:inputType="textPersonName"
                android:text="Name" />

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="بابت" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <EditText
                android:id="@+id/editText2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:inputType="textPersonName"
                android:text="Name" />

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="تاریخ" />
        </LinearLayout>

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

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="مشترک با" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:orientation="horizontal">

                <CheckBox
                    android:id="@+id/checkBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />

                <CheckBox
                    android:id="@+id/checkBox8"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />

                <CheckBox
                    android:id="@+id/checkBox7"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:orientation="horizontal">

                <CheckBox
                    android:id="@+id/checkBox8"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />

                <CheckBox
                    android:id="@+id/checkBox6"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />
            </LinearLayout>
        </LinearLayout>

    </LinearLayout>

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

        <Button
            android:id="@+id/button3"
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentStart="true"
            android:layout_gravity="bottom"
            android:layout_marginBottom="0dp"
            android:background="#1b0387"
            android:gravity="center"
            android:text="ثبت هزینه"
            android:textColor="@android:color/holo_green_light"
            android:textSize="30sp"
            tools:layout_editor_absoluteX="67dp"
            tools:layout_editor_absoluteY="415dp" />
    </LinearLayout>
</LinearLayout>

Answer 3

希望获得帮助：

<FrameLayout 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:layout_weight="1"
    android:background="@android:color/holo_blue_light">
    
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">


    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent" android:background="@android:color/holo_purple"
        android:padding="3dp" android:layout_alignParentStart="true" android:layout_alignParentTop="true"
        android:paddingBottom="0dp">
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="textPersonName"
                android:text="Name"
                android:ems="10"
                android:id="@+id/editText" android:layout_weight="1"/>
            <TextView
                android:text="مبلغ"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:id="@+id/textView" android:layout_weight="1"/>
        </LinearLayout>
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="textPersonName"
                android:text="Name"
                android:ems="10"
                android:id="@+id/editText" android:layout_weight="1"/>
            <TextView
                android:text="بابت"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:id="@+id/textView" android:layout_weight="1"/>
        </LinearLayout>
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="textPersonName"
                android:text="Name"
                android:ems="10"
                android:id="@+id/editText2" android:layout_weight="1"/>
            <TextView
                android:text="تاریخ"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:id="@+id/textView2" android:layout_weight="1"/>
        </LinearLayout>
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" android:gravity="right" android:layout_marginBottom="150dp">
            <TextView
                android:text="مشترک با"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:id="@+id/textView" android:layout_weight="1"/>
            <LinearLayout
                android:orientation="horizontal"
                android:layout_width="match_parent"
                android:layout_height="match_parent" android:layout_weight="1">
                <CheckBox
                    android:text="CheckBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:id="@+id/checkBox" android:layout_weight="1"/>
                <CheckBox
                    android:text="CheckBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:id="@+id/checkBox8" android:layout_weight="1"/>
                <CheckBox
                    android:text="CheckBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:id="@+id/checkBox7" android:layout_weight="1"/>
            </LinearLayout>
            <LinearLayout
                android:orientation="horizontal"
                android:layout_width="match_parent"
                android:layout_height="match_parent" android:layout_weight="1">
                <CheckBox
                    android:text="CheckBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:id="@+id/checkBox8" android:layout_weight="1"/>
                <CheckBox
                    android:text="CheckBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:id="@+id/checkBox6" android:layout_weight="1"/>
            </LinearLayout>
        </LinearLayout>
        
          
       
    </LinearLayout>
        <Button
            android:text="ثبت هزینه"
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:id="@+id/button3"
            android:textSize="30sp"
            android:layout_alignParentBottom="true"
            android:textColor="@android:color/holo_green_light"
            android:background="#1b0387"
            android:gravity="center"/>
    </RelativeLayout>
</FrameLayout>

Answer 4

您应该使用ConstraintLayout以获得最佳的UI设计。          

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginBottom="60dp"
        android:background="@android:color/holo_purple"
        android:orientation="vertical"
        android:padding="3dp"
        android:paddingBottom="0dp"
        app:layout_constraintBottom_toTopOf="@+id/button3"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <EditText
                android:id="@+id/editText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:inputType="textPersonName"
                android:text="Name" />

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="مبلغ" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <EditText
                android:id="@+id/editText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:inputType="textPersonName"
                android:text="Name" />

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="بابت" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <EditText
                android:id="@+id/editText2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:inputType="textPersonName"
                android:text="Name" />

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="تاریخ" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="150dp"
            android:gravity="right"
            android:orientation="vertical">

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="مشترک با" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:orientation="horizontal">

                <CheckBox
                    android:id="@+id/checkBox"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />

                <CheckBox
                    android:id="@+id/checkBox8"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />

                <CheckBox
                    android:id="@+id/checkBox7"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:orientation="horizontal">

                <CheckBox
                    android:id="@+id/checkBox8"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />

                <CheckBox
                    android:id="@+id/checkBox6"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    android:text="CheckBox" />
            </LinearLayout>
        </LinearLayout>

    </LinearLayout>

    <Button
        android:id="@+id/button3"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="8dp"
        android:background="#1b0387"
        android:gravity="center"
        android:text="ثبت هزینه"
        android:textColor="@android:color/holo_green_light"
        android:textSize="30sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

</android.support.constraint.ConstraintLayout>