CardsUI
Google’s Now popular Cards UI has everyone fascinated.
Now a library I created mimicking that behaviour is available.
The view might still be a little flaky, and the View’s code is not well documented, but the example really shows you how simple it all is.
Layout XML:
|
1 2 3 4 5 6 7 8 9 10 11 |
<RelativeLayout 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" > <com.fima.cardsui.views.CardUI android:id="@+id/cardsview" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout> |
Activity Class:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
// init CardView mCardView = (CardUI) findViewById(R.id.cardsview); mCardView.setSwipeable(false); // add AndroidViews Cards mCardView.addCard(new MyCard("Get the CardsUI view")); mCardView.addCardToLastStack(new MyCard("for Android at")); MyCard androidViewsCard = new MyCard("www.androidviews.net"); androidViewsCard.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { Intent intent = new Intent(Intent.ACTION_VIEW); intent.setData(Uri.parse("http://www.androidviews.net/")); startActivity(intent); } }); mCardView.addCardToLastStack(androidViewsCard); // add one card, and then add another one to the last stack. mCardView.addCard(new MyCard("2 cards")); mCardView.addCardToLastStack(new MyCard("2 cards")); // add one card mCardView.addCard(new MyCard("1 card")); // create a stack CardStack stack = new CardStack(); stack.setTitle("title test"); // add 3 cards to stack stack.add(new MyCard("3 cards")); stack.add(new MyCard("3 cards")); stack.add(new MyCard("3 cards")); // add stack to cardView mCardView.addStack(stack); // draw cards mCardView.refresh(); |
You can download the example APK.
or Clone the lib from Bitbucket or Github
Some Awesome Forks:
https://github.com/Androguide/cardsui-for-android
52 comments on “CardsUI”
Leave a comment
I need this view now, any way i can get it soon?
nice!
Any chance to know when this library will be available?
I was wondering if this is on Github? I would love to contribute.
Hi,
The library is now available on Bitbucket.
Enjoy!
in android < 4.0 the view not work !
Really looking forward to this
I am also looking forward to this!
Any news about this library ?
Please let me know when this library is ready …
Can this be removed and only re-added when it is actually real? It smells of vaporware.
Not vaporware mate,
The library is now available on Bitbucket.
Enjoy!
Thanks Nadav! Exactly what I was waiting for my redesigns!
Thanks for the library! Testing it out myself, I found swiping a card away only brings it back
make sure setSwipeable is true meaning you don’t setSwipeable(false)
Yeah, I set it to true. I can swipe it away, but it reappears right away
Will be fixed in a few minutes
Awesome!
I have tried the example on 4.0 devices and everything is fine, but on 2.x devices, the card stacks are only shown as a single card (the last one of the stack)
Is there a workaround, or am I doing something wrong?
Sounds like on 2.x devices, the top margin isn’t considered at all.
I’ll try to fix it later.
What kind of content can be added to the card view, Is it txt only? I just loaded the example apk I really didn’t look at the code
You can inflate it with any Layout XML.
Why don’t you use a feagment that implements a broadcast receiver? Or a similar pattern why so much extra work the cards don’t appear to be much more than that.
Awesome…
Thank You.
I’m trying to use this in an app that utilizes fragments. I can inflate the layout like the example, but when I attempt to add cards to the CardUI, nothing actually shows up (even after calling refresh()).
Any tips/pointers on how to appropriately use this in such a capacity? Seems like a really cool library!
Thanks so much for sharing!
Exactly what I have been looking for.
Would be checking compatibility on 2.x devices.
Thanks a ton!
Really helpful library. Thank you so much for doing this!
Loved using it. Will definitely be using it in my app.
Nice work! It would be nice to see a tablet layout, similar to Google+ layout.
i have a problem with this library in android < ICS
example
CARD UI android ICS
https://desarrolladores-android.googlegroups.com/attach/4447c0fec1d4b84a/cards_en_ics.png
CARD UI android < ICS
https://desarrolladores-android.googlegroups.com/attach/4447c0fec1d4b84a/cards_en_gingerbread.png
please help me !
When I use a EditText in CardUI, the input content will not be saved.
What can i do?
I’m trying to change the cards theme to dark Holo, but no success so far, I’ve tried everything from modifying styles.xml/colors.xml to inverting the drawables colors, but no go, nothing even slightly changes.
Could somebody please point me to the right direction ?
[...] can use basic idea how to write kind of code from CardUIExample. They have developed kind of such useful [...]
Does anyone know how I can reduce the margin between cards?
I’ve been fiddling with the dimension values in item_card.xml and item_card_empty.xml, but they don’t seem to be doing anything!
This needs better documentation. Other than that, it’s awesome!!
[...] library go to CardUI on androidviews.com [...]
[...] Check this out though, may be what you’re looking for: http://www.androidviews.net/2012/12/cardsui/ [...]
I’ve been trying to use an editText in a card, but when I touch the editText, it doesn’t get focus. Actually, it gets focus and right after it, lost the focus.
Is this a known issue?
The example shows how to set the onclick for each card statically, but how would you do that based on the index/position of the card??
[...] allows you to send WoL packets to computers and devices on the same network. This app uses CardsUI (http://www.androidviews.net/2012/12/cardsui/) and is [...]
[...] allows you to send WoL packets to computers and devices on the same network. This app uses CardsUI (http://www.androidviews.net/2012/12/cardsui/) and is [...]
[...] allows you to send WoL packets to computers and devices on the same network. This app uses CardsUI (http://www.androidviews.net/2012/12/cardsui/) and is [...]
[...] There is one for Android: http://www.androidviews.net/2012/12/cardsui/ [...]
[...] There is one for Android: http://www.androidviews.net/2012/12/cardsui/ [...]
Anyone know how to keep the views from recycling? I load data to cards, but every time I scroll away and back it forces the cards to reload their data.
It appears that inside the Card itself, getCardContent is called each time it is scrolled to, thus the reloading.
can i say something 中文
yes you can , i could understand you
I don’t know how ? i use it to my program instead of the traditional listview style.
How can I add a share button to the top of the cards. I’ve implemented it in the xml with an on click method, but the app crashes when I press it and says that the method doesn’t exist.
[...] I’m using the framework from here – http://www.androidviews.net/2012/12/c…; [...]
can anyone tell me how to use this library ?
[...] Cards – A very beautiful and simple UI component that will make your app look like Google Home. You can add single cards on your screens or stack of cards, if you prefer. [...]
Thank you.