Develop Reference

How to set height of ViewPager regardless of device screen height?

I have a tab layout in MainActivity which has ViewPager, I am also adding bottom navigation to MainActivity, I want ViewPager to be of height that it touches the top of the bottom navigation.
Here is my main activity 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:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<TextView
android:id="#+id/logo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10sp"
android:paddingTop="10sp"
android:textAlignment="center"
android:layout_gravity="center"
android:gravity="center"
android:textColor="#color/white"
android:textStyle="bold"
android:textSize="40sp"
android:text="#string/app_name" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_gravity="top"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<include layout="#layout/bottom_nav"></include>
</android.support.design.widget.CoordinatorLayout>
Currently ViewPager spans full height behind bottom navigation bar. I want my Viewpager to be like below

Use LinearLayout as a parent layout and also set weight to your ViewPager. It would work in your case. Check below code.
<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"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<TextView
android:id="#+id/logo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10sp"
android:paddingTop="10sp"
android:textAlignment="center"
android:layout_gravity="center"
android:gravity="center"
android:textColor="#color/white"
android:textStyle="bold"
android:textSize="40sp"
android:text="#string/app_name" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_gravity="top"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<include layout="#layout/bottom_nav"></include>
</LinearLayout>

Use Liner layout as a parent layout after co-ordinate 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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<TextView
android:id="#+id/logo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10sp"
android:paddingTop="10sp"
android:textAlignment="center"
android:layout_gravity="center"
android:gravity="center"
android:textColor="#color/white"
android:textStyle="bold"
android:textSize="40sp"
android:text="#string/app_name" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_gravity="top"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<include layout="#layout/bottom_nav"></include>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>

I am using Coordinator layout and Collapsing toolbar in my app and the toolbar is only half visible

this is my xml
<android.support.design.widget.CoordinatorLayout
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"
app:layout_scrollFlags="scroll|snap"
android:id="#+id/road_coordinator_id"
android:background="#color/primary_light"
android:fitsSystemWindows="true"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="300dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true"
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/main.collapsing"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
android:background="#color/primary_light"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
>
<android.support.v7.widget.Toolbar
android:id="#+id/maintoolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin"
/>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/viewpager_id"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
</android.support.v4.view.ViewPager>
</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"
android:layout_gravity="fill_vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/road"
android:layout_below="#+id/mainbackdrop"
tools:context=".Fragments.road">
<ImageView
android:layout_width="120dp"
android:layout_height="120dp"
android:src="#drawable/cameraicon"
android:id="#+id/camera_road"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Location"
android:id="#+id/location"
android:layout_below="#+id/camera_road"
android:textSize="20sp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/gps_icon"
android:layout_alignParentRight="true"
android:layout_below="#+id/camera_road"
android:id="#+id/road_gps_id"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/edit_loc_road"
android:layout_marginTop="45dp"
android:layout_below="#+id/camera_road"
android:layout_alignParentLeft="true"
android:hint="Location"
android:layout_alignParentStart="true" />
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/road_landmark"
android:textSize="20sp"
android:layout_below="#+id/edit_loc_road"
android:hint="Landmark"/>
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/road_desc"
android:textSize="20sp"
android:layout_below="#+id/road_landmark"
android:hint="Description"/>
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/user_road"
android:textSize="20dp"
android:layout_below="#+id/road_desc"
android:hint="Reporter"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Phone number"
android:textSize="20dp"
android:layout_below="#+id/user_road"
android:id="#+id/phone_road_id"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Submit"
android:layout_marginTop="57dp"
android:id="#+id/buttonroad"
android:background="#drawable/pressed"
android:layout_below="#+id/user_road"
android:layout_toStartOf="#+id/camera_road" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cancel"
android:id="#+id/btncancel"
android:layout_alignTop="#+id/buttonroad"
android:background="#drawable/pressed"
android:layout_toEndOf="#+id/camera_road" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
////////////////////////////////////////////////////////////////////
So inside the collapsing toolbar layout i have a toolbar and its stuck at the top.There should be a toolbar below which there is a view pager .
I am not able to figure out why. If its a silly mistake forgive me. I am new to android.
My Activity xml file
///////////////////////////////////////////////////////////
<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="65dp"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/frame_replace"
android:layout_below="#+id/toolbar">
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
///////////////////////////////////////////////////////////////
I am replacing the frame layout with fragment. The toolbar in my activity is getting replaced by the fragment toolbar once the fragment is back pressed. I hope this helps explain my problem more clearly.

android:fitsSystemWindows="true" add this line in your root view.

Viewpager overflows the screen inside coordinator layout

I'm trying to use the design support library to implement tabs. The issue is that the viewpager overlaps the toolbar and tablayout when i remove the attribute
app:layout_behavior="#string/appbar_scrolling_view_behavior"
of the viewpager.
viewpager overlaps the toolbar and tablayout
and when i add the attribute the viewpager overflows the screen.
viewpager overflows the screen
I just need the viewpager to occupy the space left after the tablayout and the toolbar and not overflow the screen...
Here is my activity_main.xml
<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
>
<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/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
and here is my fragment_1.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<TextView
android:id="#+id/tV_item1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_horizontal_margin"
android:gravity="center"
android:text="#string/tab1_q_persons"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="0 people"
android:textSize="30sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/iV_plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/iV_minus"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<Button
android:id="#+id/nextBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_gravity="end"
android:background="#color/colorPrimary"
android:elevation="12dp"
android:text="#string/next" />
</RelativeLayout>
</LinearLayout>
Any help will be appreciated

I know it seems late. But I send my answer.
In activity_main.xml use RelativeLayout instead of CoordinatorLayout and you can remove AppBar. For defining Toolbar as AppBar you can use this code in MainActivity.java:
Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
In fragment_1.xml use another widget like CardView or ScrollView instead of LinearLayout or you may use LinearLayout inside of replaced widget.
activity_main.xml
<RelativeLayout
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.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/ThemeOverlay.AppCompat.Light"
android:layout_alignParentTop="true"/>
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed"
android:layout_below="#id/toolbar"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_below="#id/tablayout" />
</RelativeLayout>
fragment_1.xml
<android.support.v7.widget.CardView
android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<TextView
android:id="#+id/tV_item1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_horizontal_margin"
android:gravity="center"
android:text="#string/tab1_q_persons"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="0 people"
android:textSize="30sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/iV_plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/iV_minus"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<Button
android:id="#+id/nextBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_gravity="end"
android:background="#color/colorPrimary"
android:elevation="12dp"
android:text="#string/next" />
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
This solution solved same problem for me.

If you don't really need the AppBar Layout, remove it.
<android.support.design.widget.CoordinatorLayout 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.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/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
This code works fine for me.

Toolbar scrolls down in CoordinatorLayout

I'm having a problem scrolling with the CoordinatorLayout, see gif
See amazing gif
I think the problem is using the translucentStatus with the toolbar padding-top, how can i fix it ?
I already tried using a custom ScrollingViewBehavior, but it didn't work :(
Thanks for the help, in advance
<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/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize"
android:paddingTop="24dp" />
<com.astuetz.PagerSlidingTabStrip
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/white"
app:pstsShouldExpand="true" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="fill_vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<im.tox.toktok.app.view.widgets.ScrimInsetsFrameLayout
android:layout_width="300dp"
android:layout_height="match_parent"
android:layout_gravity="left|start"
android:fitsSystemWindows="true"
app:insetForeground="#4000">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?android:attr/windowBackground">
<View
android:id="#+id/drawer_accent_color"
android:layout_width="match_parent"
android:layout_height="250dp"
android:elevation="2dp" />
<android.support.v7.widget.CardView
android:layout_width="250dp"
android:layout_height="250dp"
android:layout_alignBottom="#id/drawer_accent_color"
android:layout_centerHorizontal="true"
android:layout_marginBottom="-48dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/drawer_user_logo"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="center"
android:src="#color/light_grey" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="#dimen/spacing_normal"
android:text="André Almeida"
android:textColor="#color/dark_grey"
android:textSize="#dimen/font_larger" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="This is a sample message that crosses…"
android:textColor="#color/light_grey"
android:textSize="#dimen/font_small" />
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
</im.tox.toktok.app.view.widgets.ScrimInsetsFrameLayout></android.support.v4.widget.DrawerLayout>

You should add:
android:fitsSystemWindows="true"
to your CoordinatorLayout.

Coordinator Layout reset position when scrolling up or down

I have a CoordinatorLayout with an AppBarLayout and a CollapsingToolbarLayout. In CollapsingToolbarLayout I'm using a LinearLayout showing user info as a layout_collapseMode=parallax element, below of it, a TabLayout.
The behaviour that I expect is a smooth hiding of the user info while the TabLayout is scrolling up or down.
The problem is that the items positions are reset when I scroll down a bit, hiding entirely the user info layout.
```
<?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"
android:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/home_green_gradient"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:elevation="2dp">
<!-- user info -->
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll">
<RelativeLayout
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="244dp"
android:clipChildren="false"
android:clipToPadding="false"
android:orientation="horizontal"
app:layout_collapseMode="parallax">
<LinearLayout
android:id="#+id/profile_store_index_layout"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginRight="40dp"
android:layout_marginTop="44dp"
android:layout_toLeftOf="#+id/profile_imageview"
android:background="#drawable/home_small_circle_background"
android:gravity="center_vertical"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:src="#drawable/ic_store_white_18dp"
android:tint="#color/up_green"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:text="100%"
android:textColor="#color/white_color"
android:textStyle="bold"/>
</LinearLayout>
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_imageview"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="24dp"
android:src="#drawable/dummy_worker_office"
app:border_color="#color/dark_green"
app:border_width="6dp"/>
<TextView
android:id="#+id/profile_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_imageview"
android:gravity="center_horizontal"
android:text="Juan Rojas Torres"
android:textColor="#color/white_color"
android:textSize="18sp"/>
<TextView
android:id="#+id/profile_company_executions"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_name"
android:gravity="center_horizontal"
android:text="User name"
android:textColor="#color/dark_green_text"
android:textSize="12sp"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_company_executions"
android:src="#drawable/bottom_image"/>
</RelativeLayout>
<!-- Tabs at bottom -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="#+id/fragment_fragment_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/dark_green"
app:layout_collapseMode="pin"
app:tabGravity="fill"
app:tabIndicatorColor="#color/frogmi_indicator_color"
app:tabMaxWidth="0dp"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/frogmi_white_color"
app:tabTextColor="#color/frogmi_non_selected_green_text"/>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="#+id/fragment_fragment_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
```