Can delete Super & multi-effect card view (transform from Cardsui-for-android Open source project), provide demo download

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

Example demo at the end of this article

Brief introduction

This demo mainly uses the Cardsui-for-android open source project, and has done some optimizations and improvements:

1. Define the card view yourself

2. Add a long press event. Avoid mis-operation

3. Can delete card after long press, and play the selected animation

4. A hover button appears after deletion

5. Click the hover button to restore the previously deleted card view

Before looking at the content, it is strongly recommended to read the following two articles, as this demo is written on the basis of these two articles:

About cardsui-for-android This open source project introduction and implementation please see this blog cool open source project cardsui-for-android-Ultra-specific source code analysis, specifically explain how the effects are implemented

4,5 function is to participate in the Open source project Cardslib. Import and introduction to this open source project see this blog post Open source project Cardslib Introduction and methods of importing eclipse and execution

Next for the above 5 improvement Introduction: (This article is only to provide a way of thinking, detailed code details suggested or to see the demo provided)

1. Define the card view yourself

Here is simply a different background color for different card sets:

Cardstack stack = new Cardstack (this); Stack.settitle ("Please support Big Corn's blog");        for (int i = 0; i < 5; i++) {        Mycard card = null;            switch (i) {case                0:                card = new Mycard ("#FFBB33");                    break;                Case 1:                card = new Mycard ("#98CC00");                    break;                Case 2:                card = new Mycard ("#A966CC");                    break;                Case 3:                card = new Mycard ("#33B4E4");                    break;                Case 4:                card = new Mycard ("#FF4343");                    break;            }            Stack.add (card);        }        Mcardview.addstack (stack);

Mycard class is my own definition of a inherit from the card class an implementation class, detailed implementation please look at the code in the demo, very easy. Can be very easy to change to the way you want to look, here is just more introduction.

2. Add a long press event to avoid mis-operation

3. You can delete card after long press. And play the selected animation

In the Cardstack GetView () method, you can set the click monitoring of the card

            Normal Click Monitoring            Cardview.setonclicklistener (Getclicklistener (this, container, i));            Long Click to listen            Cardview.setonlongclicklistener (Getonlongclicklistener (card));            Touch Monitor            Cardview.setontouchlistener (new Swipedismisstouchlistener (                    CardView, card, I, new ondismisscallback () {                    @Override public                        void Ondismiss (view view, Object token, int index) {                    ...             }}}

Long Click to listen for Getonlongclicklistener () implementation:

   Listen for incoming card as a reference    private Onlongclicklistener Getonlongclicklistener (final card) {    return new Onlongclicklistener () {@Overridepublic Boolean onlongclick (View v) {//To set a flag for card, The card was long pressed card.setlongclickable (true);//Play animation animation shake = Animationutils.loadanimation (Mcontext, R.anim.shake); v.startanimation (shake); return false;}    ;}    

This animation is a swing around the animation, detailed implementation can go to the code to find, here is just more introduction.

Note here that the long press in the listener finally returns false. Here in the previous article detailed introduction, the role is to give the event to ontouch monitoring processing.

Next look at the card set the identity bit later to Ontouchlistener. Touch events are triggered by both normal and long press clicks

@Overridepublic Boolean OnTouch (View view, Motionevent motionevent) {//Press case Motionevent.action_down: {... false;} Lift Case MOTIONEVENT.ACTION_UP: {if (Dismiss && c.islongclickable ()) {...} Set the long press mark to the initial falsec.setlongclickable (false); Slide Case Motionevent.action_move: {if (mswiping & C.islongclickable ()) {.... return true;} Break;}}

As in the pseudo code above. In the slide and lift operation, first infer the long press mark in the card. Finally, when lifting, the long press mark is reset to false, so that the long press operation is achieved.

4. A hover button appears after deletion

The first thing to achieve this function is to know where to delete the event, so talent to join the corresponding function.

Delete the event in the touch Monitor described above in the swipe operation inside. If you can delete it, a delete animation is played first. Run the Performdismiss () method in the callback method at the end of the animation.

The method runs the deleted callback method Mcallback.ondismiss (MView, Mtoken, Mindex), and the detail of the callback method is now the most starting point for the card to set the touch listening area.

Cardview.setontouchlistener (New Swipedismisstouchlistener (CardView, card, I, new ondismisscallback                        () {@Override public void Ondismiss (view view, Object token, int index) {                        Card c = (card) token;                        Call oncardswiped () listener c.onswipecard ();                        Cards.remove (c);                        Madapter.setitems (Mstack, GetPosition ());                        Refresh ();                                                Madapter.notifydatasetchanged ();                            Check for a undo message to confirm if (Isenableundo () && mundobarcontroller!=null) {                            Show Undobar Undocard itemundo=new undocard (c, index);                              if (mcontext!=null) {Resources res = mcontext.getresources ();  if (res!=null) {int number = index+1; String Messageundobar = "Are you sure you want to delete the +number+" card view?                                    ";                                            Mundobarcontroller.showundobar (False,                                Messageundobar, Itemundo); }                            }                        }                    }                }));

The callback method removes the card from the Cards collection first. The deleted card and his location are then passed to the Undocard class. The Undobarcontroller.showundobar method is then used to display the suspended click button, which shows the message and the Undocard class that carried the deletion information.

After that, simply look at the Undobarcontroller class:

Public Undobarcontroller (View undobarview, Undolistener undolistener,undobaruielements undobaruielements) {MBarVie        W = Undobarview;        Mbaranimator = Mbarview.animate ();        Mundolistener = Undolistener;        if (undobaruielements==null) undobaruielements = new Defaultundobaruielements ();        Mundobaruielements = undobaruielements;        Mmessageview = (TextView) Mbarview.findviewbyid (Mundobaruielements.getundobarmessageid ()); Mbarview.findviewbyid (Mundobaruielements.getundobarbuttonid ()). Setonclicklistener (New View.OnClickListener () {@Override public void OnClick (view view) {Hideundobar (f                        Alse);                    Mundolistener.onundo (Mundotoken);        }                });    Hideundobar (TRUE);        } @SuppressLint ("Newapi") public void Showundobar (Boolean immediate, charsequence message, parcelable Undotoken) {       Mundotoken = Undotoken; mundomessage = message;        Mmessageview.settext (Mundomessage);        Mhidehandler.removecallbacks (mhiderunnable);        Mhidehandler.postdelayed (mhiderunnable, 5000);        Mbarview.setvisibility (view.visible);        if (immediate) {Mbarview.setalpha (1);            } else {mbaranimator.cancel (); Mbaranimator. Alpha (1). Setduration (Mbarview.getresource S (). Getinteger (Android.        R.integer.config_shortanimtime)). Setlistener (NULL); }} @SuppressLint ("Newapi") public void Hideundobar (Boolean immediate) {Mhidehandler.removecallbacks (mhiderun        nable);            if (immediate) {mbarview.setvisibility (view.gone);            Mbarview.setalpha (0);            Mundomessage = null;        Mundotoken = null;            } else {mbaranimator.cancel ();      Mbaranimator. Alpha (0)              . Setduration (Mbarview.getresources (). Getinteger (Android. r.integer.config_shortanimtime). Setlistener (New Animatorlisteneradapter () {@O Verride public void Onanimationend (Animator animation) {Mbarview.setvis                            Ibility (View.gone);                            Mundomessage = null;                        Mundotoken = null;        }                    }); }    }

The main concern here Showundobar， Hideundobar， UndobarcontrollerThese 3 methods

Showundobar and Hideundobar mainly control the display of the hover button. The layout of this button has been added in the code beforehand, and the visibility property of the two methods can be used to control the hiding and display.

5. Click the hover button to restore the previously deleted card view

Connect the top. The Undobarcontroller method has a listener that can monitor the click events of a suspended button:

Mbarview.findviewbyid (Mundobaruielements.getundobarbuttonid ())                . Setonclicklistener (New View.OnClickListener () {                    @Override public                    void OnClick (view view) {                        Hideundobar (false);                        Mundolistener.onundo (Mundotoken);                    }                });

Click to hide the button, then run the OnUndo method to restore the deleted card.

(Mundotoken is the Undocard class with the deleted card and his location information).

Public interface Undolistener {         /* * Called when you  undo the action         *        /void OnUndo (parcelable Undotoken);    }

This listener is an interface. The next thing to do is to find the implementationMundolistener.onundo (Mundotoken) is the place to listen for callback methods.

public class Cardstack extends Abstractcard implements Undobarcontroller.undolistener

The implementation of this interface is our Cardstack class. Next, find the OnUndo callback method in the class.

@Overridepublic void OnUndo (parcelable undotoken) {//restore items in lists (use Reversesortedorder)        if (undotoken! = NULL) {            Undocard item = (undocard) Undotoken;            Card card = Item.card;            int position = item.position;            if (card! = null) {               Add (card, position);               Madapter.notifydatasetchanged ();}}}        

Very easy to implement: remove the card and position stored in the Undocard. Add him to the collection again, and the refresh adapter displays again.

Probably the introduction to this open source project is complete. This article is just to provide a thought, detailed code details to suggest or to see the demo provided.

The Delete recovery feature was modeled after Cardsui, the open source project. The classes covered above are described in the two classes Undocard and Undobarcontroller.

Finally, I strongly recommend that you take a look at these two classes and related invocation methods. The code is not much and the design is very good, it is worth studying.

。

Demo:

Github:https://github.com/a396901990/cardlist/tree/master

CSDN Click to download

Can delete Super & multi-effect card view (transform from Cardsui-for-android Open source project), provide demo download