Develop Reference

How to stop action bar move up

I'm using Android Studio 2.2.3, created new Tabs project, add few fragment for each tab. And then added icon for tabs. Everything look ok.
But,
When i scroll, specifically the Action Bar move up and down. It looks ugly to me. Please look at the screenshot (the title and padding area, which I did't add):
ugly screen when actionbar move up
My questions are:
How can I do to stop ActionBar move up and down like that? I want to
handle it later (maybe hidden and unhidden it when user scroll the
view like Contact App of Android 5.1).
If I can't stop the movement,
what can I do (with XML file) to get rid of the padding Area?
I'm just starting to learn android, so please forgive me if these questions not good enough.
And here's my main activity layout file (It's original as Android Studio created it):
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="#dimen/fab_margin"
app:srcCompat="#android:drawable/ic_dialog_email" />
Thanks.

Add android:fitsSystemWindows="true" in your root layout i.e. modify it like below:
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<!-- rest of your layout here -->
</android.support.design.widget.AppBarLayout>
More on android:fitsSystemWindows from Android docs:
internal attribute to adjust view layout based on system windows such
as the status bar. If true, adjusts the padding of this view to leave
space for the system windows. Will only take effect if this view is in
a non-embedded activity.
Must be a boolean value, either "true" or "false".
This may also be a reference to a resource (in the form
"#[package:]type:name") or theme attribute (in the form
"?[package:][type:]name") containing a value of this type.
This corresponds to the global attribute resource symbol
fitsSystemWindows.
For the scrolling issue, remove the following line from your fragment layout -
app:layout_behavior="#string/appbar_scrolling_view_behavior"
And from your main activity's layout, remove the following line from under toolbar tag -
app:layout_scrollFlags="scroll|enterAlways"

SearchView shifting AppBar permanently upwards?

I am adding a SearchView to the current view at Runtime, like so:
View searchpage = inflater.inflate(R.layout.search_ui, (ViewGroup) view.getParent(), false);
SearchView searchbar = (SearchView) searchpage.findViewById(R.id.searchbar);
//ViewGroup of current layout
parent.addView(searchbar);
This code is executed when a button is pressed.
This code works, however if the SearchView is entered and exited, the animation that shifts the AppBar upwards works however upon exiting the AppBar is not reset. The SearchView is not embedded in the AppBar, and I am not attempting to do this. I would like the SearchView to be below the AppBar as it is.
The AppBar is defined in a separate xml file. I am switching between multiple views using a ViewPager.
Here are some screenshots:
Before SearchView is Tapped
After SearchView is Tapped/Entered and Exited
The SearchBar is defined in xml like so:
<android.support.v7.widget.SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/searchbar"
android:layout_below="#+id/view"
android:iconifiedByDefault="false"
android:queryHint="Search"
android:layout_centerHorizontal="true">
</android.support.v7.widget.SearchView>
The AppBar is defined like so:
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
Any help would be appreciated, I am at a loss as to why the AppBar won't slide back down automatically.
EDIT: I was concurrently having issues with a set of buttons not appearing at the bottom of the screen. I figured out that they were being drawn underneath the nav bar. I believe that when the SearchView was being entered, the toolbar was being pushed upwards to accommodate for the set of buttons at the absolute bottom of the screen. I added padding to the layout and I believe that was the solution to the issue.
Thanks,
-n.parker

Try something like this;
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorWhite"
android:orientation="vertical"
tools:context="Your-Activity-name-like-com.xyz.MainActivity">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<android.support.v7.widget.SearchView
android:id="#+id/action_search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:clickable="true"
android:title="#string/action_search">
</android.support.v7.widget.SearchView>
And inside the "layout" folder, create a toolbar.xml that looks like this;
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"/>
Now you can reuse this toolbar in other activities too, id needed.

How to customize toolbar in Navigation Drawer activity?

After creating a Navigation Drawer activity in my Android Studio project I want to add a search view into the toolbar instead of my app name. How do I do it? Can the toolbar be customized based on my needs or creation of custom toolbar is required?

If you have selected Navigation Drawer activity while creating new project Android studio would have by default created the file app_bar_main.xml file
You should be able to find the below code given by default
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
Replace the above code with below code to get search view within toolbar
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay">
<SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content" /></android.support.v7.widget.Toolbar>

CollapsingToolbarLayout disable background on collapse

I updated my dependencies to v24 but now my CollapsingToolbarLayout is broken. I used it to show an image(using setBackground) when the user didn't scroll yet, after that it would turn blue. Now it keeps showing the image and there's a white bar under it that covers my content, yet I haven't changed anything in my code. Here's an image(changed to red the background on purpose): http://imgur.com/a/lwl1Y.
See the toolbar has an image on it instead of being a solid color?also you can see the title gets cut off by a red-colored bar under the toolbar. Here are the layouts(which are simply edited layouts from the android studio template):
<android.support.design.widget.AppBarLayout
android:id="#+id/viewarticle_appbarlayout"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/article_collapsingtoolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_view_article" />
</android.support.design.widget.CoordinatorLayout>
content_view_article.xml
</android.support.v4.widget.NestedScrollView>
Edit: I was using v 24.0.3 of the support libraries, I updated everything to 24.2.1 and the invisible bar is gone. The background problem remains though

Android Support Library 23.2 - Navigation Drawer and/or Toolbar

When I use the new Android Support Library 23.2 (specifically com.android.support:design:23.2.0), the toolbar used in the Android Studio implementation of Navigation Drawer pushes down the icons and title. Take a look:
With 'com.android.support:design:23.1.1'
With 'com.android.support:design:23.2.0'
My Navigation Drawer implementation is just the one generated by Android Studio, no custom changes.
Any clue how can I fix this?
Thanks in advance!
Update
Toolbar resource file (XML):
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="net.sqoops.sqoops.activity.TimelineActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:fitsSystemWindows="true"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_timeline"/>
</android.support.design.widget.CoordinatorLayout>

Removing android:fitsSystemWindows="true" from the Toolbar tag should help.
That’s what the default behavior of the android:fitsSystemWindows=“true” attribute gives you: it sets the padding of the View to ensure the contents don’t overlay the system windows.
The quote above is from one of Android Development Patterns blogpost.
Added comment as answer as requested.