Develop Reference

transparent status bar breaks scrollview

I'm following this solution to create transparent status bar
The problem is now i have a ScrollView which is not working if i opened the keyboard.
If i remove this line it works fine but i loose the transparent status bar feature.
w.setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
Any idea why this is happening and how to solve it ?
This my layout xml
<?xml version="1.0" encoding="utf-8"?>
<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="wrap_content"
android:orientation="vertical"
android:fitsSystemWindows="true"
tools:context="com.paytabs.merchant.paytabsmerchant.Activities.RegisterOneActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:title="Create Your Account"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/r1toolbar"
android:layout_width="match_parent"
android:paddingTop="10dp"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
/>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_register_one" />
</LinearLayout>
And this is what is inside content_register (Minimal Code, my controls inside this linear layout)
<ScrollView
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"
android:isScrollContainer="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<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:orientation="vertical"
android:paddingBottom="50dp"
android:paddingTop="10dp"
android:paddingRight="20dp"
android:paddingLeft="20dp"
tools:context="com.paytabs.merchant.paytabsmerchant.Activities.RegisterOneActivity"
tools:showIn="#layout/activity_register_one">
</LinearLayout>
</ScrollView>

Fragment is not scrolling inside viewpager

I am using ViewPager to show 4 different fragments.
The component tree of my activity:
|_FrameLayout
|_ LinearLayout (Vertical)
Toolbar
ViewPager
TabLayout
RelativeLayout
And this is the component tree of my first fragment:
ScrollView
|_LinearLayout(Vertical)
LinearLayout(Horizontal)
|_LinearLayout(Horizontal)
|_CardView
TextView
LinearLayout(Horizontal)
LinearLayout(Horizontal)
But the Fragment inside the Viewpager is not scrolling when the device is in portrait mode. When in landscape mode, it scrolls a bit (so the scroll is working) but views inside the cardview are shrinked. Is CardView is responsible for all this (As it is scroll-able)? How to fix this ? Please help.

You should replace your ScrollView with a NestedScrollView that helps you with nested scrolling

Wrap both the viewpager.xml and fragment.xml in the scroll view like below:
viewpager.xml
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/view_pager_id"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</RelativeLayout>
</ScrollView>
fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<!-- Along with other widgets -->
</android.support.constraint.ConstraintLayout>
</ScrollView>
activity.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"
tools:context=".MyActivity">
<RelativeLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Top App Bar -->
<RelativeLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp">
<!-- Top Action Bar -->
<include layout="#layout/action_bar" />
<!-- Top Tabs -->
<include layout="#layout/top_tabs" />
</android.support.design.widget.AppBarLayout>
</RelativeLayout>
<!-- Middle Section (Body) -->
<RelativeLayout
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/layout2">
<include layout="#layout/viewpager" />
</RelativeLayout>
<!-- Bottom Navigation View -->
<include layout="#layout/bottom_navigation_view" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>

How to get Toolbar to overlay sibling layout (z-ordering)

For the life of me, I cannot get this Toolbar to layout on top (note: not above, but on top of) its sibling LinearLayout. The only way I can get the Toolbar to overlay its sibling is by specifying the Toolbar's elevation to be > 0, but this doesn't work for pre-5.0.
I am using a parent FrameLayout, and the child Toolbar is located after its sibling LinearLayout in the XML. What am I missing? Even the Android Studio preview pane shows the Toolbar on top of the LinearLayout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<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:id="#+id/fragment_main_container"
tools:context=".MainActivity"
tools:ignore="MergeRootFrame"
android:orientation="vertical"
>
<FrameLayout
android:layout_weight="4"
android:layout_width="match_parent"
android:layout_height="0dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher"
/>
</FrameLayout>
<ListView
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
android:id="#+id/home_list_listview"
android:drawSelectorOnTop="true"
android:divider="#null"
android:dividerHeight="0dp"
tools:listitem="#layout/home_list_item"
>
</ListView>
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/slogan"
android:gravity="center"
android:textColor="#color/colorPrimaryDark"
/>
</LinearLayout>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="#android:color/transparent"
/>
</FrameLayout>

Turns out I had a fragment committing the linear layout over the main activity, which already contained it. Oops!

That's because of FrameLayout.
If you want to use FrameLayout, the views will not relate each other.
So all you need to do is ...
set "height of toolbar" to MarginTop of LinearLayout.
Hope, it will help.

How to display DrawerLayout above HeaderLayout

my mainActivity is containing DrawerLayout to display sliding menu + ViewPager for tabs navigation. I've hided the actionbar and i replace it with a big linearLayout to implement the actionbar/tabs alternatif and also a layout containing button between them.
My xml file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/light_gray_2">
<LinearLayout android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="60dp"
android:background="#color/blue_buzzvibe"
android:orientation="horizontal" >
Here title and menu button (ActionBar alternatif)
</LinearLayout>
<LinearLayout
android:id="#+id/options_buttons_campaign"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal" >
Here 4 layout for buttons
</LinearLayout>
<LinearLayout
android:id="#+id/tabs_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal" >
Here 2 layout for tabs
</LinearLayout>
</LinearLayout>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
>
<FrameLayout
android:id="#+id/fragment_container_main_msg"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"/>
<!-- Listview to display slider menu -->
<ExpandableListView
android:id="#+id/list_slidermenu"
android:layout_width="300dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:dividerHeight="0dp"
android:divider="#null"
android:background="#color/menu_list_background"
/>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
With this xml lyaout my drawer is display bellow the big layout. and i want to display drawer in all the screen height.
Here a screenShot of what i have http://i.imgur.com/4Oz9P7e.png?1
and here a screenshot of what i want http://i.imgur.com/v65p7gM.png?1

Embed ViewPageIndicator inside Viewpager

I have this layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="fill_parent"
android:layout_height="155dp" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/titles"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#id/android:list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
and this code to attach the indicator in the ViewPager
CirclePageIndicator circleIndicator = (CirclePageIndicator)view.findViewById(R.id.titles);
circleIndicator.setViewPager(viewPager);
The code is working properly but is not doing exactly what i want.
The indicator is displayed at the bottom of my viewPager (below the 3 images i'm using)
is it possible to move the indicator inside the images?? So the result should be an image with the indicator "embeded".

You could try this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF" >
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="155dp" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/titles"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/view_pager" />
<ListView
android:id="#id/android:list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/view_pager"
android:layout_alignParentBottom="true" />
</RelativeLayout>
Explanation: The ViewPager will automatically be aligned top-left within the RelativeLayout. The ListView is is anchored between the bottom of the ViewPager and the bottom of the RelativeLayout (the layout_width="0dp" is intentional). The CirclePagerIndicator has its bottom aligned with the bottom of the ViewPager.