ANDROID L--recyclerview,cardview Import and use (Demo)

Reprint Please indicate this article from Big Corn's blog (http://blog.csdn.net/a396901990 ), thank you for your support!

Brief introduction:

This article is a supplement to the ANDROID l--material Design specific explanation (UI control) or an application example, assuming that there is time to suggest a little bit of a glance at the previous article.

This article mainly describes the import and use of the new two UI controls Recyclerview,CardView , which are newly added to Android L.

Recyclerview is an upgraded version of the ListView

CardView is a card-view component provided by Google

This example uses Recyclerview to show a sample of multiple CardView. First look at the following:

Import Recyclerview,cardview

because Recyclerview , CardView is placed in the Support library V7 package, so we want to use it will need to guide the package.

Here's how the two packages are imported in Eclipse and Android Studio .

Eclipse:

First step: download/update Android support Libraries with SDK Manager (5.0 version is up to 21)

watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvytm5njkwmtk5ma==/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/ Dissolve/70/gravity/southeast ">

Step Two: import CardView and Recyclerview items (both in support V7)

1. Click Import in Eclipse, importing the Android project

2. Import CardView and Recycleview, the path is your SDK Path\extras\android\support\v7\cardview (Recycleview is recyclerview under the same folder)

3. When importing, remember to projectcopy to local and recommend renaming, so as to facilitate later management such as:

watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvytm5njkwmtk5ma==/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/ Dissolve/70/gravity/southeast ">

Step three: set up the library

1.: Set two project as library

2. Introduce these two libraries in main project such as:

These two packages can be imported in these three steps.

Android Studio

Android Stuido is much simpler than eclipse:

The first step:

First make sure you've upgraded your Android support libraries to the latest.

Step Two:

Open the Build.gradle file in the project, and add the following code to the dependencies, for example.

dependencies {    compile ' com.android.support:recyclerview-v7:21.+ '    compile ' com.android.support: Cardview-v7:21.+ '}

Step Three:

Build project again.

after the build is complete, you'll see that these two packages are already in the import.

Code Description:

Theme:

First of all, the theme of this black keynote is the use of the Material.Dark.ActionBar style.

Setup method: Change the VALUES-V21 directory under the Styles.xml file:

<resources>    <style name= "Apptheme" parent= "Android:ThemeOverlay.Material.Dark.ActionBar" >    </style></resources>

Layout file:

Recycler_view.xml (Recyclerview layout file):

<?xml version= "1.0" encoding= "Utf-8"?
><framelayout 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= ". MyActivity ">    <android.support.v7.widget.recyclerview        android:id=" @+id/list "        android:layout _width= "Match_parent"        android:layout_height= "match_parent"        tools:context= ". MyActivity "/></framelayout>

The framelayout includes the Recyclerview control

Card_view.xml (cardview layout file ):

<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:cardbackgroundcolor=" @color/cardvi Ew_dark_background "card_view:cardcornerradius=" 5DP "> <relativelayout android:layout_width=" match_pare NT "android:layout_height=" 100DP "android:padding=" 5DP "> <imageview android:id=" @+i D/pic "android:layout_width=" match_parent "android:layout_height=" Match_parent "android:l Ayout_centerinparent= "true" android:scaletype= "Centercrop"/> <textview Android:clickab Le= "true" android:id= "@+id/name" android:layout_width= "Match_parent" Android:layout_heigh t= "Match_parent" Android:laYout_marginbottom= "10DP" android:layout_marginright= "10DP" android:gravity= "Right|bottom" Android:textcolor= "@android: Color/white" android:textsize= "24sp"/> </relativelayout></android. Support.v7.widget.cardview>

CardView view includes a ImageView and a textview to display picture and text information separately

The only thing that needs to be described is the use of the layout file. For example, the following two properties:

Card_view:cardbackgroundcolor= "@color/cardview_dark_background"    card_view:cardcornerradius= "5DP"

their role is to set the CardView background color and the perimeter fillet size (note to use the Card_view namespace)

Code:

Actor Class (model class for encapsulating data):

public class actor{    String name;    String Picname;    Public Actor (string name, String picname)    {        this.name = name;        This.picname = Picname;    }    public int Getimageresourceid (context context)    {        try        {            return context.getresources (). Getidentifier (This.picname, "drawable", Context.getpackagename ());        }        catch (Exception e)        {            e.printstacktrace ();            return-1;}}}    

encapsulates the actor's name and picture name, theGetimageresourceid () method works by finding system resources based on the image

MyActivity (Program master control activity)

public class MyActivity extends activity{private Recyclerview mrecyclerview;    Private Myadapter Myadapter;    Private list<actor> actors = new arraylist<actor> ();    Private string[] names = {"Athena Chu", "Cecilia Cheung", "Zhang Min", "Gong Li", "Huangshengyi", "Zhao Wei", "Karen Mok", "such as Flowers"};    Private string[] Pics = {"P1", "P2", "P3", "P4", "P5", "P6", "P7", "P8"};        @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate);        Setcontentview (R.layout.recycler_view);        Actors.add (New Actor ("Athena Chu", "P1"));        Getactionbar (). Settitle ("The Star girl we chased in those years");        Get Recyclerview Mrecyclerview = (recyclerview) Findviewbyid (r.id.list);        Set Linearlayoutmanager Mrecyclerview.setlayoutmanager (new Linearlayoutmanager (this));        Set Itemanimator mrecyclerview.setitemanimator (New Defaultitemanimator ());        Sets the fixed size mrecyclerview.sethasfixedsize (true); Initialize your own defined adapter Myadapter = new Myadapter (This,Actors);    Set Adapter Mrecyclerview.setadapter (Myadapter) for Mrecyclerview;        @Override public boolean Oncreateoptionsmenu (Menu menu) {getmenuinflater (). Inflate (R.menu.menu, menu);    return true; } @Override public boolean onoptionsitemselected (MenuItem item) {switch (Item.getitemid ()) {//When point When you click Add button on the Actionbar.                    Add a new data to adapter and notify the Refresh case R.id.action_add:if (Myadapter.getitemcount ()! = names.length) {                    Actors.add (New Actor (Names[myadapter.getitemcount (), Pics[myadapter.getitemcount ()));                    Mrecyclerview.scrolltoposition (Myadapter.getitemcount ()-1);                Myadapter.notifydatasetchanged ();            } return true; When you click the Delete button on Actionbar, the last data is removed to adapter and the refresh Case r.id.action_remove:if is notified (Myadapter.getitem              Count ()! = 0) {actors.remove (Myadapter.getitemcount ()-1);      Mrecyclerview.scrolltoposition (Myadapter.getitemcount ()-1);                Myadapter.notifydatasetchanged ();        } return true;    } return super.onoptionsitemselected (item); }}

Myadapter (self-defined adapter class)

public class Myadapter extends recyclerview.adapter<myadapter.viewholder>{private list<actor> actors;    Private Context Mcontext;        Public Myadapter (context context, list<actor> actors) {This.mcontext = context;    This.actors = actors;        } @Override Public Viewholder oncreateviewholder (viewgroup viewgroup, int i) {//Set layout file for Viewholder        View v = layoutinflater.from (Viewgroup.getcontext ()). Inflate (R.layout.card_view, ViewGroup, false);    return new Viewholder (v);  } @Override public void Onbindviewholder (Viewholder viewholder, int i) {//Set element to Viewholder Actor        p = actors.get (i);        ViewHolder.mTextView.setText (P.name);    ViewHolder.mImageView.setImageDrawable (Mcontext.getdrawable (P.getimageresourceid (Mcontext)));    } @Override public int getitemcount () {//Returns the total number of data return actors = = null? 0:actors.size (); }//overriding its own definition Viewholder public static CLViewholder extends Recyclerview.viewholder {public TextView mtextview;        Public ImageView Mimageview;            Public Viewholder (View v) {super (V);            Mtextview = (TextView) V.findviewbyid (r.id.name);        Mimageview = (ImageView) V.findviewbyid (r.id.pic); }    }}

All code introductions are complete. Can be summed up to the following two points:

Recyclerview:

Understood as the previous ListView. Just need to set Linearlayoutmanager (at the moment the information is not much I'm a little confused later add) and Itemanimator ( animate each entry ) two new properties

Recyclerview.adapter:

The new adapter is understood as default and Viewholder-based. Only the callback method is slightly different. But the essence is the same.

Code: Https://github.com/a396901990/AndroidDemo

Written at the end:

A series of articles that have recently been written in an Android l--material design specific explanation.

Themes and layouts -- ANDROID l--material Design specific explanations (themes and layouts)

views and Shadows- ANDROID l--material Design specific explanations (views and shadows)

UI controls--ANDROID l--material Design specific explanations (UI controls)

Animation-- ANDROID l--material Design Specific explanation (animated article)

Now it's just the last animated part. The original plan is to wait for the animated article to write their use of the demo, but the previous UI control feel that the write is not specific, so first write the UI control demo.

View shadow and animation using the demo and other last animated article after the end of the update, please look forward to ...

Completed the link:ANDROID l--material Design Integrated Application (Demo)

Copyright notice: This article Bo Master original article. Blog, not reproduced without consent.

ANDROID L--recyclerview,cardview Import and use (Demo)