I started a project with a Navigation Drawer from the basic template of Android Studio. The only modification I made was to display it as permanent in order to have a tablet/TV layout.
To achieve this, the only modification I made was in the xml layout. This allow the NavigationView to be always visible.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="300dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Content will come here" />
</LinearLayout>
</LinearLayout>
I also put the project on Github, so anyone can test it.
PROJECT DEMO ON GITHUB
https://github.com/ChristopheVersieux/NavFocus
WHAT IS HAPPENING
My issue comes when I start selecting items on the drawer with the D-pad.
Once an item is selected, the focus is completely lost. Trying to get back to the Drawer and get focus seems very hard and I have to try several times with right/left arrows
WHAT IS EXPECTED:
Drawer should keep focus, or focus should be easy to bring back to the Drawer.
WHAT I TRIED:
The simplest Idea I had was to force the Drawer to get focus again, but this code doesn't change anything:
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(MenuItem menuItem) {
menuItem.setChecked(true);
//This is where I will replace the Fragments in the right area.
navigationView.clearFocus();
navigationView.requestFocus();
return true;
}
});
Thank a lot for your help.
I would start by removing android:layout_gravity="start"
This is simply not needed as its parent is a horizontal LinearLayout.
The Navigation Drawer must be permanently visible on Tablets and TV. They stay hidden for mobile. These are part of the Material Design guidelines.
This requires quite a different setup compared to what I see in your project on GitHub. Which includes supplying different resources using qualifiers.
This tutorial on Navigation Drawer (Design Support) will help you with exactly that setup, as per the latest Material Design guidelines. Alternatively the project files for the tutorial can be found on GitHub.
UPDATE:
As pointed out, Support library v24 creates issues with the dpad. Reverting to v23 works just fine.
This post says:
When you add a FloatingActionButton as a child of your
CoordinatorLayout and then pass that CoordinatorLayout to your
Snackbar.make() call - instead of the snackbar displaying over the
floating action button, the FloatingActionButton ... automatically
move upward as the snackbar animates in and returns to its position
when the snackbar animates out
I've made exactly as described there but FAB does not move upward. (Snackbar can be swiped out, it means that CoordinatorLayout knows about it.)
Upd
Layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/action_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.ActionBar"/>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/action_toolbar"/>
</RelativeLayout>
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginTop="?attr/actionBarSize"
android:background="#color/theme_primary_darker_color"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"/>
</android.support.v4.widget.DrawerLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/toolbar_action_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_navigation_white_24dp"
android:layout_margin="16dp"
android:visibility="gone"
app:borderWidth="0dp"
app:elevation="6dp"
app:layout_anchor="#id/action_toolbar"
app:layout_anchorGravity="bottom|right|end"
app:pressedTranslationZ="12dp"/>
</android.support.design.widget.CoordinatorLayout>
Code:
mCoordinatorLayout = (CoordinatorLayout) findViewById(R.id.main_content);
...
Snackbar.make(mCoordinatorLayout, R.string.waypoint_deleted, Snackbar.LENGTH_LONG).show();
I've written sample project based on the code you posted and I had to change three things to make FloatingActionButton aware of the Snackbar.
Set 'minifyEnabled' property of my build to false - looks like Proguard strips out some annotations (e.g. Behaviours) which are necessary to coordinate FloatingActionButton. You'll need to add some Proguard rules in your release build where Proguard is enabled.
Pass the FloatingActionButton as a first argument of Snackbar.make(), not the CoordinatorLayout itself as mentioned here.
Remove app:layout_anchor="#id/action_toolbar" and replace app:layout_anchorGravity="bottom|right|end" with the app:layout_gravity="bottom|right|end" from the layout (not sure if it's suitable for you).
If it doesn't work for you, you can try to write your own Behavior class as described in the article mentioned above.
I had a similar problem where my fab button wouldn't move down. Took me a while but it was because I had animations off in the developers option. Hope you got it working even though I know this post is a bit dated.
I was having the issue where the fab would not return to its original location after the snackbar disappeared. Make sure Animator duration scale is turned on. A good default is 1x.
The setting can be found in:
Settings app --> Developer Options
Dev Settings app (on emulators)
This setting along with other animation settings were turned off on one of my emulators. Turning it back on got the fab working correctly.
As the title says, I want to know if there is any way to control views inside the NavigationView header? (Except for adding or removing header.)
For example: In the header, I have a user avatar. By default, it displays a guest image, but after the user logs in, the real avatar will be showed.
How can this be accomplished?
After updating your support library to version 23.1.1 or above,
You could do this -
View header = navigationView.getHeaderView(0);
TextView text = (TextView) header.findViewById(R.id.textView);
or if you have multiple headers
navigationView.getHeaderCount()
Ref : https://code.google.com/p/android/issues/detail?id=190226#c31
Since i can not accept a comment as an answer. So, i repost Moinkhan' answer here:
first create header XML like lay_header.xml
<TextView
android:id="#+id/tvThought"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
on your java file inflate this above header in a TextView. like
TextView headerView = (TextView) LayoutInflater.from(this).inflate(R.layout.lay_header, null);
headerView.setText("Your_thoght");
Now add it as a HeaderView
navView = (NavigationView) findViewById(R.id.navView);
navView.addHeaderView(headerView);
Thats it...
You can also check it out at: Customising NavigationView - Adding dynamic headerView, Android Support Design Library
Many thanks!
And again, we need a function that allow user to accept a comment as answer!
The other way to make this is using the method "inflateHeaderView()" of NavigationView object, like below (After using "setContentView()"):
View headerLayout = navigationView.inflateHeaderView(R.layout.yours_nav_header_layout);
After this point you can use "headerLayout" to access custom views in your header layout, like below:
View cutomView = (TextView) headerLayout.findViewById(R.id.lay_sign_in);
In my case i'm using ButterKnife framework to inject View "navigationView" like this:
#Bind(R.id.nav_view) NavigationView navigationView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
}
Simply try find your view in your activity:
tvUserName = (TextView) findViewById(R.id.tv_username);
It works for me. My header layout is:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="192dp"
android:background="?attr/colorPrimaryDark"
android:padding="16dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:orientation="vertical"
android:gravity="bottom">
<TextView
android:id="#+id/tv_username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"/>
</LinearLayout>
My NavigationView in Activity Layout is:
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/drawer_header"
app:menu="#menu/menu_drawer"/>
And BTW, I came across problem when inflating LinearLayout, where layout params are not provided:
TextView headerView = (TextView) LayoutInflater.from(this).inflate(R.layout.lay_header, null);
headerView.setText("Your_thoght");
Hope it helps.
I'm updating an app to use the new Toolbar instead of the regular ActionBar.
In my app the user must be able to select a contact from their contact list. To do so, I've added a SearchView to the menu.
The contacts are already in the list; the SearchView is used to filter the list using the ArrayAdapter.getFilter() method.
It all worked fine using the ActionBar, but the Toolbar's height gets stretched to just behind the keyboard. Using the XML inspection from Android Device Monitor I can see the ListView exists behind my keyboard.
It almost seems as if the SearchView wants to display suggestions, but I have no such thing configured. Any idea what's going wrong?
The images illustrate the problem. They show the normal, expanded and focused state of the SearchView.
This is my XML menu:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/action_forwarding_contact_search"
app:showAsAction="always"
android:title="#string/forwarding_contact_search"
app:actionViewClass="android.support.v7.widget.SearchView"
android:icon="#drawable/abc_ic_search_api_mtrl_alpha"/>
</menu>
Edit
Giving the Toolbar a fixed height doesn't solve the problem, because it will make SearchView disappear when it has focus. Changing the gravity of either item seems to have no effect on the SearchView.
I had the same problem than OP, I tried the android:fitsSystemWindows="true" solution, but it was half resolved: the searchview didn't expand anymore but the notification bar (top of screen) became totally white (like the layout background) instead of red (my app theme).
I found an alternative way and it's working like a charm, so for those who are stuck, try this:
In your manifest, just add this line in your activity section:
android:windowSoftInputMode="adjustPan"
Example:
<activity
android:name=".MainActivity"
android:windowSoftInputMode="adjustPan"
android:label="My main activity" >
</activity>
Ok, I figured it out. There was no problem with the SearchView, because the same happened with ordinary EditTexts which were placed normally inside a layout xml. The Toolbar wasn't the problem either.
I created an empty activity and played around with anything I changed in my app and finally came to my theme. On KitKat and later I had <item name="android:windowTranslucentStatus">true</item> set on the theme, so the navigation drawer would appear behind the status bar.
Disabling/removing this would resolve the issue. This reminded me of the android:fitsSystemWindows="true" property. It is set on the Toolbar, but not in the layout xml of the main activity that contains the DrawerLayout.
I guess the DrawerLayout sets itself to fit the system windows.
E.g. there's no fitSystemWindows property here:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".DashboardActivity">
The activity where the problem occurred did not have a NavigationDrawer, it was a new activity. Setting android:fitsSystemWindows="true" on the root node of the layout of the activity made things work fine.
So, for anyone to read this: if you have <item name="android:windowTranslucentStatus">true</item> in your theme, make sure any root node containing a toolbar contains a android:fitsSystemWindows="true".
Working sample:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<include layout="#layout/toolbar" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button" />
</LinearLayout>
</LinearLayout>
I had same issue like this but did't help above answers but after lots of search found something.
may help you too.!!
after add this attribute in toolbar
android:layout_height="?attr/actionBarSize"
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
style="#style/ToolBarStyle"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/myPrimaryColor"
android:minHeight="#dimen/abc_action_bar_default_height_material" >
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:textColor="#color/myTextPrimaryColor"
android:layout_gravity="center" />
</android.support.v7.widget.Toolbar>
The accepted answer works fine, however I needed an alternative that would allow to view the Toolbar under translucent status bar.
The problem is that Toolbar uses paddings to cover for system components. As a result, the paddingBottom of the Toolbar is being set to soft keyboard's height whenever the keyboard appears. Solution was to reset the padding before calling super.onMeasure in my custom Toolbar class:
public class MyToolbar extends Toolbar {
(...)
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setPadding(getPaddingLeft(), getPaddingTop(), getPaddingRight(), 0);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
It seems like a old question but I want to address the real cause about this issue.
In fact, the fitsSystemWindows does not only add statusBar insets into your views padding, but also keyboard's height. So, when keyboard showed, your toolbar(which is the view who consumes window insets) will gain a bottom padding equals to your keyboard's height.
Move fitSystemWindows to root node do solve this problem, but sometimes we can't do that, for example we need toolbar's background to fill the statusbar.
So, the real solution for this issue, I think, is to tell view only consume top insets. Luckily, Android do offer a method for us to do that.
private static final View.OnApplyWindowInsetsListener CONSUME_TOP_INSET_LISTENER = new View.OnApplyWindowInsetsListener() {
#RequiresApi(api = Build.VERSION_CODES.KITKAT_WATCH)
#Override
public WindowInsets onApplyWindowInsets(View v, WindowInsets insets) {
int b = v.getPaddingBottom();
int l = v.getPaddingLeft();
int r = v.getPaddingRight();
v.setPadding(l, insets.getSystemWindowInsetTop(), r, b);
int il = insets.getSystemWindowInsetLeft();
int ir = insets.getSystemWindowInsetRight();
int ib = insets.getSystemWindowInsetBottom();
return insets.replaceSystemWindowInsets(il, 0, ir, ib);
}
};
public static void makeViewConsumeTopWindowInsetsOnly(#NonNull View view) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT_WATCH) {
view.setOnApplyWindowInsetsListener(CONSUME_TOP_INSET_LISTENER);
}
}
Add above code to some place, and call this method with the view you want to consumes top insets.
I ran into a similar issue and setting showAsAction="always|collapseActionView" inside the Search Menu Item (menu.xml) solved the stretching of the toolbar for me.
I had the same issue with a SearchView on a Toolbar with a TextView and Spinner in it. Closing the SearchView (either by pressing the Toolbar back button or by switching to a different tab in the ViewPager) caused the Toolbar to stretch out to just below the top of the keyboard.
I solved it by placing an extra layout around the views in my Toolbar.
Before:
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</android.support.v7.widget.Toolbar>
After
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.v7.widget.Toolbar>
simplest solution without changing xml and keeping translucent system bar is to add:
kotlin:
toolbar.setOnApplyWindowInsetsListener { toolbar, windowInsets ->
toolbar.updatePadding(
windowInsets.systemWindowInsetLeft,
windowInsets.systemWindowInsetTop,
windowInsets.systemWindowInsetRight,
0
)
windowInsets.consumeSystemWindowInsets()
}
please check if your fitsSystemWindows=true are placed correctly.
I would like to share my experience but before that I want to dropped this comment. So far, I really find this CoordinatorLayout shenanigans buggy and not worthy of being dropped in the SDK. Its just buggy. When it behaves like this erratically, the architecture on the xml layout is not much of a help to figure out whats going on. I followed the examples religiously and none of them worked.
Having said that, I am using the build tools version v24.0.2 (The latest as of this writing) and my situation may be of different than the rest. So I am putting this answer along with other answers here.
In my case, I am using this library for NavigationDrawer
As some answers here pointed out, its the navigation drawer. I tried not using that library and still having the problem. I have CoordinatorLayout as the parent layout of my two activities and programatically inserts the NavigationDrawer as instructed by the library author. The expanding Toolbar the size of the screen when focusing on an EditText is still there. Therefore, in my case, the problem is not coming from there.
Here's what I did in my case:
I removedfitsSystemWindows from the CoordinatorLayout layout of the activity. Contrary to what other people suggested here.
I am pasting my entire activity layout here:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/coordinatorlayout_homescreen"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.HomeScreenActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingtoolbarlayout_homescreen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="64dp"
app:expandedTitleMarginEnd="48dp"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_homescreen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:id="#+id/framelayout_homescreen"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
<!--
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab_homescreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
-->
</android.support.design.widget.CoordinatorLayout>
I did this on another activity and it works as expected. I don't have the expanding Toolbar anymore. But this problem occurred. I am about to pull my hair out. The status bar became white. Phoenix Wang solution on that post fix it for me and I quote his answer:
I found the answer in this link:Status Bar Color not changing with
Relative Layout as root element
So it turns out we need remove the
<item name="android:statusBarColor">#android:color/transparent</item> in
styles.xml(v21). And it works just fine for me.
My only concern is how will this solution holds in the upcoming updates. CoordinatorLayout should not be behaving like that.
In case you are using an EditText inside Toolbar, adding "flagNoExtractUi" in imeOptions , will solve the stretching edit area.
EditText for Search Action without stretching:
android:id="#+id/toolbar_editText"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:inputType="text"
android:imeOptions="actionSearch|flagNoExtractUi"
android:singleLine="true" />
Basically I have a drawer with a button in it. When I click on the button I want to hide a view (another button) that is loaded in the FrameLayout.
Below I include the XML code for the drawer. The button is not included there because it is generated dynamically within the code.
I tried getting the frameLayout and invalidating the view, but it does not seem to work. I think it is somehow related to the fact that it is loaded in a Fragment.
Any clue is more than welcome! Thanks!
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/myDrawer"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<FrameLayout
android:id="#+id/home_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<include
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="#layout/home_layout" />
</FrameLayout>
</android.support.v4.widget.DrawerLayout>
Alright, got it working. I thought there was some hidden magic related to the fact of using FrameLayout, but not. The method is completely the same. Find the solution below:
View view;
if ((view = findViewById(R.id.bottomSet)) != null) {
view.setVisibility(View.VISIBLE);
view.invalidate();
}
Note that "bottomSet" is defined within the FrameLayout that is being imported.