GithubHelp home page GithubHelp logo

klarcrk / fliplayout Goto Github PK

View Code? Open in Web Editor NEW

This project forked from cmfsotelo/fliplayout

0.0 0.0 0.0 605 KB

ViewGroup to easily swap between added views.

License: Apache License 2.0

Java 100.00%

fliplayout's Introduction

FlipLayout

Minimum SDK Android Arsenal

Use the FlipLayout as a ViewGroup to easily swap between child views.

Include in your project

In your root/build.gradle

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

In your app/build.gradle

dependencies {
	compile 'com.github.cmfsotelo:fliplayout:latest.version.here'
}

Usage

Simply use the FrameLayout public methods to change which view is visible.
/**
* Shows the child next to the one being shown, animating it. If the current child is the last one, the first child shown.
*/
public void showNextChild();

/**
* Shows the child previous to the one being shown, animating it. If the current child is the first one, the last child shown.
*/
public void showPreviousChild() ;

/**
* Sets the target child as the visible one. Can be animated or not. When animated, it animates from the current visible child immediately to the target one.
*
* @param targetChild - the target child
* @param animate     - flag to make the transition animating it or not
*/
public void showChild(int targetChild, boolean animate) 

Examples (click image to expand code)

Use to simply flip one view with another

<com.csot.fliplayout.lib.FlipLayout
android:id="@+id/fliplayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:transition="FLIP_X">

	<TextView
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"
	    android:layout_margin="10dp"
	    android:background="@drawable/circle"
	    android:backgroundTint="#4286f4"
	    android:gravity="center"
	    android:padding="20dp"
	    android:text="G"
	    android:textColor="#fff"
	    android:textSize="40dp"/>

	<ImageView
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"
	    android:layout_margin="10dp"
	    android:background="@drawable/circle"
	    android:backgroundTint="#555"
	    android:gravity="center"
	    android:padding="20dp"
	    android:src="@drawable/ic_done_black_48dp"
	    android:textStyle="bold"
	    android:tint="#fff"/>
</com.csot.fliplayout.lib.FlipLayout>

OR

Use to swap over several views

<com.csot.fliplayout.lib.FlipLayout
android:id="@+id/fliplayout4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:transition="TRANSLATE_Y">

	<TextView
	    android:layout_width="wrap_content"
	    android:layout_height="match_parent"
	    android:layout_gravity="center"
	    android:layout_margin="10dp"
	    android:background="#4286f4"
	    android:gravity="center"
	    android:padding="20dp"
	    android:text="FirstView"
	    android:textColor="#fff"
	    android:textSize="20dp"/>

	<TextView
	    android:layout_width="wrap_content"
	    android:layout_height="match_parent"
	    android:layout_gravity="center"
	    android:layout_margin="10dp"
	    android:background="#6016f4"
	    android:gravity="center"
	    android:padding="20dp"
	    android:text="SecondView"
	    android:textColor="#fff"
	    android:textSize="20dp"/>

	<TextView
	    android:layout_width="wrap_content"
	    android:layout_height="match_parent"
	    android:layout_gravity="center"
	    android:layout_margin="10dp"
	    android:background="#f18614"
	    android:gravity="center"
	    android:padding="50dp"
	    android:text="ThirdView"
	    android:textColor="#fff"
	    android:textSize="50dp"/>
</com.csot.fliplayout.lib.FlipLayout>

Customization

Attribute Type Description Default
startingChild int First visible child 0
transitionDuration int The ending angle for button disposition 200
transition enum The type of the transition, one of: FADE, FLIP_X, FLIP_Y, TRANSLATE_X, TRANSLATE_Y, FLIP_Z1, FLIP_Z2 FLIP_Y

fliplayout's People

Contributors

carlossotelo avatar cmfsotelo avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.