Navigation pattern like in Google News Stand app with transitions

Related tags

Animations android library google ui animation swipe transition newsstand navigation-pattern
Overview

Google-NewsStand-Animation-Android

Navigation pattern like in Google News Stand app with transitions

Android Arsenal

Screenshots

Getting Started

In your build.gradle

dependencies {
    implementation 'hari.allagi:allagi:0.1.1'
    //or in lower versions:
    //compile 'hari.allagi:allagi:0.1.1'
}

Usage

Choose one of the NoActionBar themes to use in MenuListActivity and override it to define your app color palette.

<style name="AppTheme.MenuListActivity.NoActionBar" parent="Theme.AppCompat.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent" >@color/colorAccent</item>
</style>

Define the colors for ScrollableMenuActivity too.

<style name="AppTheme.ScrollableMenuActivity.NoActionBar" parent="Theme.AppCompat.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

Declare the Allagi activities in AndroidManifest.xml file using your new app themes.

<activity
    android:name="hari.allagi.MenuListActivity"
    android:theme="@style/AppTheme.MenuListActivity.NoActionBar" />
<activity
    android:name="hari.allagi.ScrollableMenuActivity"
    android:theme="@style/AppTheme.ScrollableMenuActivity.NoActionBar" />

Set largeHeap to true in AndroidManifest.xml.

<application
  ...
  android:largeHeap="true"/>

Open Allagi from a activity like so:

ArrayList<String> menuList = new ArrayList<>();     //menu titles
ArrayList<Integer> imagesList = new ArrayList<>();      //menu backgrounds
ArrayList<Fragment> fragmentsList = new ArrayList<>();      //fragments for each menu headers in second activity

menuList.add("UPCOMING");       //add titles
menuList.add("EVENTS");         //limit to 8 items for the animation to work
...

imagesList.add(R.drawable.upcoming);        //add background images
imagesList.add(R.drawable.events);
...

fragmentsList.add(UpcomingFragment.newInstance());      //add fragment instances
fragmentsList.add(EventsFragment.newInstance());
...

Allagi allagi = Allagi.initialize(MainActivity.this, menuList, imagesList, fragmentsList);
allagi.start();         //start the menu list activity

Change the duration of the animation:

allagi.setTransitionDuration(900);      //default value is 1000 milliseconds

Libraries used in the project

Credits

Inspired by and thanks to Aurélien Salomon's Google Newsstand Navigation Pattern

Show your support

Give a ⭐ if this project helped you!

License

Copyright ©️ 2018 Hariprasanth S

This project is licensed under the Apache License, Version 2.0
You may also obtain a copy of the License at

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

You might also like...
Fast marker clustering library for Google Maps Android API.
Fast marker clustering library for Google Maps Android API.

Google Maps Clustering for Android A fast marker clustering library for Google Maps Android API. Motivation Why not use Google Maps Android API Utilit

Sharewire 294 Dec 5, 2022
You can easily access the top of the screen in Android. Like a iPhone 6 & 6 Plus.
You can easily access the top of the screen in Android. Like a iPhone 6 & 6 Plus.

Reachability on Android Easy access on top. Like a iPhone 6 & 6 Plus. demo apk Usage Add dependencies compile 'com.github.sakebook:Reachability:0.2.0@

sakebook 258 Nov 12, 2022
A lightweight indicator like in nexus 5 launcher
A lightweight indicator like in nexus 5 launcher

CircleIndicator A lightweight indicator like in nexus 5 launcher Gradle AndroidX dependencies { implementation 'me.relex:circleindicator:2.1.6' }

relex 4.1k Dec 30, 2022
A Photo Editor library with simple, easy support for image editing using paints,text,filters,emoji and Sticker like stories.
A Photo Editor library with simple, easy support for image editing using paints,text,filters,emoji and Sticker like stories.

PhotoEditor A Photo Editor library with simple, easy support for image editing using Paints, Text, Filters, Emoji and Sticker like stories. Features D

Burhanuddin Rashid 3.6k Jan 9, 2023
💳 A quick and easy flip view through which you can create views with two sides like credit cards, poker cards etc.
💳 A quick and easy flip view through which you can create views with two sides like credit cards, poker cards etc.

The article on how this library was created is now published. You can read it on this link here. →. 💳 EasyFlipView Built with ❤︎ by Wajahat Karim and

Wajahat Karim 1.3k Dec 14, 2022
Android library to display a few images in one ImageView like avatar of group chat. Made by Stfalcon
Android library to display a few images in one ImageView like avatar of group chat. Made by Stfalcon

MultiImageView Library for display a few images in one MultiImageView like avatar of group chat Who we are Need iOS and Android apps, MVP development

Stfalcon LLC 468 Dec 9, 2022
Android Library To Create Button With Multi Reactions like Facebook or Linkedin
Android Library To Create Button With Multi Reactions like Facebook or Linkedin

ReactButton Android Library written in Java to Create ReactButton with Multi Reactions like Facebook or Linkedin 😎 Default Reactions 😄 Custom Reacti

Amr Hesham 103 Dec 15, 2022
A lightweight android library that allows to you create custom fast forward/rewind animations like on Netflix.
A lightweight android library that allows to you create custom fast forward/rewind animations like on Netflix.

SuperForwardView About A lightweight android library that allows to you create custom fast forward/rewind animations like on Netflix. GIF Design Credi

Ertugrul 77 Dec 9, 2022
FadeOutParticle is an animation for disappearing views like TextViews
FadeOutParticle is an animation for disappearing views like TextViews

FadeOutParticle is an animation for disappearing views like TextViews

Hooman Mohammadi 50 Dec 28, 2022
Owner
Hariprasanth S
Hariprasanth S
GitHub
Set of extra Transitions on top of Jetpack Transitions Library

Transitions Everywhere Set of extra Transitions on top of AndroidX Transitions Library. About Article about transitions and library Originally this li

Andrey Kulikov 4.8k Apr 27, 2021
A backport of the new Transitions API for Android

TransitionsBackport Android library for using the Transitions API released with Android KitKat on older versions of Android. At the moment, it is comp

Stéphane Guérin 578 Dec 29, 2022
An android project presenting some transitions you can use between activities

ActivityTransition An android project presenting some transitions you can use between activities #Integration Add the anim folder to your Android proj

null 260 Nov 29, 2022
🍭🚀💗 Tutorials about animations with Animators, Animated Vector Drawables, Shared Transitions, and more

?????? Tutorials about animations with Animators, Animated Vector Drawables, Shared Transitions, and more

Smart Tool Factory 696 Dec 28, 2022
RX-based async paradigm, Room, DI (Hilt), Retrofit, MVVM, Jetpack, Lottie, Transitions

CatBreedsApp RxJava, Room, DI (Hilt), Jetpack, Shared element transition. clean MVVM architecture, Retrofit Cats need your help, we want to build an a

Cristian Dumitrache 3 Oct 14, 2022
A Simple Todo app design in Flutter to keep track of your task on daily basis. Its build on BLoC Pattern. You can add a project, labels, and due-date to your task also you can sort your task on the basis of project, label, and dates

WhatTodo Life can feel overwhelming. But it doesn’t have to. A Simple To-do app design in flutter to keep track of your task on daily basis. You can a

Burhanuddin Rashid 1k Jan 1, 2023
With MVVM Architecture pattern using Android Architecture Components This is a sample app demonstrating Youtube player animation using constraint layout

Youtube UI/UX Animation This is a sample app demonstrating Youtube UX/UI animation using ConstraintLayout.It implements the Keyframe Animation feature

Burhanuddin Rashid 866 Dec 29, 2022
EtsyBlur is an Android library that allows developers to easily add a glass-like blur effect implemented in the Etsy app.

EtsyBlur EtsyBlur is an Android library that allows developers to easily add a glass-like blur effect implemented in the past Etsy app. Try out the sa

Manabu S. 755 Dec 29, 2022
Customizable bounce animation for any view like in Clash Royale app

Bounceview-Android Customizable bounce animation for any view updation Getting Started In your build.gradle dependencies { implementation 'hari.bo

Hariprasanth S 149 Nov 18, 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

Mark Wang 769 Jan 7, 2023