使用Recyclerview创建Cardviews

时间:2017-07-17 03:58:59

标签: android android-recyclerview cardview

我正在使用Recyclerview创建Cardviews,例如Stackerflow和Youtube中的每个教程。它对我有用,但是当我运行应用程序时,它只显示了一个包含整个数据的Cardview。

活动主要:

<android.support.v7.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/reciclador"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="3dp"
    android:scrollbars="vertical" />

布局卡:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="4dp"
    card_view:cardElevation="4dp">

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


        <ImageView
            android:id="@+id/imgRestaurant"
            android:layout_width="400dp"
            android:layout_height="100dp"
            android:layout_alignParentEnd="true"
            android:layout_alignParentTop="true"
            android:layout_marginTop="18dp"
            card_view:srcCompat="@drawable/soporte_it" />

        <TextView
            android:id="@+id/lblNombre"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:layout_below="@+id/imgRestaurant"
            android:layout_marginTop="10dp"
            android:text="Restaurant Soporte" />

        <TextView
            android:id="@+id/lblDescripcion"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:layout_below="@+id/lblNombre"
            android:layout_marginTop="22dp"
            android:text="TextView" />

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

数据类(clsRestaurants):

package com.soft.kukito.cardviewprueba;

/**
 * Created by Hernan on 16/7/2017.
 */

public class clsRestaurants {
    private int imagen_r;
    private String nombre_r;
    private String descripcion_r;

    public clsRestaurants(int imagen_r, String nombre_r, String descripcion_r) {
        this.imagen_r = imagen_r;
        this.nombre_r = nombre_r;
        this.descripcion_r = descripcion_r;
    }

    public int getImagen_r() {
        return imagen_r;
    }

    public String getNombre_r() {
        return nombre_r;
    }

    public String getDescripcion_r() {
        return descripcion_r;
    }
}

适配器(restaurantAdapter):

   package com.soft.kukito.cardviewprueba;

import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.TextView;

import java.lang.reflect.Array;
import java.util.ArrayList;

import static android.os.Build.VERSION_CODES.M;

/**
 * Created by Hernan on 16/7/2017.
 */

public class restaurantsAdapter extends RecyclerView.Adapter<restaurantsAdapter.restaurantsViewHolder>
{

    private ArrayList<clsRestaurants> restaurant_item;

    public restaurantsAdapter(ArrayList<clsRestaurants> restaurant_item) {
        this.restaurant_item = restaurant_item;
    }

    @Override
    public restaurantsViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
        View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.layout_cards,viewGroup,false);
        restaurantsViewHolder restaurants = new restaurantsViewHolder(v);
        return restaurants;
    }

    @Override
    public void onBindViewHolder(restaurantsViewHolder restaurantsViewHolder, int i) {
        restaurantsViewHolder.nombre.setText(restaurant_item.get(i).getNombre_r());
        restaurantsViewHolder.descripcion.setText(restaurant_item.get(i).getDescripcion_r());
        restaurantsViewHolder.imagen.setImageResource(restaurant_item.get(i).getImagen_r());
    }

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

    public class restaurantsViewHolder extends RecyclerView.ViewHolder{
        TextView nombre,descripcion;
        ImageView imagen;

        public restaurantsViewHolder(View itemView) {
            super(itemView);

            nombre=(TextView)itemView.findViewById(R.id.lblNombre);
            descripcion=(TextView) itemView.findViewById(R.id.lblDescripcion);
            imagen=(ImageView)itemView.findViewById(R.id.imgRestaurant);
        }
    }
}

这让我头疼不已,感谢大家的回答。

我得到了什么: Result and problem

预期结果: Expected result

3 个答案:

答案 0 :(得分:2)

看到每个角落的灰色小空间? 我怀疑你可以只为你的CardView添加保证金,添加此行。

android:layout_marginBottom="10dp"

所以它看起来像这个

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardCornerRadius="4dp"
    card_view:cardElevation="4dp"
    android:layout_marginBottom="10dp">

在您的布局卡中,当然您可以轻松地对左右边距执行相同操作,使其看起来像您的预期结果。

答案 1 :(得分:0)

所以基本上recyclerview默认没有分频器。你应该添加分隔符。

https://developer.android.com/reference/android/support/v7/widget/DividerItemDecoration.html

这将让您了解如何分隔。

同样this会让您清楚地了解如何使用RecyclerView和CardView

答案 2 :(得分:0)

在build.gradle文件中添加此文件

compile 'com.android.support:cardview-v7:23.4.0'

并在recycleler adapter的xml文件中使用以下代码(您为行项编写代码)

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    card_view:cardBackgroundColor="@android:color/white"
    card_view:cardCornerRadius="4dp"
    card_view:cardElevation="4dp"
    card_view:cardPreventCornerOverlap="false"
    card_view:cardUseCompatPadding="true">
</android.support.v7.widget.CardView>

将此标记用作root标记...完成!!!