如何在Android Studio中对齐按钮

时间:2017-12-22 00:16:15

标签: java android android-studio

我刚开始学习用Java编写Android程序,作为我的第一个程序,我决定编写一个简单的TicTacToe游戏。由于我是Android Studio的新用户,我不知道对齐的工作原理。

enter image description here

我对content_main.xml中按钮的对齐非常满意,但出于某种原因,当我在模拟器中运行代码时,它们会向左移动。

以防万一它可能派上用场我将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"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.example.anar.testnewest.MainActivity"
    tools:showIn="@layout/activity_main">

    <RelativeLayout
        android:layout_width="368dp"
        android:layout_height="442dp"
        android:layout_centerInParent="true"
        android:textAlignment="center"
        tools:layout_editor_absoluteX="8dp"
        tools:layout_editor_absoluteY="34dp">


        <Button
            android:id="@+id/btn1"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true"
            android:layout_marginTop="99dp"
            android:onClick="btn1" />

        <Button
            android:id="@+id/btn2"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/btn1"
            android:layout_alignBottom="@+id/btn1"
            android:layout_toLeftOf="@+id/btn3"
            android:layout_toStartOf="@+id/btn3"
            android:onClick="btn2" />

        <Button
            android:id="@+id/btn3"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/btn2"
            android:layout_alignBottom="@+id/btn2"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:onClick="btn3" />

        <Button
            android:id="@+id/btn4"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_below="@+id/btn1"
            android:layout_marginTop="26dp"
            android:onClick="btn4" />

        <Button
            android:id="@+id/btn5"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/btn4"
            android:layout_alignBottom="@+id/btn4"
            android:layout_centerHorizontal="true"
            android:onClick="btn5" />

        <Button
            android:id="@+id/btn6"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/btn5"
            android:layout_alignEnd="@+id/btn3"
            android:layout_alignRight="@+id/btn3"
            android:onClick="btn6" />

        <Button
            android:id="@+id/btn7"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignEnd="@+id/btn4"
            android:layout_alignRight="@+id/btn4"
            android:layout_below="@+id/btn4"
            android:layout_marginTop="22dp"
            android:onClick="btn7" />

        <Button
            android:id="@+id/btn8"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/btn7"
            android:layout_alignBottom="@+id/btn7"
            android:layout_alignLeft="@+id/btn5"
            android:layout_alignStart="@+id/btn5"
            android:onClick="btn8" />

        <Button
            android:id="@+id/btn9"
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/btn8"
            android:layout_alignBottom="@+id/btn8"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:onClick="btn9" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="70dp"
            android:text="TicTacToe"
            android:textColor="@color/colorAccent"
            android:textSize="40sp" />

    </RelativeLayout>
</android.support.constraint.ConstraintLayout>

提前感谢您的时间并帮助他们:)

2 个答案:

答案 0 :(得分:0)

如果你想要正确的布局。

只需将app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintTop_toTopOf="parent"添加到RelativeLayout

<?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"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

<RelativeLayout
    android:layout_width="368dp"
    android:layout_height="442dp"
    android:layout_centerInParent="true"
    android:textAlignment="center"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toTopOf="parent">


    <Button
        android:id="@+id/btn1"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginTop="99dp"
        android:onClick="btn1"/>

    <Button
        android:id="@+id/btn2"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/btn1"
        android:layout_alignBottom="@+id/btn1"
        android:layout_toLeftOf="@+id/btn3"
        android:layout_toStartOf="@+id/btn3"
        android:onClick="btn2"/>

    <Button
        android:id="@+id/btn3"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/btn2"
        android:layout_alignBottom="@+id/btn2"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:onClick="btn3"/>

    <Button
        android:id="@+id/btn4"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/btn1"
        android:layout_marginTop="26dp"
        android:onClick="btn4"/>

    <Button
        android:id="@+id/btn5"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/btn4"
        android:layout_alignBottom="@+id/btn4"
        android:layout_centerHorizontal="true"
        android:onClick="btn5"/>

    <Button
        android:id="@+id/btn6"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/btn5"
        android:layout_alignEnd="@+id/btn3"
        android:layout_alignRight="@+id/btn3"
        android:onClick="btn6"/>

    <Button
        android:id="@+id/btn7"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/btn4"
        android:layout_alignRight="@+id/btn4"
        android:layout_below="@+id/btn4"
        android:layout_marginTop="22dp"
        android:onClick="btn7"/>

    <Button
        android:id="@+id/btn8"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/btn7"
        android:layout_alignBottom="@+id/btn7"
        android:layout_alignLeft="@+id/btn5"
        android:layout_alignStart="@+id/btn5"
        android:onClick="btn8"/>

    <Button
        android:id="@+id/btn9"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/btn8"
        android:layout_alignBottom="@+id/btn8"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:onClick="btn9"/>

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="70dp"
        android:text="TicTacToe"
        android:textColor="@color/colorAccent"
        android:textSize="40sp"/>

</RelativeLayout>
</android.support.constraint.ConstraintLayout>

<强>输出

enter image description here

答案 1 :(得分:0)

只需将这些属性添加到RelativeLayout

即可
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"

最好是StartEnd而不是LeftRight属性。 B&#39;因为它也支持RTL布局。