☯️Sophisticated and cool intro with Material Motion Animations(No more viewpager transformer or Memory leak)

Ranbir Singh

Last update: Sep 8, 2022

Related tags

Animations android kotlin animation material-ui android-library intro androidpoet materialanimations materialintro

Overview

Material Intro

Sophisticated and cool intro with Material Motion Animations.

Who's using Material Intro?

👉 Check out who's using Material Intro

Include in your project

Gradle

Add the dependency below to your module's build.gradle file:

dependencies {
    implementation("io.github.androidpoet:materialintro:1.0.6")
}

SetUp for Views

<com.androidpoet.materialintro.MaterialIntroView
android:id="@+id/materialintroView"
android:layout_width="match_parent"
android:layout_height="match_parent">
</com.androidpoet.materialintro.MaterialIntroView>

//add views into list
  list.add(R.layout.layout_one)
  list.add(R.layout.layout_two)
  list.add(R.layout.layout_three)


binding.materialIntroFragment.apply {
    setFragmentsList(list)
    enterAnimation = IntroAnimation.SharedAxisXForward
    reenterAnimation = IntroAnimation.SharedAxisXBackward
    enterDuration = 500
    exitDuration = 500
}


//  go next view with animation
binding.nextButton.setOnClickListener {
    binding.materialIntroFragment.next()
}

//  go previous view with animation
binding.backButton.setOnClickListener {
    binding.materialIntroFragment.previous()
}

SetUp for Fragments

<com.androidpoet.materialintro.MaterialIntroFragment
android:id="@+id/materialintroView"
android:layout_width="match_parent"
android:layout_height="match_parent">
</com.androidpoet.materialintro.MaterialIntroFragment>

//add fragments into list
list.add(FragmentOne())
list.add(FragmentTwo())
list.add(FragmentThree())
with(binding.materialintroView) {
    setViewsList(list)
    nextAnimation = IntroAnimation.Fade
    previousAnimation = IntroAnimation.Fade
    nextDuration = 500
    previousDuration = 500
}


//  go next view with animation
binding.nextButton.setOnClickListener {
    binding.materialintroView.next()
}

//  go previous view with animation
binding.backButton.setOnClickListener {
    binding.materialintroView.previous()
}

Supported Animations

IntroAnimation.None
IntroAnimation.FadeThrough
IntroAnimation.Fade
IntroAnimation.SharedAxisXForward
IntroAnimation.SharedAxisYForward
IntroAnimation.SharedAxisZForward
IntroAnimation.SharedAxisXBackward
IntroAnimation.SharedAxisYBackward
IntroAnimation.SharedAxisZBackward
IntroAnimation.ElevationScaleGrow
IntroAnimation.ElevationScale

Create using Builder

This is how to create an instance of the MaterialIntro using kotlin dsl.

val meta = materialIntroFragment(this) {
setEnterAnimation(IntroAnimation.Fade)
setExitAnimation(IntroAnimation.Fade)
setReenterAnimation(IntroAnimation.SharedAxisXBackward)
setReturnAnimation(IntroAnimation.SharedAxisXForward)
setEnterDuration(300)
setExitDuration(300)
setReturnDuration(300)
setReenterDuration(300)
setEnterOverlap(true)
setEnterOverlap(true)
build()
}
meta.next()
meta.previous()
meta.setFragmentsList(list)

We can create the MaterialIntro using MaterialIntro.Builder.

val meta = MaterialIntroFragment.Builder(this)
.setEnterAnimation(IntroAnimation.Fade)
.setExitAnimation(IntroAnimation.Fade)
.setReenterAnimation(IntroAnimation.SharedAxisXBackward)
.setReturnAnimation(IntroAnimation.SharedAxisXForward)
.setEnterDuration(300)
.setExitDuration(300)
.setReturnDuration(300)
.setReenterDuration(300)
.setEnterOverlap(true)
.setEnterOverlap(true)
.build()

meta.next()
meta.previous()
meta.setFragmentsList(list)

MaterialFade

Fade

SharedAxis

Card icons created by Freepik - Flaticon

Find this library useful? ❤️

Support it by joining stargazers for this repository. ⭐

License

Copyright 2022 AndroidPoet (Ranbir Singh)

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

You might also like...

A motion-driven animation framework for Android.

Backboard A motion-driven animation framework for Android. backboard is a framework on top of rebound that makes it easier to use by coupling it to vi

1.7k Dec 30, 2022

Memory efficient shimmering effect for Android applications by Supercharge.

DEPRECATED - ShimmerLayout Attention: This tool is now deprecated. Please switch to Shimmer for Android or any other shimmer effect solution. ShimmerL

2.5k Jan 4, 2023

Add Animatable Material Components in Android Jetpack Compose. Create jetpack compose animations painless.

AnimatableCompose Add Animatable Material Components in Android Jetpack Compose. Create jetpack compose animation painless. What you can create from M

12 Jan 2, 2023

It's a cool animation which can use in splash or somewhere else.

What's Particle ? It's a cool animation which can use in splash or anywhere else. Demo Article 手摸手教你用Canvas实现简单粒子动画 Attributes name format description

1.4k Dec 12, 2022

Material Design text field that comes in a box, based on (OLD) Google Material Design guidelines.

TextFieldBoxes A new Material Design text field that comes in a box, based on Google Material Design guidelines. 🇨🇳 中文看这里 UPDATE NOTICE 1.4.5 Releas

769 Jan 7, 2023

Render After Effects animations natively on Android and iOS, Web, and React Native

Lottie for Android, iOS, React Native, Web, and Windows Lottie is a mobile library for Android and iOS that parses Adobe After Effects animations expo