Create an header for com.google.android.material.navigation.NavigationView

Overview

Header View

Download Android Arsenal

Logo

This is a view for NavigationView in android.support.design library

Import

At the moment the library is in my personal maven repo

repositories {
    maven {
        url 'http://dl.bintray.com/raphaelbussa/maven'
    }
}
dependencies {
    implementation 'rebus:header-view:3.0.2'
}

How to use

Via XML

Create a layout named like this header_drawer.xml

<rebus.header.view.HeaderView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/header_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:hv_add_icon="@drawable/ic_action_settings"
    app:hv_add_status_bar_height="true"
    app:hv_background_color="@color/colorPrimaryDark"
    app:hv_dialog_title="@string/account"
    app:hv_highlight_color="@color/colorAccent"
    app:hv_profile_avatar="@drawable/ic_placeholder"
    app:hv_profile_background="@drawable/ic_placeholder_bg"
    app:hv_profile_email="[email protected]"
    app:hv_profile_username="Bruce Wayne"
    app:hv_show_add_button="true"
    app:hv_show_arrow="true"
    app:hv_show_gradient="true"
    app:hv_style="normal"
    app:hv_theme="light" />

And in your NavigationView

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:headerLayout="@layout/header_drawer"
    app:menu="@menu/drawer" />

Manage Profiles

The new HeaderView manage different profile and a new profile chooser inspired from YouTube android app

  • Create a profile
Profile profile = new Profile.Builder()
        .setId(2)
        .setUsername("Raphaël Bussa")
        .setEmail("[email protected]")
        .setAvatar("https://github.com/rebus007.png?size=512")
        .setBackground("https://images.unsplash.com/photo-1473220464492-452fb02e6221?dpr=2&auto=format&fit=crop&w=767&h=512&q=80&cs=tinysrgb&crop=")
        .build();
  • Add a profile
headerView.addProfile(profile);
  • Set a profile active
headerView.setProfileActive(2);
  • Remove a profile
headerView.removeProfile(2);
  • Get actual active profile
int activeProfileId = headerView.getProfileActive();

Customize Profile Chooser

You can also customize the profile chooser

  • Add bottom items
Item item = new Item.Builder()
        .setId(1)
        .setTitle("Remove all profile")
        .build();

headerView.addDialogItem(item);
  • HighlightColor in dialog
headerView.setHighlightColor(ContextCompat.getColor(this, R.color.colorAccent));
app:hv_highlight_color="@color/colorAccent"
  • Change dialog title
headerView.setDialogTitle("Choose account");
app:hv_dialog_title="Dialog title"
  • Change dialog top icon
headerView.setAddIconDrawable(R.drawable.ic_action_settings);
app:hv_add_icon="@drawable/ic_action_settings"
  • Or hide dialog top icon
headerView.setShowAddButton(true);
app:hv_show_add_button="true"
  • Dismiss profile chooser dialog
headerView.dismissProfileChooser();

Callback

headerView.setCallback(new HeaderCallback() {

    @Override
    public boolean onSelect(int id, boolean isActive) {
        //return profile id selected and if is the active profile
        return true; //true for close the dialog, false for do nothing
    }

    @Override
    public boolean onItem(int id) {
        //return witch buttom item is selected
        return true; //true for close the dialog, false for do nothing
    }

    @Override
    public boolean onAdd() {
        return true; //true for close the dialog, false for do nothing
    }
});

Loading image from network

Just add this in your class Application (of course you can use your preferred libs for load images)

ImageLoader.init(new ImageLoader.ImageLoaderInterface() {
    @Override
    public void loadImage(Uri url, ImageView imageView, @ImageLoader.Type int type) {
        switch (type) {
            case ImageLoader.AVATAR:
                Glide.with(imageView.getContext())
                        .load(url)
                        .asBitmap()
                        .placeholder(R.drawable.ic_placeholder)
                        .error(R.drawable.ic_placeholder)
                        .into(imageView);
                break;
             case ImageLoader.HEADER:
                Glide.with(imageView.getContext())
                        .load(url)
                        .asBitmap()
                        .placeholder(R.drawable.ic_placeholder_bg)
                        .error(R.drawable.ic_placeholder_bg)
                        .into(imageView);
                break;
        }
    }

});

Use custom font with Calligraphy

You can set a custom font with Calligraphy just add a CustomViewTypeface with HeaderView.class in CalligraphyConfig

CalligraphyConfig.initDefault(new CalligraphyConfig.Builder()
        .setDefaultFontPath("Oswald-Stencbab.ttf")
        .setFontAttrId(R.attr.fontPath)
        .addCustomViewWithSetTypeface(HeaderView.class)
        .build()
);

Screen

Screen

Sample

Browse the sample code here or download sample app from the Play Store

Javadoc

Browse Javadoc here

App using Header View

If you use this lib contact me and I will add it to the list below:

Developed By

Raphaël Bussa - [email protected]

Twitter Linkedin

License

The MIT License (MIT)

Copyright (c) 2017 Raphaël Bussa <[email protected]>

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
Comments
  • Add license scan report and status

    Add license scan report and status

    Your FOSSA integration was successful! Attached in this PR is a badge and license report to track scan status in your README.

    Below are docs for integrating FOSSA license checks into your CI:

    opened by fossabot 1
  • fix onRestoreInstance sparseArray null

    fix onRestoreInstance sparseArray null

    Chrash log:

    Caused by java.lang.NullPointerException: Attempt to invoke virtual method 'int android.util.SparseArray.size()' on a null object reference at rebus.header.view.HeaderView.populateAvatar + 395(HeaderView.java:395) at rebus.header.view.HeaderView.onRestoreInstanceState + 795(HeaderView.java:795) at android.view.View.dispatchRestoreInstanceState + 17819(View.java:17819) at android.view.ViewGroup.dispatchRestoreInstanceState + 3773(ViewGroup.java:3773) at android.view.ViewGroup.dispatchRestoreInstanceState + 3781(ViewGroup.java:3781) at android.view.View.restoreHierarchyState + 17797(View.java:17797) at com.google.android.material.internal.NavigationMenuPresenter.onRestoreInstanceState + 192(NavigationMenuPresenter.java:192) at androidx.appcompat.view.menu.MenuBuilder.dispatchRestoreInstanceState + 363(MenuBuilder.java:363) at androidx.appcompat.view.menu.MenuBuilder.restorePresenterStates + 375(MenuBuilder.java:375) at com.google.android.material.navigation.NavigationView.onRestoreInstanceState + 216(NavigationView.java:216) at android.view.View.dispatchRestoreInstanceState + 17819(View.java:17819) at android.view.ViewGroup.dispatchRestoreInstanceState + 3773(ViewGroup.java:3773) at android.view.ViewGroup.dispatchRestoreInstanceState + 3781(ViewGroup.java:3781) at android.view.ViewGroup.dispatchRestoreInstanceState + 3781(ViewGroup.java:3781) at android.view.ViewGroup.dispatchRestoreInstanceState + 3781(ViewGroup.java:3781) at android.view.ViewGroup.dispatchRestoreInstanceState + 3781(ViewGroup.java:3781) at android.view.View.restoreHierarchyState + 17797(View.java:17797) at com.android.internal.policy.PhoneWindow.restoreHierarchyState + 2255(PhoneWindow.java:2255) at android.app.Activity.onRestoreInstanceState + 1198(Activity.java:1198) at android.app.Activity.performRestoreInstanceState + 1152(Activity.java:1152) at android.app.Instrumentation.callActivityOnRestoreInstanceState + 1264(Instrumentation.java:1264) at android.app.ActivityThread.performLaunchActivity + 3270(ActivityThread.java:3270) at android.app.ActivityThread.handleLaunchActivity + 3405(ActivityThread.java:3405) at android.app.ActivityThread.-wrap12() at android.app.ActivityThread$H.handleMessage + 1994(ActivityThread.java:1994) at android.os.Handler.dispatchMessage + 108(Handler.java:108) at android.os.Looper.loop + 166(Looper.java:166) at android.app.ActivityThread.main + 7523(ActivityThread.java:7523) at java.lang.reflect.Method.invoke(Method.java) at com.android.internal.os.Zygote$MethodAndArgsCaller.run + 245(Zygote.java:245) at com.android.internal.os.ZygoteInit.main + 921(ZygoteInit.java:921)

    opened by RurioLuca 0
  • Add a Gitter chat badge to README.md

    Add a Gitter chat badge to README.md

    rebus007/HeaderView now has a Chat Room on Gitter

    @rebus007 has just created a chat room. You can visit it here: https://gitter.im/rebus007/HeaderView.

    This pull-request adds this badge to your README.md:

    Gitter

    If my aim is a little off, please let me know.

    Happy chatting.

    PS: Click here if you would prefer not to receive automatic pull-requests from Gitter in future.

    opened by gitter-badger 0
  • When the Activity is recycled HeaderView will get an error

    When the Activity is recycled HeaderView will get an error

    @raphaelbussa When the Activity is recycled HeaderView will get an error.

        java.lang.ClassCastException: java.lang.String cannot be cast to android.net.Uri
            at rebus.header.view.Profile.<init>(Profile.java:82)
            at rebus.header.view.Profile.<init>(Profile.java:46)
            at rebus.header.view.Profile$1.createFromParcel(Profile.java:51)
            at rebus.header.view.Profile$1.createFromParcel(Profile.java:48)
            at android.os.Parcel.readParcelable(Parcel.java:2774)
            at android.os.Parcel.readValue(Parcel.java:2668)
            at android.os.Parcel.readSparseArrayInternal(Parcel.java:3118)
            at android.os.Parcel.readSparseArray(Parcel.java:2351)
            at android.os.Parcel.readValue(Parcel.java:2725)
            at android.os.Parcel.readArrayMapInternal(Parcel.java:3037)
            at android.os.BaseBundle.initializeFromParcelLocked(BaseBundle.java:288)
            at android.os.BaseBundle.unparcel(BaseBundle.java:232)
            at android.os.Bundle.getParcelable(Bundle.java:940)
            at rebus.header.view.HeaderView.onRestoreInstanceState(HeaderView.java:793)
            at android.view.View.dispatchRestoreInstanceState(View.java:18608)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3821)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3827)
            at android.view.View.restoreHierarchyState(View.java:18586)
            at com.google.android.material.internal.NavigationMenuPresenter.onRestoreInstanceState(NavigationMenuPresenter.java:192)
            at androidx.appcompat.view.menu.MenuBuilder.dispatchRestoreInstanceState(MenuBuilder.java:363)
            at androidx.appcompat.view.menu.MenuBuilder.restorePresenterStates(MenuBuilder.java:375)
            at com.google.android.material.navigation.NavigationView.onRestoreInstanceState(NavigationView.java:216)
            at android.view.View.dispatchRestoreInstanceState(View.java:18608)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3821)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3827)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3827)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3827)
            at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3827)
            at android.view.View.restoreHierarchyState(View.java:18586)
            at com.android.internal.policy.PhoneWindow.restoreHierarchyState(PhoneWindow.java:2135)
            at android.app.Activity.onRestoreInstanceState(Activity.java:1135)
            at android.app.Activity.performRestoreInstanceState(Activity.java:1090)
            at android.app.Instrumentation.callActivityOnRestoreInstanceState(Instrumentation.java:1317)
            at android.app.ActivityThread.handleStartActivity(ActivityThread.java:2991)
            at android.app.servertransaction.TransactionExecutor.performLifecycleSequence(TransactionExecutor.java:180)
            at android.app.servertransaction.TransactionExecutor.cycleToPath(TransactionExecutor.java:165)
            at android.app.servertransaction.TransactionExecutor.executeLifecycleState(TransactionExecutor.java:142)
            at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:70)
            at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1816)
            at android.os.Handler.dispatchMessage(Handler.java:106)
            at android.os.Looper.loop(Looper.java:193)
            at android.app.ActivityThread.main(ActivityThread.java:6718)
            at java.lang.reflect.Method.invoke(Native Method)
            at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:493)
            at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:858)
    

    Turn this option on under the developer option to test. image

    opened by tcqq 1
  • Conflict with circleimageview dependency

    Conflict with circleimageview dependency

    @raphaelbussa

    Duplicate class de.hdodenhof.circleimageview.CircleImageView found in modules classes.jar (de.hdodenhof:circleimageview:3.0.1) and classes.jar (rebus:header-view:3.0.3)
    Duplicate class de.hdodenhof.circleimageview.CircleImageView$1 found in modules classes.jar (de.hdodenhof:circleimageview:3.0.1) and classes.jar (rebus:header-view:3.0.3)
    Duplicate class de.hdodenhof.circleimageview.CircleImageView$OutlineProvider found in modules classes.jar (de.hdodenhof:circleimageview:3.0.1) and classes.jar (rebus:header-view:3.0.3)
    
    
    opened by tcqq 0
Releases(3.0.0)
Owner
Raphaël Bussa
Senior Android Developer. Open source lover. European citizen.
Raphaël Bussa
This library provides a simple way to add a draggable sliding up panel (popularized by Google Music and Google Maps) to your Android application. Brought to you by Umano.

Note: we are not actively responding to issues right now. If you find a bug, please submit a PR. Android Sliding Up Panel This library provides a simp

Umano: News Read To You 9.4k Dec 31, 2022
(Deprecated) A custom view component that mimics the new Material Design Bottom Navigation pattern.

BottomBar (Deprecated) I don't have time to maintain this anymore. I basically wrote the whole library in a rush, without tests, while being a serious

Iiro Krankka 8.4k Dec 29, 2022
[Deprecated] Android Library that implements Snackbars (former known as Undobar) from Google's Material Design documentation.

UndoBar This lib is deprecated in favor of Google's Design Support Library which includes a Snackbar and is no longer being developed. Thanks for all

Kai Liao 577 Nov 25, 2022
SystemUiController - Android Ui color controller (status bar, navigation bar)

SystemUiController Android system ui color controller (status bar, navigation bar) Download implementation "land.sungbin:systemuicontroller:${version}

Ji Sungbin 8 Dec 3, 2022
Android library used to create an awesome Android UI based on a draggable element similar to the last YouTube graphic component.

Draggable Panel DEPRECATED. This project is not maintained anymore. Draggable Panel is an Android library created to build a draggable user interface

Pedro Vicente Gómez Sánchez 3k Dec 6, 2022
Simple and lightweight UI library for user new experience, combining floating bottom navigation and bottom sheet behaviour. Simple and beautiful.

Simple and lightweight UI library for user new experience, combining floating bottom navigation and bottom sheet behaviour. Simple and beautiful.

Rizki Maulana 118 Dec 14, 2022
A Tinder-like Android library to create the swipe cards effect. You can swipe left or right to like or dislike the content.

Swipecards Travis master: A Tinder-like cards effect as of August 2014. You can swipe left or right to like or dislike the content. The library create

Dionysis Lorentzos 2.3k Dec 9, 2022
StandOut lets you easily create floating windows in your Android app.

Coming Soon Meanwhile, checkout the demo video at http://www.youtube.com/watch?v=S3vHjxonOeg Join the conversation at http://forum.xda-developers.com/

Mark Wei 1.2k Dec 12, 2022
Easily create complex recyclerview adapters in android

?? Due to the nature of my job and growing popularity of Jetpack Compose, I lack the motivation to keep this project alive. Recyclerview is one of the

Riyaz Ahamed 823 Jan 6, 2023
💳 CreditCardView is an Android library that allows developers to create the UI which replicates an actual Credit Card.

CreditCard View CreditCardView is an Android library that allows developers to create the UI which replicates an actual Credit Card. Displaying and en

Vinay Gaba 769 Dec 14, 2022
Android library to create chat message view easily

ChatMessageView ChatMessageView helps you to create chat message view quickly like a typical chatting application. Its a container view, so you can ad

Himanshu Soni 641 Dec 24, 2022
Android view that allows the user to create drawings. Customize settings like color, width or tools. Undo or redo actions. Zoom into DrawView and add a background.

DrawView Android view that allows the user to create drawings. Draw anything you like in your Android device from simple view. Customize draw settings

Oscar Gilberto Medina Cruz 839 Dec 28, 2022
This is a sample Android Studio project that shows the necessary code to create a note list widget, And it's an implementation of a lesson on the Pluralsight platform, but with some code improvements

NoteKeeper-Custom-Widgets This is a sample Android Studio project that shows the necessary code to create a note list widget, And it's an implementati

Ibrahim Mushtaha 3 Oct 29, 2022
Code Guide: How to create Snapchat-like image stickers and text stickers.

MotionViews-Android Code Guide : How to create Snapchat-like image stickers and text stickers After spending 2000+ hours and releasing 4+ successful a

Uptech 474 Dec 9, 2022
The CustomCalendarView provides an easy and customizable calendar to create a Calendar. It dispaly the days of a month in a grid layout and allows to navigate between months

Custom-Calendar-View To use the CustomCalendarView in your application, you first need to add the library to your application. You can do this by eith

Nilanchala Panigrahy 113 Nov 29, 2022
💳 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
A set of widgets to create smooth slideshows with ease.

Android SlideShow Widget A set of widgets to create smooth slide shows with ease. The slide show components are fully customizable and are not limited

MarvinLabs 211 Nov 20, 2022
NeoPOP was created with one simple goal; to create the next generation of a beautiful, affirmative design system

NeoPop is CRED's inbuilt library for using NeoPop components in your app

CRED 254 Dec 29, 2022
Android library implementing a poppy view on scroll, similar to the one found in the Google Plus app

PoppyView PoppyView is a library which implements view on the bottom which come and go relative to the user scroll. It can be seen in the Google plus

Flavien Laurent 409 Nov 23, 2022