如何在 Android 布局中将按钮并排放置并粘贴

Question

我是 Android UI 的新手，我正在尝试像这样构建一个 UI - 我面临的问题是像这样定位按钮。

Answer 1

如果你想把你的按钮放在中间你需要使用android:layout_gravity="center"

示例代码

<LinearLayout
        android:layout_width="250dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:background="@drawable/linear_bg"
        android:orientation="horizontal">

    <com.google.android.material.button.MaterialButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:backgroundTint="@android:color/transparent"
            android:text="Login" />

    <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="@android:color/white" />

    <com.google.android.material.button.MaterialButton
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:backgroundTint="@android:color/transparent"
            android:text="Sign Up" />

</LinearLayout>

drawable/linear_bg

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
    <solid android:color="#3F51B5" />
    <corners android:radius="20dp" />
</shape>

输出

Answer 2

在你的可绘制文件夹中制作 2 个文件

left_round


<solid android:color="@color/colorPrimary"></solid>
    <corners
        android:bottomLeftRadius="20dp"
        android:topLeftRadius="20dp"></corners>

right_round


<solid android:color="@color/colorPrimary"></solid>
    <corners
        android:bottomRightRadius="20dp"
        android:topRightRadius="20dp"></corners>

并像这样应用到您的两个按钮

<LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Login"
                    android:background="@drawable/left_round" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Sign Up"
                    android:layout_marginLeft="2dp"
                    android:background="@drawable/right_round" />
            </LinearLayout>

Answer 3

您可以使用约束布局来实现这一点。这是一个例子。

<?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"
   android:layout_width="match_parent"
   android:layout_height="match_parent">

<android.support.constraint.Guideline
    android:id="@+id/guideline"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.5" />

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginEnd="1dp"
    android:layout_marginBottom="8dp"
    android:background="@drawable/leftcornerround"
    android:paddingLeft="20dp"
    android:paddingTop="10dp"
    android:paddingRight="20dp"

    android:paddingBottom="10dp"
    android:text="Log In"
    android:textColor="#FFFFFF"
    android:textSize="20sp"
    app:layout_constraintBottom_toTopOf="@+id/guideline2"
    app:layout_constraintEnd_toStartOf="@+id/guideline" />

<android.support.constraint.Guideline
    android:id="@+id/guideline2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.9" />

<TextView
    android:id="@+id/textView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="1dp"
    android:layout_marginBottom="8dp"
    android:background="@drawable/rightcornerround"
    android:paddingLeft="20dp"
    android:paddingTop="10dp"
    android:paddingRight="20dp"
    android:paddingBottom="10dp"
    android:text="Sign Up"
    android:textColor="#FFFFFF"
    android:textSize="20sp"
    app:layout_constraintBottom_toTopOf="@+id/guideline2"
    app:layout_constraintStart_toStartOf="@+id/guideline" />

为背景创建两个可绘制文件

1) leftcornerround.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle">
   <solid android:color="@color/colorAccent"></solid>
    <corners android:topLeftRadius="12dp"
       android:bottomLeftRadius="12dp"
       android:topRightRadius="0dp"
       android:bottomRightRadius="0dp"/>
</shape>

2) rightcornerround.xml

 <?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle">
     <solid android:color="@color/colorAccent"></solid>
     <corners android:topLeftRadius="0dp"
        android:bottomLeftRadius="0dp"
        android:topRightRadius="12dp"
       android:bottomRightRadius="12dp"/>
 </shape>

如何在 Android 布局中将按钮并排放置并粘贴

How do I place buttons next to each other, sticking them, in Android Layout

android

android-layout

button

android-linearlayout

android-relativelayout