https://github.com/codeestx/ecardflow

:lollipop:A custom ViewPager for multiple card flow system. && A layout which provide beautiful background effects for ViewPager.
https://github.com/codeestx/ecardflow

background-image blur cardview custom-viewpager effects viewpager

Last synced: 3 months ago
JSON representation

:lollipop:A custom ViewPager for multiple card flow system. && A layout which provide beautiful background effects for ViewPager.

• Host: GitHub
• URL: https://github.com/codeestx/ecardflow
• Owner: codeestX
• License: mit
• Created: 2017-01-15T09:24:52.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2017-03-20T16:28:11.000Z (over 8 years ago)
• Last Synced: 2025-04-10T03:17:33.821Z (3 months ago)
• Topics: background-image, blur, cardview, custom-viewpager, effects, viewpager
• Language: Java
• Homepage:
• Size: 68.4 MB
• Stars: 44
• Watchers: 3
• Forks: 18
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ECardFlow

[![](https://jitpack.io/v/codeestX/ECardFlow.svg)](https://jitpack.io/#codeestX/ECardFlow)

ECardFlow, A custom ViewPager for multiple card flow system.designed by [Leo Leung](https://ios.uplabs.com/posts/multiple-card-flow

)  

ECardFlow, 一个用于复数卡片滑动与展开效果的ViewPager控件，设计原型出自[Leo Leung](https://ios.uplabs.com/posts/multiple-card-flow

)  

ECardFlowLayout, A layout provide beautiful background effect for ViewPager.  

ECardFlowLayout, 一个为ViewPager提供多种联动背景效果的布局

# Preview

ECardFlow:  

![](https://github.com/codeestX/ECardFlow/raw/master/preview/GIF.gif)  

ECardFlowLayout:  

![](https://github.com/codeestX/ECardFlow/raw/master/preview/GIFBlur.gif)

![](https://github.com/codeestX/ECardFlow/raw/master/preview/GIFMove.gif)

# Usage(ECardFlow)

Step 1. Add the JitPack repository to your build file

	allprojects {

		repositories {

			...

			maven { url "https://jitpack.io" }

		}

	}

   

Step 2. Add the dependency

	dependencies {

	        compile 'com.github.codeestX:ECardFlow:v1.0.5'

	}

	

Step 3. Just use it as a ViewPager

	

* Only support fragment as each page

* For best performance, giving ECardFlow's parent view an attr`android:clipChildren="false"`,and do `NOT` set ECardFlow's width as`match_parent`

* See DemoProject for more details

Attrs:

	

        

        

        

        

        

        

            

            

        

        

        

        

        

        

        

    

Java Code:

	mEcardflow.gotoNext();

	

	mEcardflow.gotoLast();

	

	mEcardflow.expand();

	

	mEcardflow.shrink();

	

	mEcardflow.isExpanding();

	

	mEcardflow.setTouchSlop(slop);

	

	mEcardflow.setExpandTime(time);

	

	mEcardflow.setOnExpandStateListener(new ECardFlow.OnExpandStateListener() {

	            @Override

	            public void onExpand(View page, int position) {

	           

	            }

	

	            @Override

	            public void onShrink(View page, int position) {

	          

	            }

	        });

	        

# Usage(ECardFlowLayout)

Step 1. Add the JitPack repository to your build file

	allprojects {

		repositories {

			...

			maven { url "https://jitpack.io" }

		}

	}

   

Step 2. Add the dependency

	dependencies {

	        compile 'com.github.codeestX:ECardFlow:v1.0.5'

	}

	

Step 3. Just put a ViewPager in ECardFlowLayout 

	

	    

	

Step 4. setAnimMode & setImageProvider

	mVPLayout = (ECardFlowLayout) findViewById(R.id.ecardflow_layout);

	mVPLayout.setAnimMode(new BlurAnimMode());

	mVPLayout.setImageProvider(new DrawableImageProvider(this, res, width, height);

* Set AnimMode before Set ImageProvider

* Use `mVPLayout.onDestroy();` to release source

* See DemoProject for more details

Attrs:  

	

        

        

    

    

Java Code:

		mVPLayout.setImageProvider(imageProvider);

		

		mVPLayout.setAnimMode(animMode);

		

		mVPLayout.setSwitchAnimTime(time);

		

		//maxSize = Runtime.getRuntime().maxMemory();

		//default: maxSize / 5

		//min: maxSize / 8

		mVPLayout.setCacheSize(megabytes);

		

		mVPLayout.onDestroy();

	

    

| AnimMode      | Des           |

|:-------------:|:-------------:|

| DefaultAnimMode  | No Effect   |

| BlurAnimMode | Blur Effect     |

| MoveAnimMode | Parallax Effect |

| ScaleAnimMode | Scale Effect |

| CrossMoveAnimMode | Cross Parallax Effect |

You can custom AnimMode with class which implements `AnimMode`

| ImageProvider      | Des           |

|:-------------:|:-------------:|

| DrawableImageProvider  | Prividing resId(R.drawable/mipmap.xx) as image resource |

| PathImageProvider | Prividing file path as image resource     |

| FileImageProvider | Prividing `File` as image resource |

You can custom ImageProvider with class which implements `ImageProvider`

  

If you choose `BlurAnimMode`, you can enable `RenderScript` for a high performance.

> Open the build.gradle file in the app folder of your application module.  

> Add the following RenderScript settings to the file:  

> 

> 		android {

>	    	compileSdkVersion 23

>	    	buildToolsVersion "23.0.3"

>	

>	    defaultConfig {

>	        minSdkVersion 9

>	        targetSdkVersion 19

>	

>			//Enable RenderScript

>	        renderscriptTargetApi 23

>	        renderscriptSupportModeEnabled true

>	    	}

>		}

>

# [Download Demo APK](https://fir.im/yl3e)

# License

      MIT Copyright (c) 2017 codeestX