Question

我对Android应用开发非常陌生。我使用拖放元素设计了布局。但是，当我在移动设备上运行此应用程序时，应用程序的所有元素都会聚集在显示屏的左上角。我已经添加了截图，我是如何设计布局的

以及它在我的手机屏幕上的显示方式。

这里是XML代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.jyotirmoy.myapplication.MainActivity">

    <EditText
        android:id="@+id/editText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Enter any text"
        tools:layout_editor_absoluteX="70dp"
        tools:layout_editor_absoluteY="57dp" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Print"
        tools:layout_editor_absoluteX="89dp"
        tools:layout_editor_absoluteY="-250dp" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Your text will be displayed here:"
        tools:layout_editor_absoluteX="307dp"
        tools:layout_editor_absoluteY="-35dp" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="onButtonClick"
        android:text="Print"
        tools:layout_editor_absoluteX="133dp"
        tools:layout_editor_absoluteY="122dp" />
</android.support.constraint.ConstraintLayout>

Answer 1

此处的问题是，在使用 ConstraintLayout 时，您不会对视图使用约束，您应该为视图添加约束，以便在设计时显示正确的布局就像那样

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

    <EditText
        android:id="@+id/editText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="44dp"
        android:ems="10"
        android:inputType="textPersonName"
        android:text="Enter any text"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.503"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="32dp"
        android:onClick="onButtonClick"
        android:text="Print"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/editText" />
</android.support.constraint.ConstraintLayout>

Answer 2

在LinearLayout;

中使用整个布局

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

    <EditText
    android:id="@+id/editText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:ems="10"
    android:inputType="textPersonName"
    android:text="Enter any text"
    tools:layout_editor_absoluteX="70dp"
    tools:layout_editor_absoluteY="57dp" />

<Button
    android:id="@+id/button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Print"
    tools:layout_editor_absoluteX="89dp"
    tools:layout_editor_absoluteY="-250dp" />

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Your text will be displayed here:"
    tools:layout_editor_absoluteX="307dp"
    tools:layout_editor_absoluteY="-35dp" />

<Button
    android:id="@+id/button2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="onButtonClick"
    android:text="Print"
    tools:layout_editor_absoluteX="133dp"
    tools:layout_editor_absoluteY="122dp" />

</LinearLayout>

Answer 3

您可以使用具有垂直方向的LinearLayout而不是ConstraintLayout

Answer 4

如果布局如此简单，那么就不需要使用QMenu。查看LinearLayout，您可以在其中设置项目的方向。或RelativeLayout，您可以更灵活地处理项目。

与此同时，这是ConstraintLayout的解决方案：

LinearLayout

Android应用布局问题：元素出现在手机屏幕的一角

4 个答案: