Cardview in Android

hello friends
today we are going to learn about card view in android. it's advance concept of android material design. it's used to create music player like application in android. let's take an example.

add dependencies in build gradle file.
    compile 'com.android.support:cardview-v7:26.+'
    compile 'com.android.support:recyclerview-v7:26.+'
   
CardViewPOJO.java

public class CardViewPOJO {
    int time ;
    String msg;

    public int getImg() {
        return img;
    }

    public void setImg(int img) {
        this.img = img;
    }

    public String getMsg() {
        return msg;
    }

    public void setMsg(String msg) {
        this.msg = msg;
    }
}


CardViewCustomeAdapter.java

public class CardViewCustomeAdapter extends BaseAdapter {
    Context c;
    ArrayList<CardViewPOJO> spacecrafts;

    public CardViewCustomeAdapter(Context c, ArrayList<CardViewPOJO> spacecrafts) {
        this.c = c;
        this.spacecrafts = spacecrafts;
    }

    @Override
    public int getCount() {
        return spacecrafts.size();
    }

    @Override
    public Object getItem(int i) {
        return spacecrafts.get(i);
    }

    @Override
    public long getItemId(int i) {
        return i;
    }

    @Override
    public View getView(int i, View view, ViewGroup viewGroup) {
        if(view==null)
        {
            view= LayoutInflater.from(c).inflate(R.layout.customecardviewmodel,viewGroup,false);
        }

        final CardViewPOJO s= (CardViewPOJO) this.getItem(i);

        ImageView img= (ImageView) view.findViewById(R.id.img);
        TextView propTxt= (TextView) view.findViewById(R.id.msg);

        propTxt.setText(s.getImg());
        img.setImageResource(s.getImg());

        view.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(c, s.getMsg(), Toast.LENGTH_SHORT).show();
            }
        });

        return view;
    }
}


customecardviewmodel.xml

<?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="150dp"
    android:layout_height="200dp"
    android:layout_margin="10dp"
    android:orientation="horizontal"
    card_view:cardCornerRadius="5dp"
    card_view:cardElevation="5dp">

    <LinearLayout
        android:layout_width="150dp"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/img"
            android:layout_width="150dp"
            android:layout_height="150dp" />

        <TextView
            android:id="@+id/msg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:lines="1"
            android:padding="10dp"
            android:textAppearance="?android:attr/textAppearanceLarge" />
    </LinearLayout>

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


MainActivity.java


public class MainActivity extends AppCompatActivity {

    CardViewCustomeAdapter cardViewCustomeAdapter;
    GridView grid_view;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        grid_view = (GridView) findViewById(R.id.grid_view);
        cardViewCustomeAdapter = new CardViewCustomeAdapter(this, setdata());
        grid_view.setAdapter(cardViewCustomeAdapter);
    }

    private ArrayList setdata() {
        ArrayList<CardViewPOJO> CardViewPOJOs = new ArrayList<>();

        CardViewPOJO s = new CardViewPOJO();
        s.setMsg("image1");
        s.setImg(R.drawable.image1);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("image2");
        s.setImg(R.drawable.image2);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("image3");
        s.setImg(R.drawable.image3);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("image4");
        s.setImg(R.drawable.image4);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("image5");
        s.setImg(R.drawable.image5);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("Simage6");
        s.setImg(R.drawable.image6);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("image7");
        s.setImg(R.drawable.image7);
        CardViewPOJOs.add(s);
        s = new CardViewPOJO();
        s.setMsg("image8");
        s.setImg(R.drawable.image8);
        CardViewPOJOs.add(s);
        return CardViewPOJOs;
    }

}


activity_main.xml

<RelativeLayout 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/relativeLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="50dp"
    tools:context=".MainActivity">

    <GridView
        android:id="@+id/grid_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:numColumns="2" />
</RelativeLayout>

Comments