时间戳

首页 > 解决方案 > 使用 CardLayout 和 RecyclerView 的项目未正确显示

android - 使用 CardLayout 和 RecyclerView 的项目未正确显示

问题描述

我目前正在关注本教程：https ://code.tutsplus.com/tutorials/getting-started-with-recyclerview-and-cardview-on-android--cms-23465

我正在尝试在 Recycler 视图中列出一些卡片，但是由于某种原因，在遵循教程并提供代码之后，看起来只有一张卡片，所有内容都在一张卡片中。见图片：

在此处输入图像描述

initData 方法中定义的所有对象都会显示出来，但正如我所提到的，似乎所有这些对象都被添加到一张卡片上？任何帮助将不胜感激！

quiz_item_ui.xml

    <?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/cv">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/person_photo"
            android:layout_alignParentStart="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:layout_marginRight="16dp"
            android:layout_marginEnd="16dp"
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/person_name"
            android:layout_toRightOf="@+id/person_photo"
            android:layout_toEndOf="@id/person_photo"
            android:layout_alignParentTop="true"
            android:textSize="30sp"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/person_age"
            android:layout_toRightOf="@+id/person_photo"
            android:layout_toEndOf="@id/person_photo"
            android:layout_below="@+id/person_name"/>

    </RelativeLayout>

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

活动主页.xml

 <?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:padding="16dp"
    tools:context=".HomeActivity">

    <android.support.v7.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/rv">

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


</LinearLayout>

QuizItemAdapter.java

    public class QuizItemAdapter extends RecyclerView.Adapter<QuizItemAdapter.QuizItemViewHolder>
{

    public static class QuizItemViewHolder extends RecyclerView.ViewHolder {
        CardView cv;
        TextView personName;
        TextView personAge;
        ImageView personPhoto;

        QuizItemViewHolder(View itemView)
        {
            super(itemView);
            cv = itemView.findViewById(R.id.cv);
            personName = itemView.findViewById(R.id.person_name);
            personAge = itemView.findViewById(R.id.person_age);
            personPhoto = itemView.findViewById(R.id.person_photo);

        }
    }
    List<QuizItem> items;

    QuizItemAdapter(List<QuizItem> items)
    {
        this.items = items;
    }

    @Override
    public QuizItemViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i)
    {
        View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.quiz_item_ui,viewGroup,false);
        QuizItemViewHolder qi = new QuizItemViewHolder(v);
        return qi;
    }

    @Override
    public void onBindViewHolder(QuizItemViewHolder quizItemViewHolder, int i)
    {
        quizItemViewHolder.personName.setText(items.get(i).name);
        quizItemViewHolder.personAge.setText(items.get(i).age);
        quizItemViewHolder.personPhoto.setImageResource(items.get(i).photoId);
    }

    @Override
    public int getItemCount()
    {
        return items.size();
    }
}

HomeActivity.java

    public class HomeActivity extends AppCompatActivity
{
    private List<QuizItem> qItems;
    private RecyclerView rv;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_home);

        rv = findViewById(R.id.rv);
        LinearLayoutManager lm = new LinearLayoutManager(this);
        rv.setLayoutManager(lm);
        rv.setHasFixedSize(true);

        initData();
        initAdapter();
    }
    private void initData()
    {
        qItems = new ArrayList<>();
        qItems.add(new QuizItem("Emma Wilson","23 years old",R.drawable.ic_location));
        qItems.add(new QuizItem("Emma Wilson","23 years old",R.drawable.ic_location));
        qItems.add(new QuizItem("Emma Wilson","23 years old",R.drawable.ic_location));

    }

    private void initAdapter()
    {
        QuizItemAdapter a = new QuizItemAdapter(qItems);
        rv.setAdapter(a);
    }


}

谢谢 ！

标签： 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:padding="16dp"    // remove this padding
    tools:context=".HomeActivity">

和

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"    // add margin here
    android:id="@+id/cv"/>

推荐阅读