如何在 android studio 中以线性布局将按钮并排放置?
How do I put buttons next to each other in linear layout in android studio?
您好,我想在 android 工作室中使用线性布局将两个按钮并排放置:
<LinearLayout 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"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/camera"
android:layout_marginTop="8dp"
app:strokeColor="@color/teal_700"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"/>
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginTop="8dp"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
/>
目前的输出是:
我尝试过使用相对布局 - 没有用,而且还在线性布局中使用了水平布局。
我也试过将 android:layout_weight 设为 1,但按钮消失了。
我想让imageview在中间,下面有两个按钮,两个按钮是挨着的。
如果您打算将此视图保留在 LinearLayout 中,这就是您要做的。您将在 ImageView 下方添加一个新的 LinearLayout 并设置其方向或水平。然后在该 LinearLayout 中添加您的按钮。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/camera"
android:layout_marginTop="8dp"
app:strokeColor="@color/teal_700"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"/>
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginTop="8dp"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
/>
</LinearLayout>
</LinearLayout>
如果您有兴趣使用 ConstraintLayout,您可以这样做:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/camera"
android:layout_marginTop="8dp"
app:strokeColor="@color/teal_700"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
app:layout_constraintTop_toBottomOf="@+id/imageView"
app:layout_constraintEnd_toStartOf="@+id/galleryBtn"
app:layout_constraintStart_toStartOf="parent"/>
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginTop="8dp"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
app:layout_constraintTop_toBottomOf="@+id/imageView"
app:layout_constraintStart_toEndOf="@+id/cameraBtn"
app:layout_constraintEnd_toEndOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
您可以在父布局中使用另一个 Linear Layout
并将其方向设置为水平以获得所需的输出。
所需输出代码:
<LinearLayout 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"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center"
android:gravity="center">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_gravity="center"
android:gravity="center"
android:text="@string/camera"
app:cornerRadius="100dp"
app:strokeColor="@color/teal_700" />
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="8dp"
android:text="Gallery"
app:cornerRadius="100dp" />
</LinearLayout>
在您当前的布局中,所有元素都在一个容器中,即您的 LinearLayout。
使用 LinearLayout 实现您想要的效果的一个想法是将图像和按钮分隔在 2 个不同的 LinearLayouts 中。
承载按钮的 LinearLayout 的方向应该是水平的。
<LinearLayout 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"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:gravity="center"
android:text="@string/camera"
app:cornerRadius="100dp"
app:strokeColor="@color/teal_700" />
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Gallery"
app:cornerRadius="100dp" />
</linearLayout>
</LinearLayout>
如果LinearLayout不是硬性要求,我建议使用ConstraintLayout。通过使用它,您可以更好、更轻松地定位所有内容。
您需要使用另一种线性布局将两个按钮并排放置,
这是代码。
<LinearLayout 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"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_marginTop="8dp"
android:layout_weight="1"
android:gravity="center"
android:text="Camera"
app:cornerRadius="100dp"
app:strokeColor="@color/teal_700" />
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_marginTop="8dp"
android:layout_weight="1"
android:text="Gallery"
app:cornerRadius="100dp" />
</androidx.appcompat.widget.LinearLayoutCompat>
</LinearLayout>
这是所需输出的屏幕截图。
您可以提供所需的边距来设置布局中的按钮。
您好,我想在 android 工作室中使用线性布局将两个按钮并排放置:
<LinearLayout 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"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/camera"
android:layout_marginTop="8dp"
app:strokeColor="@color/teal_700"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"/>
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginTop="8dp"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
/>
目前的输出是:
我尝试过使用相对布局 - 没有用,而且还在线性布局中使用了水平布局。
我也试过将 android:layout_weight 设为 1,但按钮消失了。
我想让imageview在中间,下面有两个按钮,两个按钮是挨着的。
如果您打算将此视图保留在 LinearLayout 中,这就是您要做的。您将在 ImageView 下方添加一个新的 LinearLayout 并设置其方向或水平。然后在该 LinearLayout 中添加您的按钮。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/camera"
android:layout_marginTop="8dp"
app:strokeColor="@color/teal_700"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"/>
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginTop="8dp"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
/>
</LinearLayout>
</LinearLayout>
如果您有兴趣使用 ConstraintLayout,您可以这样做:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="@string/camera"
android:layout_marginTop="8dp"
app:strokeColor="@color/teal_700"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
app:layout_constraintTop_toBottomOf="@+id/imageView"
app:layout_constraintEnd_toStartOf="@+id/galleryBtn"
app:layout_constraintStart_toStartOf="parent"/>
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Gallery"
android:layout_marginTop="8dp"
app:cornerRadius="100dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
app:layout_constraintTop_toBottomOf="@+id/imageView"
app:layout_constraintStart_toEndOf="@+id/cameraBtn"
app:layout_constraintEnd_toEndOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
您可以在父布局中使用另一个 Linear Layout
并将其方向设置为水平以获得所需的输出。
所需输出代码:
<LinearLayout 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"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center"
android:gravity="center">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_gravity="center"
android:gravity="center"
android:text="@string/camera"
app:cornerRadius="100dp"
app:strokeColor="@color/teal_700" />
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="8dp"
android:text="Gallery"
app:cornerRadius="100dp" />
</LinearLayout>
在您当前的布局中,所有元素都在一个容器中,即您的 LinearLayout。
使用 LinearLayout 实现您想要的效果的一个想法是将图像和按钮分隔在 2 个不同的 LinearLayouts 中。 承载按钮的 LinearLayout 的方向应该是水平的。
<LinearLayout 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"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:gravity="center"
android:text="@string/camera"
app:cornerRadius="100dp"
app:strokeColor="@color/teal_700" />
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Gallery"
app:cornerRadius="100dp" />
</linearLayout>
</LinearLayout>
如果LinearLayout不是硬性要求,我建议使用ConstraintLayout。通过使用它,您可以更好、更轻松地定位所有内容。
您需要使用另一种线性布局将两个按钮并排放置, 这是代码。
<LinearLayout 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"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="@+id/imageView"
android:layout_width="222dp"
android:layout_height="237dp"
app:srcCompat="@drawable/ic_launcher_background"
tools:layout_editor_absoluteX="246dp"
tools:layout_editor_absoluteY="322dp" />
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.button.MaterialButton
android:id="@+id/cameraBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_marginTop="8dp"
android:layout_weight="1"
android:gravity="center"
android:text="Camera"
app:cornerRadius="100dp"
app:strokeColor="@color/teal_700" />
<com.google.android.material.button.MaterialButton
android:id="@+id/galleryBtn"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_marginTop="8dp"
android:layout_weight="1"
android:text="Gallery"
app:cornerRadius="100dp" />
</androidx.appcompat.widget.LinearLayoutCompat>
</LinearLayout>
这是所需输出的屏幕截图。
您可以提供所需的边距来设置布局中的按钮。