CircularCardsStackView

Overview

Features

• Android 11 support
• Easy setup
• Endless card stack
• Swipe horizontally with animation
• Fully customized
• Support to all resolutions with portrait orientation

Usage

Dependencies

• Step 1: Add the JitPack repository in your project build.gradle file

allprojects {
	    repositories {
		    ...
		    maven { url 'https://jitpack.io' }
	    }
    }

or

If Android studio version is Arctic Fox then add it in your settings.gradle:

 dependencyResolutionManagement {
    		repositories {
        		...
        		maven { url 'https://jitpack.io' }
    		}
	   }

• Step 2: Add the dependency in your app module build.gradle file

dependencies {
		    ...
	        implementation 'com.github.Mindinventory:CircularCardsStackView:0.0.2'
	}

Implementation

• Step 1: Add CardCircularStackView in your xml and customize attributes

<com.mindinventory.circularcardsstackview.ui.CircularCardsStackView
       android:id="@+id/cardStack"
       android:layout_width="0dp"
       android:layout_height="wrap_content"
       app:actionOptionsVisibility="true"
       app:childViewHeight="@dimen/_250sdp"
       app:primaryTextColor="@android:color/white"
       app:primaryTextFontFamily="@font/roboto_bold"
       app:primaryTextSize="@dimen/_16ssp"
       app:profileViewBackgroundColor="#80000000"
       app:secondaryTextColor="@android:color/white"
       app:secondaryTextFontFamily="@font/roboto_medium"
       app:secondaryTextSize="@dimen/_14ssp"
       app:stackCardBackgroundColor="@color/white"
       app:stackCardChildPadding="@dimen/_15sdp"
       app:stackCardCornerRadius="@dimen/_20sdp"
       app:stackCardStrokeColor="@color/white"
       app:stackCardStrokeWidth="@dimen/_2sdp"  />

Step 2: Provide card list and implement pageChangeListener

cardStack.setUpCardStack(ArrayList<CardModel>(), object:OnPageChangeListener{
            override fun onPageScrolled(position: Int) {
                
            }

            override fun onPageSelected(position: Int) {
                
            }

            override fun onPageScrollStateChanged(state: Int) {
                
            }
        })

Step 3: Customize card action option's icon and implement action listener

cardStack.setActionOptions(
            firstButtonResourceId = R.drawable.ic_message,
            secondButtonResourceId = R.drawable.ic_heart,
            object : CardActionListener {
                override fun onFirstButtonOptionClick(position: Int) {

                }

                override fun onSecondButtonOptionClick(position: Int) {

                }

            }
        )

Appearance

Attribute	Description	Default
stackCardBackgroundColor	The background color of the card	white
stackCardChildPadding	The padding of the card's child view	_15sdp
stackCardCornerRadius	The corner radius of the card	_30sdp
stackCardStrokeColor	The stroke color of the card	white
stackCardStrokeWidth	The stroke width of the card	_2sdp
profileViewBackgroundColor	The background color of profile view	#80000000
childViewHeight	The height of the child view of the card	_250sdp
actionOptionsVisibility	Manage the visibility of the actions of the card	true
primaryTextColor	The text color of the primary text of the profile view	white
secondaryTextColor	The text color of the secondary text of the profile view	white
primaryTextFontFamily	The FontFamily of the primary text of the profile view	roboto_bold
secondaryTextFontFamily	The FontFamily of the secondary text of the profile view	roboto_medium
primaryTextSize	The text size of the primary text of the profile view	_16ssp
secondaryTextSize	The text size of the secondary text of the profile view	_14ssp

Guideline for contributors

Contribution towards our repository is always welcome, we request contributors to create a pull request to the develop branch only.

Guideline to report an issue/feature request

It would be great for us if the reporter can share the below things to understand the root cause of the issue.

• Library version
• Code snippet
• Logs if applicable
• Device specification like (Manufacturer, OS version, etc)
• Screenshot/video with steps to reproduce the issue

Requirements

• minSdkVersion >= 21
• Androidx

Library used

• sdp
• ssp
• RoundedImageView
• Glide
• Gson

LICENSE!

CircularCardsStackView is MIT-licensed.

Let us know!

If you use our open-source libraries in your project, please make sure to credit us and Give a star to www.mindinventory.com

Please feel free to use this component and Let us know if you are interested to building Apps or Designing Products.