Coder Social home page Coder Social logo

yalantis / guillotinemenu-android Goto Github PK

View Code? Open in Web Editor NEW
2.7K 136.0 498.0 3.83 MB

Neat library, that provides a simple way to implement guillotine-styled animation

Home Page: https://yalantis.com/

Java 100.00%
android java animation menu transition

guillotinemenu-android's Introduction

Guillotine animation

Neat library, that provides a simple way to implement guillotine-styled animation

Yalantis

Android Arsenal

Android Gems

Check this [project on Dribbble] (https://dribbble.com/shots/2018249-Guillotine-Menu)

Also, read how it was done in [our blog] (https://yalantis.com/blog/how-we-developed-the-guillotine-menu-animation-for-android/?utm_source=github)

Guillotine animation gif

Usage

For a working implementation, have a look at the app module

  1. Add JitPack repository in your root build.gradle at the end of repositories:

    allprojects {
        repositories {
            ...
            maven { url "https://jitpack.io" }
        }
    }
    
    
  2. Add the dependency to your app build.gradle

    dependencies {
        compile 'com.github.Yalantis:GuillotineMenu-Android:1.2'
    }
    
  3. You need to create a layout for the navigation menu (guillotine.xml in sample app), which will later open and close guillotine-style. The only tricky part here is that the navigation layout should be on top of any other content and will disappear after closing animation ends. That is why content layout (activity.xml in sample app) should also have hamburger icon at the same coordinates as navigation menu has.

  4. After that all you need to do is to build animation by passing navigation layout object, navigation and content layout hamburger objects to GuillotineAnimation.GuillotineBuilder in your onCreate method

    new GuillotineAnimation.GuillotineBuilder(guillotineMenu, guillotineMenu.findViewById(R.id.guillotine_hamburger), contentHamburger)
                .setActionBarViewForAnimation(toolbar)
                .build();

Here setActionBarViewForAnimation method enables bounce effect of Toolbar at the end of the guillotine closing animation.

Misc

Builder allows you to customize start delay, duration, interpolation and you can set listener if you want to do staff at the moment when menu has been opened or closed.

Compatibility

  • Android 4.0.3 Ice Cream Sandwich (API level 15)

Changelog

Version: 1.0

  • Initial Build

Version: 1.2

  • Moved to using Toolbar instead of ActionBar
  • Updated Gradle versions
  • Fixed bugs

Let us know!

We’d be really happy if you sent us links to your projects where you use our component. Just send an email to [email protected] And do let us know if you have any questions or suggestion regarding the animation.

P.S. We’re going to publish more awesomeness wrapped in code and a tutorial on how to make UI for Android (iOS) better than better. Stay tuned!

License

Copyright 2017, Yalantis

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.

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.