• Stars
    star
    820
  • Rank 55,603 (Top 2 %)
  • Language
    Kotlin
  • License
    MIT License
  • Created almost 7 years ago
  • Updated over 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

:octocat: Navigation toolbar is a slide-modeled UI navigation controller made by @Ramotion

NAVIGATION TOOLBAR

Navigation toolbar is a Kotlin slide-modeled UI navigation controller.


We specialize in the designing and coding of custom UI for Mobile Apps and Websites.

Stay tuned for the latest updates:

Inspired by Aurรฉlien Salomon shot


Twitter Codacy Badge Donate

Requirements

  • Android 5.0 Lollipop (API lvl 21) or greater
  • Your favorite IDE

Installation

โ€‹ Just download the package from here and add it to your project classpath, or just use the maven repo:

Gradle:

implementation 'com.ramotion.navigationtoolbar:navigation-toolbar:0.1.3'

SBT:

libraryDependencies += "com.ramotion.navigationtoolbar" % "navitagiton-toolbar" % "0.1.3"

Maven:

<dependency>
  <groupId>com.ramotion.navigationtoolbar</groupId>
  <artifactId>navigation-toolbar</artifactId>
  <version>0.1.3</version>
  <type>aar</type>
</dependency>

Basic usage

NavigationToolBarLayout is the successor to CoordinatorLayout. Therefore, NavigationToolBarLayout must be the root element of your layout. Displayed content must be inside NavigationToolBarLayout, as shown below:

<com.ramotion.navigationtoolbar.NavigationToolBarLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include layout="@layout/content_layout"/>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_anchor="@id/com_ramotion_app_bar"
        app:layout_anchorGravity="bottom|end"
        app:srcCompat="@android:drawable/ic_dialog_email" />

</com.ramotion.navigationtoolbar.NavigationToolBarLayout>

Next, you must specify an adapter for NavigationToolBarLayout, from which NavigationToolBarLayout will receive the displayed View.

NavigationToolBarLayout contains android.support.v7.widget.Toolbar and android.support.design.widget.AppBarLayout, access to which can be obtained through the appropriate identifiers:

@id/com_ramotion_toolbar <!-- identifier of Toolbar -->
@id/com_ramotion_app_bar <!-- identifier of AppBarLayout -->

or through the appropriate properties of the NavigationToolBarLayout class:

val toolBar: Toolbar
val appBarLayout: AppBarLayout

Here are the attributes you can specify through XML or related setters:

  • headerOnScreenItemCount - The maximum number of simultaneously displayed cards (items) in vertical orientation.
  • headerCollapsingBySelectDuration - Collapsing animation duration of header (HeaderLayout), when you click on the card in vertical orientation.
  • headerTopBorderAtSystemBar - Align the top card on the systembar or not.
  • headerVerticalItemWidth - Specifies the width of the vertical card. It can be equal to match_parent, then the width of the card will be equal to the width of NavigationToolBarLayout.
  • headerVerticalGravity - Specifies the alignment of the vertical card. Can take the values: left, center, or right.

๐Ÿ—‚ Check this library on other language:

๐Ÿ“„ License

Navigation Toolbar Android is released under the MIT license. See LICENSE for details.

This library is a part of a selection of our best UI open-source projects

If you use the open-source library in your project, please make sure to credit and backlink to www.ramotion.com

๐Ÿ“ฑ Get the Showroom App for Android to give it a try

Try this UI component and more like this in our Android app. Contact us if interested.

More Repositories

1

animated-tab-bar

:octocat: RAMAnimatedTabBarController is a Swift UI module library for adding animation to iOS tabbar items and icons. iOS library made by @Ramotion
Swift
11,119
star
2

folding-cell

:octocat: ๐Ÿ“ƒ FoldingCell is an expanding content cell with animation made by @Ramotion
Swift
10,219
star
3

expanding-collection

:octocat: ExpandingCollection is an animated material design UI card peek/pop controller. iOS library made by @Ramotion
Swift
5,551
star
4

folding-cell-android

:octocat: ๐Ÿ“ƒ FoldingCell is a material design expanding content cell inspired by folding paper material made by @Ramotion
Java
4,902
star
5

swift-ui-animation-components-and-libraries

Swift UI libraries, iOS components and animations by @Ramotion
Swift
3,680
star
6

circle-menu

:octocat: โญ•๏ธ CircleMenu is a simple, elegant UI menu with a circular layout and material design animations. Swift UI library made by @Ramotion
Swift
3,437
star
7

paper-onboarding

:octocat: PaperOnboarding is a material design UI slider. Swift UI library by @Ramotion
Swift
3,320
star
8

paper-switch

:octocat: ๐ŸŽš RAMPaperSwitch is a Swift material design UI module which paints over the parent view when the switch is turned on. iOS library by @Ramotion
Swift
2,935
star
9

paper-onboarding-android

:octocat: PaperOnboarding is a material design slider made by @Ramotion
Java
2,559
star
10

reel-search

:octocat: ๐Ÿ” RAMReel is a UI controller that allows you to choose options from a list. Swift UI library made by @Ramotion
Swift
2,537
star
11

cardslider-android

:octocat: ๐Ÿƒ Cardslider is a material design UI controller that allows you to swipe through cards with pictures and accompanying descriptions.
Java
2,348
star
12

navigation-stack

:octocat: NavigationStack is a stack-modeled UI navigation controller. Swift UI library made by @Ramotion
Swift
2,308
star
13

preview-transition

:octocat: PreviewTransition is a simple preview gallery UI controller with animated tranisitions. Swift UI library made by @Ramotion
Swift
2,084
star
14

android-ui-animation-components-and-libraries

Android UI libraries, components and animations by @ramotion
Java
2,068
star
15

adaptive-tab-bar

:octocat: AdaptiveController is a 'Progressive Reduction' Swift UI module for adding custom states to Native or Custom iOS UI elements. Swift UI component by @Ramotion
Swift
2,033
star
16

expanding-collection-android

:octocat: ExpandingCollection is a material design card peek/pop controller. Android UI Library made by @Ramotion
Java
2,022
star
17

fluid-slider

:octocat:๐Ÿ’ง A slider widget with a popup bubble displaying the precise value selected. Swift UI library made by @Ramotion
Swift
1,970
star
18

circle-menu-android

:octocat: โญ•๏ธ CircleMenu is a simple, elegant UI menu with a circular layout and material design animations. Android UI library made by @Ramotion
Java
1,889
star
19

garland-view-android

:octocat: โ‰ก GarlandView seamlessly transitions between multiple lists of content. Made by @Ramotion
Java
1,838
star
20

aquarelle

:octocat: ๐ŸŽจ Aquarelle is a watercolor effect component. Javascript library by @Ramotion
JavaScript
1,801
star
21

gliding-collection

:octocat: Gliding Collection is a smooth, flowing, customizable decision for a UICollectionView Swift Controller. iOS library made by @Ramotion
Swift
1,530
star
22

fluid-slider-android

:octocat:๐Ÿ’ง A slider widget with a popup bubble displaying the precise value selected. Android library made by @Ramotion
Kotlin
1,424
star
23

cardslider

:octocat: ๐Ÿƒ Cardslider is a design UI controller that allows you to swipe through cards with pictures and accompanying descriptions.
Swift
1,271
star
24

elongation-preview

:octocat: ElongationPreview is an elegant UI push-pop style view controller. iOS library made by @Ramotion
Swift
898
star
25

navigation-toolbar

:octocat: Navigation toolbar is a slide-modeled UI navigation controller made by @Ramotion
Swift
595
star
26

react-native-circle-menu

:octocat: โญ•๏ธ CircleMenu is a simple, elegant UI menu with a circular layout and material design animations. Reactnative library made by @Ramotion
JavaScript
589
star
27

circular-carousel

List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.
Swift
582
star
28

direct-select-android

:octocat: โ‰ก DirectSelect is a selection widget with an ethereal, full-screen modal popup displaying the available choices when the widget is interact with.
Java
532
star
29

garland-view

:octocat: โ‰ก GarlandView seamlessly transitions between multiple lists of content. Swift UI library made by @Ramotion
Swift
501
star
30

showroom

Swift
167
star
31

vr-menu-demo

Prototype of a menu system in Virtual Reality. Javascript VR library made by @Ramotion
JavaScript
124
star
32

iOS-design-tips

Simple iOS design guidelines that will assist you in selecting the dimensions for your AppStore assets:
HTML
78
star
33

blob-menu

Swift
45
star
34

react-native-expanding-collection

JavaScript
37
star
35

showroom-android

Java
28
star
36

utopia

Swift
15
star
37

animations-web

JavaScript
9
star
38

react-native-fluid-slider

5
star
39

distorsion-blur

Swift
2
star