Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/TangoAgency/material-intro-screen
Inspired by Heinrich Reimer Material Intro and developed with love from scratch
https://github.com/TangoAgency/material-intro-screen
android android-library material-design onboarding
Last synced: 3 months ago
JSON representation
Inspired by Heinrich Reimer Material Intro and developed with love from scratch
- Host: GitHub
- URL: https://github.com/TangoAgency/material-intro-screen
- Owner: TangoAgency
- License: mit
- Created: 2016-09-12T13:16:19.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2020-09-19T23:53:32.000Z (about 4 years ago)
- Last Synced: 2024-04-25T22:34:11.113Z (6 months ago)
- Topics: android, android-library, material-design, onboarding
- Language: Java
- Homepage:
- Size: 26.5 MB
- Stars: 2,717
- Watchers: 56
- Forks: 412
- Open Issues: 56
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-android - MaterialIntroScreen - Material Intro Screen implementation with easily extensible API. (Libraries / GUI)
- Android-Awesome-Resources - Material-intro-screen
- awesome-android - MaterialIntroScreen - Material Intro Screen implementation with easily extensible API. (Libraries / GUI)
- awesome-github-android-ui - material-intro-screen - MD风格的介绍页面 (引导图(Intro))
README
# Android Material Intro Screen
[ ![Download](https://api.bintray.com/packages/tangoagency/maven/material-intro-screen/images/download.svg) ](https://bintray.com/tangoagency/maven/material-intro-screen/_latestVersion)
[![Codacy Badge](https://api.codacy.com/project/badge/Grade/753f46972d8740d1984f8beb7d04fb9d)](https://www.codacy.com/app/TangoAgency/material-intro-screen?utm_source=github.com&utm_medium=referral&utm_content=TangoAgency/material-intro-screen&utm_campaign=badger)
[![Build Status](https://travis-ci.org/TangoAgency/material-intro-screen.svg?branch=master)](https://travis-ci.org/TangoAgency/material-intro-screen)
[![Android Arsenal Material Intro Screen](https://img.shields.io/badge/Android%20Arsenal-Material--Intro--Screen-green.svg?style=true)](http://android-arsenal.com/details/1/4368)Material intro screen is inspired by [Material Intro] and developed with love from scratch. I decided to rewrite completely almost all features in order to make Android intro screen easy to use for everyone and extensible as possible.
## Features
- [Easily add new slides][Intro Activity]
- [Custom slides][Custom Slide]
- [Parallax slides][Parallax Slide]
- Easy extensible api
- Android TV support!
- Material design at it's best!!!| [Simple slide][SimpleSlide] | [Custom slide][Custom Slide] | [Permission slide][PermissionSlide] | [Finish slide][FinishSlide]
|:-:|:-:|:-:|:-:|
| ![Simple slide] | ![Customslide] | ![Permission slide] | ![Finish slide] |## Usage
### Step 1:
#### Add gradle dependecy
```
dependencies {
compile 'agency.tango.android:material-intro-screen:{latest_release}'
}
```
### Step 2:
#### First, your [intro activity][Intro Activity] class needs to extend MaterialIntroActivity:
```java
public class IntroActivity extends MaterialIntroActivity
```
### Step 3:
#### Add activity to [manifest][Manifest] with defined theme:
```xml
```
### Step 4:
#### [Add slides:][Intro Activity]
```java
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
addSlide(new SlideFragmentBuilder()
.backgroundColor(R.color.colorPrimary)
.buttonsColor(R.color.colorAccent)
.possiblePermissions(new String[]{Manifest.permission.CALL_PHONE, Manifest.permission.READ_SMS})
.neededPermissions(new String[]{Manifest.permission.CAMERA, Manifest.permission.ACCESS_FINE_LOCATION, Manifest.permission.ACCESS_COARSE_LOCATION})
.image(agency.tango.materialintroscreen.R.drawable.ic_next)
.title("title 3")
.description("Description 3")
.build(),
new MessageButtonBehaviour(new View.OnClickListener() {
@Override
public void onClick(View v) {
showMessage("We provide solutions to make you love your work");
}
}, "Work with love"));
}
```
#### Explanation of SlideFragment usage:
- ```possiblePermissions``` ⇾ permissions which are not necessary to be granted
- ```neededPersmissions``` ⇾ permission which are needed to be granted to move further from that slide
- ```MessageButtonBehaviour``` ⇾ create a new instance only if you want to have a custom action or text on a message button### Step 5:
#### Customize Intro Activity:
- ```setSkipButtonVisible()``` ⇾ show skip button instead of back button on the left bottom of screen
- ```hideBackButton()``` ⇾ hides any button on the left bottom of screen
- ```enableLastSlideAlphaExitTransition()``` ⇾ set if the last slide should disapear with alpha hiding effect#### Customizing view animations:
You can set enter, default and exit translation for every view in intro activity. To achive this you need to get translation wrapper for chosen view (for example: ```getNextButtonTranslationWrapper()```) and set there new class which will implement ```IViewTranslation```
```java
getBackButtonTranslationWrapper()
.setEnterTranslation(new IViewTranslation() {
@Override
public void translate(View view, @FloatRange(from = 0, to = 1.0) float percentage) {
view.setAlpha(percentage);
}
});
```
#### Available [translation wrappers][TranslationWrapper]:
- ```getNextButtonTranslationWrapper()```
- ```getBackButtonTranslationWrapper()```
- ```getPageIndicatorTranslationWrapper()```
- ```getViewPagerTranslationWrapper()```
- ```getSkipButtonTranslationWrapper()```## Custom slides
#### Of course you are able to implement completely custom slides. You only need to extend SlideFragment and override following functions:
- ```backgroundColor()```
- ```buttonsColor()```
- ```canMoveFurther()``` (only if you want to stop user from being able to move further before he will do some action)
- ```cantMoveFurtherErrorMessage()``` (as above)
#### If you want to use parallax in a fragment please use one of the below views:
- [```ParallaxFrameLayout```][ParallaxFrame]
- [```ParallaxLinearLayout```][ParallaxLinear]
- [```ParallaxRelativeLayout```][ParallaxRelative]#### And set there the [app:layout_parallaxFactor][ParallaxFactor] attribute:
```xml
```All features which are not available in simple Slide Fragment are shown here: [Custom Slide]
## Things I have used to create this
- For parallax I have used files from [Material Intro] by [@HeinrichReimer]
- [InkPageIndicator.java] by [@NickButcher]
- Images used to create sample app are from [freepik]
- For over scroll effect on last slide I have partially used [Android-Overscroll-ViewPager]
## Getting HelpTo report a specific problem or feature request, [open a new issue on Github](https://github.com/TangoAgency/material-intro-screen/issues/new).
## Company
[![Facebook](https://github.com/TangoAgency/material-intro-screen/blob/master/images/facebook.png)](https://www.facebook.com/TangoDigitalAgency) [![Twitter](https://github.com/TangoAgency/material-intro-screen/blob/master/images/twitter.png)](https://twitter.com/Tango_Agency) [![LinkedIn](https://github.com/TangoAgency/material-intro-screen/blob/master/images/linkedin.png)](https://www.linkedin.com/company/tango-digital-agency)[Here](https://github.com/TangoAgency/) you can see open source work developed by Tango Agency.
Whether you're searching for a new partner or trusted team for creating your new great product we are always ready to start work with you.You can contact us via [email protected].
Thanks in advance.
[Custom Slide]:
[Material Intro]:
[@HeinrichReimer]:
[InkPageIndicator.java]:
[@NickButcher]:
[freepik]:
[Simple slide]:
[Customslide]:
[Permission slide]:
[Finish slide]:
[Intro Activity]:
[Parallax Slide]:
[PermissionSlide]:
[FinishSlide]:
[SimpleSlide]:
[ParallaxFrame]:
[ParallaxLinear]:
[ParallaxRelative]:
[ParallaxFactor]:
[Manifest]:
[TranslationWrapper]:
[Android-Overscroll-ViewPager]: