如何在cardview中设置按钮的位置

Question

我在卡片视图中有几个按钮，但我无法将它拖到我想要的任何地方。 实际上我想将媒体播放器的“下一步”按钮设置在“播放”按钮的右侧。

这是我的 xml 代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:orientation="vertical">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="90dp"
        app:cardBackgroundColor="?attr/colorPrimaryDark"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        app:cardCornerRadius="0dp"
        app:cardElevation="12dp">

    <Button
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center_horizontal|center_vertical"
        android:background="@mipmap/play" />

        <Button
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:background="@mipmap/next"
            android:layout_gravity="center_vertical|end"/>

        <Button
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:background="@mipmap/previous"
            android:layout_gravity="center_vertical|start"/>

        <SeekBar
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/seekBar2"
            android:max="100"/>

    </android.support.v7.widget.CardView>

</RelativeLayout>

结果：

pic result

而我想要的是：

what i want image

Answer 1

在您的卡片视图中添加任何类型的布局，然后在布局中添加您的元素（按钮、文本视图...）。

Design appearance of following xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    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:id="@+id/cardview_provider"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp">

    <!-- 
        //Layout within the cardview in which you have to add your components
        //(Button, TextView...)
        //could be other type of layout (I usually use ConstraintLayout)
    -->
    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/provider_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/common_google_signin_btn_icon_dark"/>

        <TextView
            android:id="@+id/provider_name"
            android:text="Google"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            app:layout_constraintStart_toEndOf="@+id/provider_icon"
            app:layout_constraintTop_toTopOf="parent"/>

        <TextView
            android:id="@+id/provider_uri"
            android:text="https://www.google.com"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="4dp"
            app:layout_constraintStart_toEndOf="@+id/provider_icon"
            app:layout_constraintTop_toBottomOf="@+id/provider_name"/>

    </android.support.constraint.ConstraintLayout>

</android.support.v7.widget.CardView>

Answer 2

我迟到了。或者，您可以尝试GridLayout。这是我在示例中使用的GridLayout 的示例。

android:layout_row 定义应该是哪一行。行号从上到下开始。 android:layout_column 定义对象应该是哪一列。从左到右排序。 android:layout_columnSpan 定义对象应该有多少列。

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/card_margin"
        android:layout_marginBottom="@dimen/card_marginBottom">

        <GridLayout
            style="@style/Widget.CardContent"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/sample"
                android:layout_row="0"
                android:layout_column="0" />

            <TextView
                android:id="@+id/txtVw_RestName"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"

                android:layout_marginLeft="10dp"
                android:layout_marginStart="10dp"
                android:layout_row="0"
                android:layout_column="1"
                android:layout_columnSpan="2"/>

            <TextView
                android:id="@+id/txtVw_RestLot"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"

                android:layout_marginLeft="10dp"
                android:layout_marginStart="10dp"

                android:layout_marginTop="-40dp"

                android:layout_row="1"
                android:layout_column="1"
                android:layout_columnSpan="2"/>

            <TextView
                android:id="@+id/txtVw_DescProgBar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Vacancy"

                android:layout_marginLeft="10dp"
                android:layout_marginStart="10dp"

                android:layout_row="2"
                android:layout_column="1" />

            <ProgressBar
                android:id="@+id/progBar"
                android:layout_width="150dp"
                android:minHeight="5dp"
                android:max="100"
                style="?android:attr/progressBarStyleHorizontal"

                android:layout_marginTop="3dp"
                android:layout_marginLeft="10dp"
                android:layout_marginStart="10dp"

                android:layout_row="2"
                android:layout_column="2"/>
        </GridLayout>
    </android.support.v7.widget.CardView>
</LinearLayout>

Answer 3

使用这个：

<?xml version="1.0" encoding="utf-8"?>
    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="90dp"
        app:cardBackgroundColor="?attr/colorPrimaryDark"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        app:cardCornerRadius="0dp"
        app:cardElevation="12dp">

<LinearLayout android:layout_width="wrap_content"
        android:layout_height="140dp"
        android:orientation="horizontal">

    <Button
        android:layout_width="0dp"
        android:layout_height="30dp"
        android:layout_weight="1"
        android:background="@mipmap/next"/>
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="30dp"
        android:background="@mipmap/play" />
    <Button
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="30dp"
        android:background="@mipmap/previous"/>
    </LinearLayout>
    <SeekBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/seekBar2"
        android:max="100"/>

</android.support.v7.widget.CardView>