Monday, November 3, 2014

Recyclerview with Cards example in Android with AppCompat (V7)


I have created a sample application to show RecyclerView and CardView in android with Latest Appcompat Library (V7 Library).
Step 1:
Import three Libary Project to the Eclipse
1) AppCompat 
2) RecyclerView
3) CardView
from the folder android-sdk\extras\android\support\v7
Step 2 :
Create a new Project/download the Source from below, 
and add the three Libary Projects to the MainProject as a Library Projects.

CardViewActivity.java

package com.pratap.cardviews1;
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;

public class CardViewActivity extends ActionBarActivity {

private Toolbar toolbar;

private RecyclerView mRecyclerView;
private RecyclerView.Adapter mAdapter;
private RecyclerView.LayoutManager mLayoutManager;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);

}

String[] myDataset = { "Alpha", "Beta", "CupCake", "Donut", "Eclair",
"Froyo", "Gingerbread", "Honeycomb", "Ice Cream Sandwitch",
"JellyBean", "KitKat", "LollyPop" };

mRecyclerView = (RecyclerView) findViewById(R.id.my_recycler_view);

// getSupportActionBar().setIcon(R.drawable.ic_launcher);

// getSupportActionBar().setTitle("Android Versions");

// use this setting to improve performance if you know that changes
// in content do not change the layout size of the RecyclerView
mRecyclerView.setHasFixedSize(true);

// use a linear layout manager
mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);

// specify an adapter (see also next example)
mAdapter = new CardViewDataAdapter(myDataset);
mRecyclerView.setAdapter(mAdapter);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
if (id == R.id.action_settings) {
Toast.makeText(getApplicationContext(), "Settings Clicked",
Toast.LENGTH_SHORT).show();
return true;
} else if (id == R.id.action_search) {
Toast.makeText(getApplicationContext(), "Search Clicked",
Toast.LENGTH_SHORT).show();
return true;
}
return super.onOptionsItemSelected(item);
}
}


CardViewDataAdapter.java

package com.pratap.cardviews1;

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

public class CardViewDataAdapter extends RecyclerView.Adapter<CardViewDataAdapter.ViewHolder> {
public String[] mDataset;



// Provide a suitable constructor (depends on the kind of dataset)
public CardViewDataAdapter(String[] myDataset) {
mDataset = myDataset;
}

// Create new views (invoked by the layout manager)
@Override
public CardViewDataAdapter.ViewHolder onCreateViewHolder(ViewGroup parent,
int viewType) {
// create a new view
View itemLayoutView = LayoutInflater.from(parent.getContext()).inflate(
R.layout.cardview_row, null);

// create ViewHolder

ViewHolder viewHolder = new ViewHolder(itemLayoutView);
return viewHolder;
}

// Replace the contents of a view (invoked by the layout manager)
@Override
public void onBindViewHolder(ViewHolder viewHolder, int position) {

// - get data from your itemsData at this position
// - replace the contents of the view with that itemsData

viewHolder.tvtinfo_text.setText(mDataset[position].toString());

}

// Return the size of your dataset (invoked by the layout manager)
@Override
public int getItemCount() {
return mDataset.length;
}

// inner class to hold a reference to each item of RecyclerView
public static class ViewHolder extends RecyclerView.ViewHolder {

public TextView tvtinfo_text;

public ViewHolder(View itemLayoutView) {
super(itemLayoutView);
tvtinfo_text = (TextView) itemLayoutView
.findViewById(R.id.info_text);

}
}

}


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

activity_main.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:background="#c9c9c9"
android:orientation="vertical" >

<!-- A RecyclerView with some commonly used attributes -->

<include
android:id="@+id/toolbar"
layout="@layout/toolbar" />

<android.support.v7.widget.RecyclerView
android:id="@+id/my_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:scrollbars="vertical" />

</LinearLayout>


cardview_row.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="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:orientation="horizontal"
card_view:cardCornerRadius="5dp"
card_view:cardUseCompatPadding="true" >

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?android:selectableItemBackground"  >

<TextView
android:id="@+id/info_text"
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_centerInParent="true"
android:gravity="center"
android:textColor="@android:color/black"
android:textSize="24sp" />
</RelativeLayout>

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


Link   Source code





ScreenShots




No comments:

Post a Comment