Fluent App Bar: An Android bottom-sheet-based navigation bar based on Microsoft's Fluent Design System
Fluent App Bar is an Android "bottom-sheet" enabling a whole new bottom navigation and menu experience
Add this XML snippet to your layout.
<com.vlstr.fluentappbar.FluentAppBar
android:id="@+id/fluent_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:fluent_background_colour="@color/colorPrimary"
app:fluent_foreground_colour="#FFFFFF"
app:fluent_app_bar_type="FULL_FLUENT"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
</com.vlstr.fluentappbar.FluentAppBar>
And integrate the FluentAppBar this way:
MainActivity.java
---
private void setupFluentAppBar() {
fluentAppBar = (FluentAppBar) findViewById(R.id.fluent_app_bar);
fluentAppBar.setNavigationMenu(R.menu.fluent_app_bar_main_menu, this);
fluentAppBar.setSecondaryMenu(R.menu.fluent_app_bar_secondary_menu, this);
fluentAppBar.setBlurRadius(10);
}
And to handle the navigation or secondary menu item click:
MainActivity.java
---
@Override
public void onClick(View v) {
int resId = (int) v.getTag();
switch (resId){
//Navigation Menu
case R.id.nav_all:
fluentAppBar.collapse();
break;
case R.id.nav_album:
break;
case R.id.nav_keywords:
break;
// Secondary Menu
case R.id.menu_sync:
fluentAppBar.collapse();
break;
case R.id.menu_assistant:
break;
case R.id.menu_shared:
break;
}
}
You will have to provide 2 XML Menu resource files for the navigation menu and the secondary menu.
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:icon="@drawable/ic_all"
android:id="@+id/nav_all"
android:title="All" />
<item
android:icon="@drawable/ic_album"
android:id="@+id/nav_album"
android:title="Albums" />
<item
android:icon="@drawable/ic_keywords"
android:id="@+id/nav_keywords"
android:title="Keywords" />
</menu>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:icon="@drawable/ic_sync"
android:id="@+id/menu_sync"
android:title="Show Sync Status" />
<item
android:icon="@drawable/ic_assistant"
android:id="@+id/menu_assistant"
android:title="Photo Assistant" />
<item
android:icon="@drawable/ic_shared"
android:id="@+id/menu_shared"
android:title="Shared Photos" />
</menu>
This Android library is currently supported by devices with API > 17.
Each of the following has got getter/setter methods. Also, the type, background colour and foreground colour can be directly set in the XML layout file.
Navigation Menu: provide the icons and title for the navigation menu
Secondary menu
Type: 3 types are available to you
Background colour: specify the FluentAppBar's background colour
Foreground colour: specify the text colour and icon tint
Ripple style: specify whether you want to use the custom "Fluent Ripple" or keep the default Android ripple
Background alpha: Set how strong the alpha should be when making the backgrond colour a transparent filter
Blur radius: Range [1-25] - The lower it is, the more you will see the FluentAppBar's background.
Additional customization These 3 customization options are done through overriding the "@dimen" resource name in your own dimens.xml file. Please name the dimensions like follows:
Additional methods
dependencies {
compile 'com.vlstr:fluentappbar:1.1.0'
}
For Maven:
<dependency>
<groupId>com.vlstr</groupId>
<artifactId>fluentappbar</artifactId>
<version>1.1.0</version>
<type>pom</type>
</dependency>
Feel free to contact me to have your project and name stated here
Creator: Valentin Lungenstrass http://www.vlstr.com/ | contact [at] vlstr [dot] com
Copyright 2019 Valentin Lungenstrass.
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.