sirawichdev / cardslider-android

:octocat: 🃏 Cardslider is a material design UI controller that allows you to swipe through cards with pictures and accompanying descriptions.

CardSlider for Android

About

This project is maintained by Ramotion, Inc.
We specialize in the designing and coding of custom UI for Mobile Apps and Websites.

Looking for developers for your project?
This project is maintained by Ramotion, Inc. We specialize in the designing and coding of custom UI for Mobile Apps and Websites.

The Android mockup available here.

Requirements

​

• Android 4.4 KitKat (API lvl 19) or greater
• Your favorite IDE

Installation

​ Just download the package from here and add it to your project classpath, or just use the maven repo:

Gradle:

'com.ramotion.cardslider:card-slider:0.1.0'

SBT:

libraryDependencies += "com.ramotion.cardslider" % "card-slider" % "0.1.0"

Maven:

<dependency>
	<groupId>com.ramotion.cardslider</groupId>
	<artifactId>card-slider</artifactId>
	<version>0.1.0</version>
</dependency>

​

Basic usage

CardSlider is a custom LayoutManager for RecyclerView. You can attach it to RecyclerView from code or XML layout.

Here are the attributes you can specify in the constructor or XML layout:

• activeCardLeft - Active card offset from start of RecyclerView. Default value is 50dp.
• cardWidth - Card width. Default value is 148dp.
• cardsGap - Distance between cards. Default value is 12dp.

For card snapping, there is CardSnapHelper class.'

...
@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
    recyclerView.setLayoutManager(new CardSliderLayoutManager(this););

    new CardSnapHelper().attachToRecyclerView(recyclerView);
    ...
}

You can find this and other, more complex, examples in this repository ​

License

​ CardSlider for Android is released under the MIT license. See LICENSE for details.

Get the Showroom App for iOS to give it a try

Try our UI components in our iOS app. Contact us if interested.

Follow us for the latest updates