如何在 LinearLayout 中居中 CardView？答案

【问题标题】：How to center CardView inside LinearLayout?如何在 LinearLayout 中居中 CardView？
【发布时间】：2020-07-17 09:21:50
【问题描述】：

我有一个纵向显示器，我想将其转换为横向模式。

在横向模式下，包含 LinearLayout 的第一个子元素（也是一个 LinearLayout）应该包含 CardView 和 ImageView（四舍五入，我不确定结果如何）。在第二个 LinearLayout 中，我希望用户名和密码 EditText 水平相邻。最后，最后一个 LinearLayout 也应该包含水平的 Login 和 Sign Up 按钮。

我不知道如何在第一个子 LinearLayout 中居中 CardView 以及如何使 ImageView 变圆。

这是我所拥有的：

<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/gradient"
    android:gravity="center"
    tools:context=".LoginActivity">

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


        <androidx.cardview.widget.CardView
            android:id="@+id/imageView"
            android:layout_width="150dp"
            android:layout_height="match_parent"
            app:cardBackgroundColor="#090909"
            app:cardCornerRadius="250dp">


            <!--<androidx.cardview.widget.CardView
                android:layout_width="150dp"
                android:layout_height="145dp"
                android:gravity="center"
                app:cardCornerRadius="250dp">

            </androidx.cardview.widget.CardView>-->

        </androidx.cardview.widget.CardView>

        <!--<ImageView
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_gravity="center_horizontal"
            android:scaleType="centerCrop"
            android:src="@drawable/login_logo" />-->

    </LinearLayout>

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

        <!--HERE WILL BE Username and Password-->

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal">
    <!--HERE WILL BE Login and Sign up-->

    </LinearLayout>


</LinearLayout>

【问题讨论】：

有了ConstraintLayout，你的生活会很轻松，试试看
如果LinearLayout 是垂直的，您可以通过android:gravity="center" 将CardView 设置在中心。
@noureldienmohamed 试过了，仍然保持在同一个位置..
@Rafsanjani 可能，但这是任务。
@Rafsanjani 错了。关于作业的问题是允许的，但他们are still bound by the same criteria as other questions

标签： android xml android-layout cardview

【解决方案1】：

android:gravity 处理其子元素的对齐方式，

android:layout_gravity 处理自身的对齐。

如果您想要更圆润的卡片视图，请修复卡片视图的高度。

为其他线性布局“2”赋予权重，为小尺寸赋予卡片视图权重“1”的布局。

谢谢！快乐编码

<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#abcdef"
    android:layout_gravity="center"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:orientation="horizontal">


        <androidx.cardview.widget.CardView
            android:id="@+id/imageView"
            android:layout_width="150dp"
            android:layout_height="match_parent"
            app:cardBackgroundColor="#090909"
            app:cardCornerRadius="150dp">


            <!--<androidx.cardview.widget.CardView
                android:layout_width="150dp"
                android:layout_height="145dp"
                android:gravity="center"
                app:cardCornerRadius="250dp">

            </androidx.cardview.widget.CardView>-->

        </androidx.cardview.widget.CardView>

        <!--<ImageView
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_gravity="center_horizontal"
            android:scaleType="centerCrop"
            android:src="@drawable/login_logo" />-->

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="2"
        android:orientation="horizontal">

        <!--HERE WILL BE Username and Password-->

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="2"
        android:orientation="horizontal">
        <!--HERE WILL BE Login and Sign up-->

    </LinearLayout>
</LinearLayout>

[这是你的项目（图片）=>https://i.stack.imgur.com/68ARf.png]

【讨论】：

是的，解决了这个问题。我什至阅读了 Head First Android Development。正如您所指出的那样，那里说：“android:gravity 让您说出您希望视图的内容出现在视图中的哪个位置。”谢谢，我不知何故错过了这个......

【解决方案2】：

你的问题很简单。只需像这样更改线性布局的方向：

 <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" <!--change this-->
    android:layout_weight="1">


    <androidx.cardview.widget.CardView
        android:id="@+id/imageView"
        android:layout_width="150dp"
        android:layout_gravity="center"   <!-- and this-->
        android:layout_height="match_parent"
        app:cardBackgroundColor="#090909"
        app:cardCornerRadius="250dp">

    </androidx.cardview.widget.CardView>

    <!--<ImageView
        android:layout_width="150dp"
        android:layout_height="match_parent"
        android:layout_gravity="center_horizontal"
        android:scaleType="centerCrop"
        android:src="@drawable/login_logo" />-->

</LinearLayout>

此操作后，您的卡片视图图像将位于中心

【讨论】：