[안드로이드]Android CardView Example

2016. 7. 19. 19:33Mobile/Android



반응형

[안드로이드]Android CardView Example


리스트뷰로  안나오는 모양은 없다. 


 RecyclerView 로 이용한 CardView 이다 퍼포먼스에서 더 좋고 다양한 처리 효과 등이 유용해서 많이 바꾸는 추세이다.


RecyclerView 는 기본적으로 LayoutManager를 사용하여 아이템을 관리한다 이 부분이 다르군...


custom 하여 카드뷰처럼 흉내를 내서 사용 했지만  뭐... 사용자입장에서는 알 수가 없다. 



일단 코드를 보자 !




build.gradle


compile 'com.android.support:cardview-v7:21.0.+'

compile 'com.android.support:recyclerview-v7:21.0.+'


RecyclerViewActivity.java


import android.app.Activity;

import android.os.Bundle;

import android.support.v7.widget.LinearLayoutManager;

import android.support.v7.widget.RecyclerView;


import java.util.ArrayList;

import java.util.List;


public class RecyclerViewActivity extends Activity {


    private List<Car> car;

    private RecyclerView rv;


    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);


        setContentView(R.layout.rv_activity);


        rv=(RecyclerView)findViewById(R.id.rv);


        LinearLayoutManager lm = new LinearLayoutManager(this);

        rv.setLayoutManager(lm);

        rv.setHasFixedSize(true);



        initDate();

    }


    private void initDate(){

        car = new ArrayList<>();

        car.add(new Car("BMW", "Z4", R.drawable.z4));

        car.add(new Car("BENZ", "SLK", R.drawable.slk));

        car.add(new Car("AUDI", "TT", R.drawable.tt));


        RVAdapter adapter = new RVAdapter(car,getApplicationContext());

        rv.setAdapter(adapter);

    }

}



Car.java


class Car {

    String brand;

    String name;

    int pic;


    Car(String brand, String name, int pic) {

        this.brand = brand;

        this.name = name;

        this.pic = pic;

    }

}



CarAdapter.java


import android.content.Context;

import android.support.v7.widget.CardView;

import android.support.v7.widget.RecyclerView;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ImageView;

import android.widget.TextView;

import android.widget.Toast;


import java.util.List;


public class CarAdapter extends RecyclerView.Adapter<CarAdapter.ObjViewHolder> {

    Context mContext;

    public static class ObjViewHolder extends RecyclerView.ViewHolder {


        CardView cv;

        TextView carBrand;

        TextView carName;

        ImageView carPic;



        ObjViewHolder(View itemView) {

            super(itemView);

            cv = (CardView)itemView.findViewById(R.id.cv);

            carBrand = (TextView)itemView.findViewById(R.id.carBrand);

            carName = (TextView)itemView.findViewById(R.id.carName);

            carPic = (ImageView)itemView.findViewById(R.id.carPic);

        }

    }


    List<Car> car;


    CarAdapter(List<Car> car, Context context){

        this.car = car;

        mContext =context;


    }


    @Override

    public void onAttachedToRecyclerView(RecyclerView recyclerView) {

        super.onAttachedToRecyclerView(recyclerView);

    }


    @Override

    public ObjViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {

        View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.row, viewGroup, false);

        ObjViewHolder ovh = new ObjViewHolder(v);

        return ovh;

    }


    @Override

    public void onBindViewHolder(ObjViewHolder ObjViewHolder, final int i) {

        ObjViewHolder.carBrand.setText(car.get(i).brand);

        ObjViewHolder.carName.setText(car.get(i).name);

        ObjViewHolder.carPic.setImageResource(car.get(i).pic);


        ObjViewHolder.carPic.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View view) {

                Toast.makeText(mContext, car.get(i).name, Toast.LENGTH_SHORT).show();

            }

        });


    }


    @Override

    public int getItemCount() {

        return car.size();

    }

}








rv_activity.xml


<?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:padding="14dp"

    >


    <android.support.v7.widget.RecyclerView

        android:id="@+id/rv"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        >


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



</LinearLayout>




row.xml


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

<android.support.v7.widget.CardView

    android:id="@+id/cv"

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

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    >


    <RelativeLayout

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:padding="14dp"

        >


        <ImageView

            android:id="@+id/carPic"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_alignParentLeft="true"

            android:layout_alignParentTop="true"

            android:layout_marginRight="14dp"

            android:src="@drawable/ic_launcher"

            />


        <TextView

            android:id="@+id/carName"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_alignParentTop="true"

            android:layout_toRightOf="@+id/carPic"

            android:text="nm"

            android:textSize="30sp"

            />


        <TextView

            android:id="@+id/carBrand"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_below="@+id/carName"

            android:layout_toRightOf="@+id/carPic"

            android:text="brand"

            />


    </RelativeLayout>


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





샘플 소스를 보면 간단하게 되어있다 기존 ListView 형식이랑 비슷하므로 이해하는 거에는 어려움이 없다.


각자의 취향에 맞춰서 커스텀 해서 사용하면 되겠네요~













끝~


반응형