Sử Dụng CardView Trong Android

Trong phiên bản Android 5.0 (Android L, API 21) có giới thiệu một widget mới có tên là CardView. Về cơ bản thì CardView giống như FrameLayout như có bo trò bốn góc (round corner) và có hiệu ứng Shadow. Và CardView thường được sử dụng làm container cho các row trong ListView và ReyclerView.

Giới thiệu

CardView trong Android

Mặc định trong Android SDK không có sẵn widget này giống như Button hay TextView mà chúng ta phải import dependences để Android Studio tự install widget này cho chúng ta. Và để làm được điều đó các bạn làm như sau.

Vào File > Project Structure… Và chọn module app, sau đó click vào Tab Dependencies.

Tại đây các bạn nhấn vào button có dấu + và chọn mục Libray Dependencies

Sau đó nhấn OK để kết thúc.

Nếu các bạn import thư viện theo cách này thì Android Studio sẽ import thư viện mới nhất (ở trên là lib này sử dụng cho API 25 hay Android 7.0 Nougat).

Hoặc cách nhanh hơn là các bạn mở file build.gradle (Module app) và paste dòng dưới đây vào trong dependencies

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

1	compile 'com.android.support:cardview-v7:24.2.1'

Vậy là bây giờ chúng ta có thể sử dụng CardView giống như Button hay TextView

Ví dụ sử dụng RecyclerView với CardView

Để ví dụ cách sử dụng CardView mình sẽ làm một demo có sử dụng RecyclerView với CardView để hiển thị danh sách các bài hát Karaoke.

Cũng giống như CardView thì đối với RecyclerView chúng ta cũng phải cài đặt thư viện trong dependencies với dòng dưới đây

compile 'com.android.support:recyclerview-v7:24.2.1'

1	compile 'com.android.support:recyclerview-v7:24.2.1'

Và đây là toàn bộ file build.gradle của mình

apply plugin: 'com.android.application'

android {
    compileSdkVersion 24
    buildToolsVersion "24.0.2"

    defaultConfig {
        applicationId "com.eitguide.cardviewdemo"
        minSdkVersion 15
        targetSdkVersion 24
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:24.2.1'
    compile 'com.android.support:cardview-v7:24.2.1'
    compile 'com.android.support:recyclerview-v7:24.2.1'
}

apply plugin: 'com.android.application'

android {

compileSdkVersion 24

buildToolsVersion "24.0.2"

defaultConfig {

applicationId "com.eitguide.cardviewdemo"

minSdkVersion 15

targetSdkVersion 24

versionCode 1

versionName "1.0"

}

buildTypes {

release {

minifyEnabled false

proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'

}

dependencies {

compile fileTree(include: ['*.jar'], dir: 'libs')

testCompile 'junit:junit:4.12'

compile 'com.android.support:appcompat-v7:24.2.1'

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

compile 'com.android.support:recyclerview-v7:24.2.1'

}

Mình thực hiện lại ví dụ đã làm trong bài Sử dụng RecyclerView nhưng ở bài viết này mình sẽ thiết kế row có sử dụng CardView

Bước 1: Tạo model để chứa data

Class Song đại diện cho 1 bài hát gồm các thông tin:

mCode: Mã số bài hát
mTitle: Tên bài hát
mLyric: Lyric của bài hát.
mAstist: Tên ca sĩ

File Song.java

package com.eitguide.cardviewdemo;

/**
 * Created by nguyennghia on 11/15/16.
 */
public class Song {
    private String mCode;
    private String mTitle;
    private String mLyric;
    private String mArtist;


    public Song() {

    }

    public Song(String code, String title, String lyric, String artist) {
        this.mCode = code;
        this.mTitle = title;
        this.mLyric = lyric;
        this.mArtist = artist;
    }

    public String getCode() {
        return mCode;
    }

    public String getTitle() {
        return mTitle;
    }

    public String getLyric() {
        return mLyric;
    }

    public String getArtist() {
        return mArtist;
    }

    public void setCode(String code) {
        this.mCode = code;
    }

    public void setTitle(String title) {
        this.mTitle = title;
    }

    public void setLyric(String lyric) {
        this.mLyric = lyric;
    }

    public void setArtist(String artist) {
        this.mArtist = artist;
    }
}

package com.eitguide.cardviewdemo;

/**

* Created by nguyennghia on 11/15/16.

public class Song {

private String mCode;

private String mTitle;

private String mLyric;

private String mArtist;

public Song() {

}

public Song(String code, String title, String lyric, String artist) {

this.mCode = code;

this.mTitle = title;

this.mLyric = lyric;

this.mArtist = artist;

}

public String getCode() {

return mCode;

}

public String getTitle() {

return mTitle;

}

public String getLyric() {

return mLyric;

}

public String getArtist() {

return mArtist;

}

public void setCode(String code) {

this.mCode = code;

}

public void setTitle(String title) {

this.mTitle = title;

}

public void setLyric(String lyric) {

this.mLyric = lyric;

}

public void setArtist(String artist) {

this.mArtist = artist;

}

Bước 2: Thêm RecyclerView vào main_activity.xml

File main_activity.java

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.eitguide.cardviewdemo.MainActivity">

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

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context="com.eitguide.cardviewdemo.MainActivity">

<android.support.v7.widget.RecyclerView

android:id="@+id/rv_songs"

android:layout_width="match_parent"

android:layout_height="match_parent"/>

</RelativeLayout>

Bước 3: Tạo giao diện cho một row

<?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="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="3dp"
    android:layout_marginLeft="6dp"
    android:layout_marginRight="6dp"
    card_view:cardCornerRadius="8dp"
    card_view:cardElevation="8dp">

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="3dp"
        android:paddingLeft="6dp"
        android:paddingRight="6dp"
        android:paddingTop="3dp">

        <FrameLayout
            android:id="@+id/fl_code"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_centerVertical="true">

            <TextView
                android:id="@+id/tv_code"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#19b395"
                android:textSize="18dp" />
        </FrameLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="8dp"
            android:layout_toRightOf="@+id/fl_code"
            android:orientation="vertical">

            <TextView
                android:id="@+id/tv_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:textColor="#2c3e50"
                android:textSize="16dp"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/tv_lyric"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:textColor="#34495e"
                android:textSize="14dp" />

            <TextView
                android:id="@+id/tv_artist"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#7f8c8d"
                android:textSize="14dp" />

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

<?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="match_parent"

android:layout_height="wrap_content"

android:layout_marginBottom="3dp"

android:layout_marginLeft="6dp"

android:layout_marginRight="6dp"

card_view:cardCornerRadius="8dp"

card_view:cardElevation="8dp">

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:paddingBottom="3dp"

android:paddingLeft="6dp"

android:paddingRight="6dp"

android:paddingTop="3dp">

<FrameLayout

android:id="@+id/fl_code"

android:layout_width="wrap_content"

android:layout_height="match_parent"

android:layout_centerVertical="true">

<TextView

android:id="@+id/tv_code"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#19b395"

android:textSize="18dp" />

</FrameLayout>

<LinearLayout

android:layout_width="match_parent"

android:layout_height="match_parent"

android:layout_marginLeft="8dp"

android:layout_toRightOf="@+id/fl_code"

android:orientation="vertical">

<TextView

android:id="@+id/tv_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:ellipsize="end"

android:textColor="#2c3e50"

android:textSize="16dp"

android:textStyle="bold" />

<TextView

android:id="@+id/tv_lyric"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:ellipsize="end"

android:textColor="#34495e"

android:textSize="14dp" />

<TextView

android:id="@+id/tv_artist"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#7f8c8d"

android:textSize="14dp" />

</LinearLayout>

</RelativeLayout>

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

Thay vì sử dụng các ViewGroup khác thì ở đây mình sử dụng CardView. Một số thuộc tính sử dụng với CardView mình sẽ nói ở phần dưới.

Bước 4: Tạo Custom Adapter và bind dữ liệu cho từng row trong Adapter

package com.eitguide.cardviewdemo;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.List;

/**
 * Created by nguyennghia on 11/15/16.
 */
public class SongAdapter extends RecyclerView.Adapter<SongAdapter.SongViewHolder> {
    private static final String TAG = "SongAdapter";
    private List<Song> mSongs;
    private Context mContext;
    private LayoutInflater mLayoutInflater;

    public SongAdapter(Context context, List<Song> datas) {
        mContext = context;
        mSongs = datas;
        mLayoutInflater = LayoutInflater.from(context);
    }

    @Override
    public SongViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //inflate view from row_item_song.xml
        View itemView = mLayoutInflater.inflate(R.layout.row_item_song, parent, false);
        return new SongViewHolder(itemView);
    }

    @Override
    public void onBindViewHolder(SongViewHolder holder, int position) {
        //get song in mSong via position
        Song song = mSongs.get(position);

        //bind data to viewholder
        holder.tvCode.setText(song.getCode());
        holder.tvTitle.setText(song.getTitle());
        holder.tvLyric.setText(song.getLyric());
        holder.tvArtist.setText(song.getArtist());
    }

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

    class SongViewHolder extends RecyclerView.ViewHolder {
        private TextView tvCode;
        private TextView tvTitle;
        private TextView tvLyric;
        private TextView tvArtist;

        public SongViewHolder(View itemView) {
            super(itemView);
            tvCode = (TextView) itemView.findViewById(R.id.tv_code);
            tvTitle = (TextView) itemView.findViewById(R.id.tv_title);
            tvLyric = (TextView) itemView.findViewById(R.id.tv_lyric);
            tvArtist = (TextView) itemView.findViewById(R.id.tv_artist);
        }
    }
}

package com.eitguide.cardviewdemo;

import android.content.Context;

import android.support.v7.widget.RecyclerView;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.TextView;

import java.util.List;

/**

* Created by nguyennghia on 11/15/16.

public class SongAdapter extends RecyclerView.Adapter<SongAdapter.SongViewHolder> {

private static final String TAG = "SongAdapter";

private List<Song> mSongs;

private Context mContext;

private LayoutInflater mLayoutInflater;

public SongAdapter(Context context, List<Song> datas) {

mContext = context;

mSongs = datas;

mLayoutInflater = LayoutInflater.from(context);

}

@Override

public SongViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

//inflate view from row_item_song.xml

View itemView = mLayoutInflater.inflate(R.layout.row_item_song, parent, false);

return new SongViewHolder(itemView);

}

@Override

public void onBindViewHolder(SongViewHolder holder, int position) {

//get song in mSong via position

Song song = mSongs.get(position);

//bind data to viewholder

holder.tvCode.setText(song.getCode());

holder.tvTitle.setText(song.getTitle());

holder.tvLyric.setText(song.getLyric());

holder.tvArtist.setText(song.getArtist());

}

@Override

public int getItemCount() {

return mSongs.size();

}

class SongViewHolder extends RecyclerView.ViewHolder {

private TextView tvCode;

private TextView tvTitle;

private TextView tvLyric;

private TextView tvArtist;

public SongViewHolder(View itemView) {

super(itemView);

tvCode = (TextView) itemView.findViewById(R.id.tv_code);

tvTitle = (TextView) itemView.findViewById(R.id.tv_title);

tvLyric = (TextView) itemView.findViewById(R.id.tv_lyric);

tvArtist = (TextView) itemView.findViewById(R.id.tv_artist);

}

Bước 5: Setup RecyclerView trong MainActivity.java

Không giống như ListView chúng ta chỉ cần set Adapter cho ListView là đủ nhưng đối với RecyclerView chúng ta phải set 2 thành phần bắt buộc dưới đây:

+ set adapter cho RecyclerView sử dụng phương thức setAdapter

+ set layout manager để chỉ ra chúng ta muốn layout các item như thế nào (vertical, horizotal, grid, staggered grid) bằng cách sử dụng phương thức setLayoutManager.

Source file MainActivity.java

package com.eitguide.cardviewdemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    private RecyclerView rvSongs;
    private SongAdapter mSongAdapter;
    private List<Song> mSongs;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        rvSongs = (RecyclerView)findViewById(R.id.rv_songs);

        //create song data
        mSongs = new ArrayList<>();
        mSongs.add(new Song("60696", "NẾU EM CÒN TỒN TẠI", "Khi anh bắt đầu một tình yêu Là lúc anh tự thay", "Trịnh Đình Quang"));
        mSongs.add(new Song("60701", "NGỐC", "Có rất nhiều những câu chuyện Em dấu riêng mình em biết", "Khắc Việt"));
        mSongs.add(new Song("60650", "HÃY TIN ANH LẦN NỮA", "Dẫu cho ta đã sai khi ở bên nhau Cô yêu thương", "Thiên Dũng"));
        mSongs.add(new Song("60610", "CHUỖI NGÀY VẮNG EM", "Từ khi em bước ra đi cõi lòng anh ngập tràng bao", "Duy Cường"));
        mSongs.add(new Song("60656", "KHI NGƯỜI MÌNH YÊU KHÓC", "Nước mắt em đang rơi trên những ngón tay Nước mắt em", "Phạm Mạnh Quỳnh"));
        mSongs.add(new Song("60685", "MỞ", "Anh mơ gặp em anh mơ được ôm anh mơ được gần", "Trịnh Thăng Bình"));
        mSongs.add(new Song("60752", "TÌNH YÊU CHẮP VÁ", "Muốn đi xa nơi yêu thương mình từng có Để không nghe", "Mr. Siro"));
        mSongs.add(new Song("60608", "CHỜ NGÀY MƯA TAN", "Một ngày mưa và em khuất xa nơi anh bóng dáng cứ", "Trung Đức"));
        mSongs.add(new Song("60603", "CÂU HỎI EM CHƯA TRẢ LỜI", "Cần nơi em một lời giải thích thật lòng Đừng lặng im", "Yuki Huy Nam"));
        mSongs.add(new Song("60720", "QUA ĐI LẶNG LẼ", "Đôi khi đến với nhau yêu thương chẳng được lâu nhưng khi", "Phan Mạnh Quỳnh"));
        mSongs.add(new Song("60856", "QUÊN ANH LÀ ĐIỀU EM KHÔNG THỂ - REMIX", "Cần thêm bao lâu để em quên đi niềm đâu Cần thêm", "Thiện Ngôn"));


        mSongAdapter = new SongAdapter(this,  mSongs);
        rvSongs.setAdapter(mSongAdapter);

        //RecyclerView scroll vertical
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);
        rvSongs.setLayoutManager(linearLayoutManager);
    }
}

package com.eitguide.cardviewdemo;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.LinearLayoutManager;

import android.support.v7.widget.RecyclerView;

import java.util.ArrayList;

import java.util.List;

public class MainActivity extends AppCompatActivity {

private RecyclerView rvSongs;

private SongAdapter mSongAdapter;

private List<Song> mSongs;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

rvSongs = (RecyclerView)findViewById(R.id.rv_songs);

//create song data

mSongs = new ArrayList<>();

mSongs.add(new Song("60696", "NẾU EM CÒN TỒN TẠI", "Khi anh bắt đầu một tình yêu Là lúc anh tự thay", "Trịnh Đình Quang"));

mSongs.add(new Song("60701", "NGỐC", "Có rất nhiều những câu chuyện Em dấu riêng mình em biết", "Khắc Việt"));

mSongs.add(new Song("60650", "HÃY TIN ANH LẦN NỮA", "Dẫu cho ta đã sai khi ở bên nhau Cô yêu thương", "Thiên Dũng"));

mSongs.add(new Song("60610", "CHUỖI NGÀY VẮNG EM", "Từ khi em bước ra đi cõi lòng anh ngập tràng bao", "Duy Cường"));

mSongs.add(new Song("60656", "KHI NGƯỜI MÌNH YÊU KHÓC", "Nước mắt em đang rơi trên những ngón tay Nước mắt em", "Phạm Mạnh Quỳnh"));

mSongs.add(new Song("60685", "MỞ", "Anh mơ gặp em anh mơ được ôm anh mơ được gần", "Trịnh Thăng Bình"));

mSongs.add(new Song("60752", "TÌNH YÊU CHẮP VÁ", "Muốn đi xa nơi yêu thương mình từng có Để không nghe", "Mr. Siro"));

mSongs.add(new Song("60608", "CHỜ NGÀY MƯA TAN", "Một ngày mưa và em khuất xa nơi anh bóng dáng cứ", "Trung Đức"));

mSongs.add(new Song("60603", "CÂU HỎI EM CHƯA TRẢ LỜI", "Cần nơi em một lời giải thích thật lòng Đừng lặng im", "Yuki Huy Nam"));

mSongs.add(new Song("60720", "QUA ĐI LẶNG LẼ", "Đôi khi đến với nhau yêu thương chẳng được lâu nhưng khi", "Phan Mạnh Quỳnh"));

mSongs.add(new Song("60856", "QUÊN ANH LÀ ĐIỀU EM KHÔNG THỂ - REMIX", "Cần thêm bao lâu để em quên đi niềm đâu Cần thêm", "Thiện Ngôn"));

mSongAdapter = new SongAdapter(this, mSongs);

rvSongs.setAdapter(mSongAdapter);

//RecyclerView scroll vertical

LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);

rvSongs.setLayoutManager(linearLayoutManager);

}

Chạy thử ứng dụng và xem kết quả

Chúng ta thấy sử dụng CardView trong thiết kế rất đẹp đúng không nào. Và tiếp theo mình sẽ đề cập đến các thuộc tính mà chúng ta thường sử dụng với CarView

Một số thuộc tính thường dùng với CardView

Nhìn qua đoạn mã thiết kế row ở trên

<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="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="3dp"
    android:layout_marginLeft="6dp"
    android:layout_marginRight="6dp"
    android:background="#2ecc71"
    card_view:cardCornerRadius="8dp"
    card_view:cardBackgroundColor="#2ecc71"
    card_view:cardElevation="8dp">

<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="match_parent"

android:layout_height="wrap_content"

android:layout_marginBottom="3dp"

android:layout_marginLeft="6dp"

android:layout_marginRight="6dp"

android:background="#2ecc71"

card_view:cardCornerRadius="8dp"

card_view:cardBackgroundColor="#2ecc71"

card_view:cardElevation="8dp">

Có ba thuộc tính mà chúng ta quan tâm đó là

card_view:cardCornerRadius

1	card_view:cardCornerRadius

Xác định “mức độ bo trò” của CardView

card_view:cardBackgroundColor

1	card_view:cardBackgroundColor

Với CardView chúng không không thể set background qua thuộc tính background như những view bình thường khác mà phải set thông qua thuộc tính này

card_view:cardElevation

1	card_view:cardElevation

Thuộc tính này xác định “mức độ đổ bóng (shadow) cho cardView

Ngoài các set những thuộc tính này trong XML thì chúng ta cũng có thể set chúng trong Java Code như sau

CardView card = ...
card.setCardBackgroundColor(Color.parseColor("#E6E6E6"));
card.setMaxCardElevation(0.0);
card.setRadius(5.0);

CardView card = ...

card.setCardBackgroundColor(Color.parseColor("#E6E6E6"));

card.setMaxCardElevation(0.0);

card.setRadius(5.0);

8 thoughts on “Sử Dụng CardView Trong Android”

Trường says:

November 25, 2016 at 3:58 pm

sự kiện vào mỗi Item trong RecyclerView là gì vậy bạn

1. Nguyễn Nghĩa says:
  
  November 25, 2016 at 5:02 pm
  
  Bạn có thể sử dụng phương thức setOnClickListener cho itemView của ViewHolder.
  
hoang trong hung says:

December 8, 2016 at 11:07 am

cho hoi lam sao cho cot so thu tu no co the tu dong tang dk vay
thank

tonyhoang says:

December 8, 2016 at 12:59 pm

cho e hoi cho buoc 3 la minh tao mot man hinh moi hay la trong File main_activity.java
lun vay

1. Nguyễn Nghĩa says:
  
  December 8, 2016 at 6:16 pm
  
  Đó là file .xml mới nha bạn. Ở đây mình đặt tên cho file này là row_item_song.xml. File này là layout của một row đó bạn.
  
tonyhoang says:

December 9, 2016 at 12:48 pm

hen chi

Hoang says:

February 4, 2017 at 6:09 pm

Bạn ơi, bạn có thể hướng dẫn cho mình làm sao để ban đầu mình chỉ cho hiện tên bài hát, sau khi click vào item thì mới show Lyrics và tên ca sĩ được không?

1. Hoang says:
  
  February 4, 2017 at 6:13 pm
  
  Ngoài ra khi click vào 1 bài hát khác thì Lyrics và tên ca sĩ của bài trước lại ẩn đi nữa

Giới thiệu

CardView trong Android

Ví dụ sử dụng RecyclerView với CardView

Bước 1: Tạo model để chứa data

Bước 2: Thêm RecyclerView vào main_activity.xml

Bước 3: Tạo giao diện cho một row

Bước 4: Tạo Custom Adapter và bind dữ liệu cho từng row trong Adapter

Bước 5: Setup RecyclerView trong MainActivity.java

Một số thuộc tính thường dùng với CardView

8 thoughts on “Sử Dụng CardView Trong Android”

Leave a Reply Cancel reply