Android recyclerView 与 cardview 布局问题

Question

我正在创建一个布局，如第一张图片所示。我正在使用带有 Cardview 的 RecyclerView 来完成此屏幕，但正如您在模拟器输出中看到的那样，我没有获得所需的布局（如第一张图片所示），因为它看起来很疯狂，因为所有项目都应分别对齐，就像 HTML Table 在 WEB 中并且应该在所有设备上都相同。

这是我的布局资源 XML 文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/textViewStatus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:text="TextView" />

    <TextView
        android:id="@+id/textViewHomeTeam"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="false"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/textViewStatus"
        android:text="TextView" />

    <ImageView
        android:id="@+id/imageViewHomeTeamLogo"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_centerInParent="false"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/textViewHomeTeam"
        android:padding="4dp" />

    <TextView
        android:id="@+id/textViewScore"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="false"
        android:layout_toRightOf="@+id/imageViewHomeTeamLogo"
        android:text="TextView" />

    <TextView
        android:id="@+id/textViewMatchStatus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textViewStatus"
        android:layout_centerInParent="false"
        android:layout_toEndOf="@+id/imageViewHomeTeamLogo"
        android:text="TextView" />

    <ImageView
        android:id="@+id/imageViewAwayTeamLogo"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_centerInParent="false"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/textViewScore"
        android:padding="4dp" />

    <TextView
        android:id="@+id/textViewAwayTeam"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="false"
        android:layout_centerHorizontal="false"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/imageViewAwayTeamLogo"
        android:text="TextView" />

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

有什么不足请指正。

Answer 1

您可以在卡片视图中使用水平方向的线性布局。

<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent">

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

</RelativeLayout>

Answer 2

嘿，我给你粗略的布局可能会对你有所帮助，

 <?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="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="16dp" >

    <TextView
        android:id="@+id/textViewStatus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="FT"
        android:padding="8dp"
        android:background="@drawable/text_drawable"
        android:textSize="16sp"/>

    <TextView
        android:id="@+id/textViewHomeTeam"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="35dp"
        android:layout_marginLeft="35dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/textViewStatus"
        android:text="Arsenol" />

    <ImageView
        android:id="@+id/imageViewHomeTeamLogo"
        android:layout_width="25dp"
        android:layout_height="match_parent"
        android:layout_marginLeft="10dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/textViewHomeTeam"
        android:padding="4dp" />

    <TextView
        android:id="@+id/textViewScore"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@+id/imageViewHomeTeamLogo"
        android:text="21:00"
        android:textStyle="bold"/>

    <TextView
        android:id="@+id/textViewMatchStatus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@+id/textViewStatus"
        app:layout_constraintLeft_toRightOf="@+id/imageViewHomeTeamLogo"
        android:text="Not Started" />

    <ImageView
        android:id="@+id/imageViewAwayTeamLogo"
        android:layout_width="25dp"
        android:layout_marginLeft="12dp"
        android:layout_height="match_parent"
        android:src="@color/colorAccent"
        app:layout_constraintLeft_toRightOf="@+id/textViewMatchStatus"
        android:padding="4dp" />

    <TextView
        android:id="@+id/textViewAwayTeam"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/imageViewAwayTeamLogo"
        android:text="Leisure city" />

Answer 3

使用以下布局更新您的布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:weightSum="4">

            <ImageView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="0.5" />

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

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_weight="0.3" />

            </LinearLayout>

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

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />

            </LinearLayout>


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

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"/>

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1" />

            </LinearLayout>

            <ImageView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="0.5" />

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

Answer 4

将您的 onCreateViewHolder 替换为以下

@Override
    public CountryListAdapter onCreateViewHolder(ViewGroup parent, int viewType) {
        View view;
        view = LayoutInflater.from(mContext).inflate(R.layout."your_layout", null);

        RecyclerView.LayoutParams params = new RecyclerView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        view.setLayoutParams(params);

        CountryListAdapter viewHolder = new CountryListAdapter(view);
        return viewHolder;
    }

Android recyclerView 与 cardview 布局问题

Android recyclerView with cardview layout issue

android

android-recyclerview

android-cardview

recyclerview-layout