In my application im using CoordinatorLayout,AppBarLayout and CollapsingToolbarLayout because i want my app to have top menu bar pinned and header which hides on scroll. I have recyclerview where my items are listed, and items are made in CardView.
Problem is that when i add toolbar as CollapsingToolbarLayouts child at bottom of screen,under recyclerview, on my phone whitespace appears. Also whitespaces dimensions are same like toolbars. When i remove toolbar whitespace also disappears.
here is my main xml code:
<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:background="#color/GrayColour"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_collapseMode="parallax">
<include
android:id="#+id/Header"
layout="#layout/header_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="53dp"/>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="pin"
android:contentInsetLeft="0dp"
android:contentInsetStart="0dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
android:contentInsetRight="0dp"
android:contentInsetEnd="0dp"
app:contentInsetRight="0dp"
app:contentInsetEnd="0dp">
<include
android:id="#+id/TopBar"
layout="#layout/top_navigation_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/Categories"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
tools:listitem="#layout/list_item"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_constraintBottom_toBottomOf="parent"
/>
</android.support.design.widget.CoordinatorLayout>
and here is my xml code for items with who recyclerview is filled:
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/white_background_rounded_corners"
android:layout_margin="5dp">
<LinearLayout
android:layout_width="156dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/white_background"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/ivCategory"
android:layout_width="156dp"
android:layout_height="100dp"
android:layout_marginTop="8dp"
android:background="#null"
android:clickable="true"
android:contentDescription="#string/category"
android:focusable="true"
android:scaleType="fitCenter"
android:src="#mipmap/android_icon" />
<TextView
android:id="#+id/tvCategoryName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="#string/text"
android:textColor="#color/mainColour"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView
Related
How to make curve corner for collapsing toolbar while scrolling
What I am Expecting is
What I am Getting is
Note the image is scrollable and inside collapsing toolbar
Code is given below
<androidx.constraintlayout.widget.ConstraintLayout 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:padding="16dp">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/parent_coordinate_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:outlineProvider="background">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="#android:color/transparent"
app:elevation="0dp"
android:outlineProvider="background"
android:clipToPadding="false"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
android:fitsSystemWindows="true"
app:contentScrim="#android:color/transparent"
app:collapsedTitleGravity="center"
app:title="Image"
app:collapsedTitleTextAppearance="#style/CollapseCollapsedStyle"
app:expandedTitleTextAppearance="#style/CollapseExpandedStyle"
android:clipToPadding="false"
android:outlineProvider="background">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/material_tool_bar"
android:layout_width="match_parent"
android:layout_height="60dp"
app:layout_collapseMode="pin"
app:layout_collapseParallaxMultiplier="0.75"
app:contentInsetLeft="0dp"
android:contentInsetLeft="0dp"
app:contentInsetStartWithNavigation="0dp"
app:contentInsetStart="0dp"
android:contentInsetStart="0dp">
</com.google.android.material.appbar.MaterialToolbar>
<ImageView
android:id="#+id/coffee_img"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:src="#drawable/coffee"
app:layout_collapseMode="pin"
android:scaleType="centerCrop"/>
<TextView
android:layout_margin="12dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Image"
android:textSize="24sp"
android:layout_gravity="bottom"
android:paddingHorizontal="10dp"
android:paddingVertical="5dp"
android:gravity="center"
app:layout_collapseMode="parallax"
android:background="#drawable/light_grey_curved_bg"/>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="60dp"
android:padding="12dp">
<include
android:layout_width="40dp"
android:layout_height="40dp"
layout="#layout/common_circular_back_button"
android:layout_centerVertical="true"/>
<include
android:layout_width="40dp"
android:layout_height="40dp"
layout="#layout/like_button_with_loader"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"/>
</RelativeLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/dummy_text"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/dummy_text"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/dummy_text"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/dummy_text"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Everything working fine the curved corner of imageview reflect but while scrolling to the the to the curved corner apply only for the bottom corner. Top corner of the image gets rectangle shape
Is it possible to curve the corner of the collapsing toolbar android?
Layout structure.
<android.support.v4.widget.DrawerLayout .... >
<android.support.design.widget.CoordinatorLayout .... >
<android.support.design.widget.AppBarLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fresco="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_height"
android:background="#color/appbar"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:layout_collapseMode="parallax">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imv_back"
android:layout_width="#dimen/toolbar_height"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:padding="#dimen/toolbar_icon_padding"
android:src="#drawable/icons8_back" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/toolbar_height"
android:background="#color/background"
android:orientation="vertical"
app:layout_collapseMode="parallax">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.facebook.drawee.view.SimpleDraweeView
android:id="#+id/imv_tour_cover"
android:layout_width="match_parent"
android:layout_height="#dimen/cover_height"
fresco:actualImageScaleType="centerCrop" />
<TextView
android:id="#+id/txv_tour_area"
android:layout_width="wrap_content"
android:layout_height="#dimen/cover_height"
android:layout_centerHorizontal="true"
android:layout_marginTop="-14dp"
android:gravity="center"
android:text="Test string."
android:textColor="#000000"
android:textSize="28sp" />
</RelativeLayout>
<TextView
android:id="#+id/txv_tour_title"
style="#style/row_marginHorizontal_12"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="-34dp"
android:text="Test string."
android:textColor="#color/text_primary"
android:textSize="#dimen/text_size_6" />
</LinearLayout>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tbl_tour"
android:layout_width="match_parent"
android:layout_height="#dimen/tablayout_height"
android:background="#color/tab">
<android.support.design.widget.TabItem
android:id="#+id/tbi_tour_stroke"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text string." />
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView .... />
<android.support.design.widget.BottomNavigationView .... />
</android.support.design.widget.CoordinatorLayout>
</android.support.v4.widget.DrawerLayout>
First look like this.
When scroll down...TabLayout will set on top.
Then scroll up a little, will expand part of CollapsingToolbarLayout (should be the toolbar's height).
Continue scrolling to the top, finally just like the first image.
My purpose is to show only Toolbar but not whole CollapsingToolbarLayout when enterAlways, the LinearLayout's content is still hide until top when scroll, is it possible?
When using ActionBarDrawerToggle with my custom Toolbar, the TextViews in the Toolbar are no longer centered.
main_layout.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
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:orientation="vertical">
<include layout="#layout/toolbar" />
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:fitsSystemWindows="true" />
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nvView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_view" />
</android.support.v4.widget.DrawerLayout>
toolbar.xml
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimaryDark"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal|center_vertical"
android:orientation="vertical">
<TextView
android:id="#+id/tvNavTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorBackgroundBlack"
android:gravity="center"
android:textColor="#color/colorWhite"
android:textSize="#dimen/text_size_large" />
<TextView
android:id="#+id/tvNavDate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorBackgroundBlack"
android:gravity="center"
android:textColor="#color/colorWhite"
android:textSize="#dimen/text_size_small" />
</LinearLayout>
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#mipmap/ic_launcher" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
I tried setting the contentInsetStart and other attributes on the Toolbar, but nothing changed.
The problem here is that ActionBarDrawerToggle's icon is set as the navigation button on the Toolbar. This button is a special child of Toolbar that will take precedence in the layout. Any other child Views added to the Toolbar will be allotted only the space remaining after that ImageButton is placed. This is pushing the left side of your RelativeLayout to the right, so the TextViews you have centered in that will not be centered with respect to the Toolbar itself.
Fortunately, Toolbar's LayoutParams has a gravity property that we can utilize to center the LinearLayout and its TextViews directly in the Toolbar, without having to wrap them in another ViewGroup. We can also set the gravity appropriately on your ImageView to similarly align that to the right side.
In this example, we apply that center gravity by setting the LinearLayout's layout_gravity to center. Be sure to also change the layout_width values to wrap_content, or you'll be in the same boat as before. The ImageView here has its layout_gravity set to right|center_vertical, replacing those layout_* attributes specific to RelativeLayout.
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimaryDark"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/tvNavTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/colorWhite"
android:textSize="#dimen/text_size_large" />
<TextView
android:id="#+id/tvNavDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/colorWhite"
android:textSize="#dimen/text_size_small" />
</LinearLayout>
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="right|center_vertical"
android:src="#mipmap/ic_launcher" />
</android.support.v7.widget.Toolbar>
I had the same issue and I fixed with the android:contentInset
Try with this code:
<android.support.design.widget.CoordinatorLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:contentInsetEnd="50dp"
android:contentInsetLeft="50dp"
android:contentInsetRight="50dp"
android:contentInsetStart="50dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:contentInsetEnd="50dp"
app:contentInsetLeft="50dp"
app:contentInsetRight="50dp"
app:contentInsetStart="50dp"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_centerInParent="true"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="5dp"
android:text="#string/app_name_short"
android:textColor="#fff"
android:textSize="20dp" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/main_fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/app_bar_layout" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
Title says it all. The search view in this layout hides behind the toolbar and looks great.
The top level toolbar is the one supplied to the support actionbar
The search view toolbar is just used as a view
The last item in the recyclerview loads more results and calls 'notifyItemRangeInserted'. Once you do that, the toolbar shadow disappears and when you scroll up, the search view is completely blank.
Any ideas why?
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:actionBarSize" />
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="?android:listPreferredItemHeight"
android:fitsSystemWindows="true">
<android.support.v7.widget.Toolbar
android:id="#+id/search_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="12dp"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:layout_marginTop="12dp"
android:background="#drawable/search_background"
android:gravity="center_vertical"
android:orientation="horizontal"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways">
<ImageView
android:id="#+id/search_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:paddingBottom="9dp"
android:paddingEnd="12dp"
android:paddingLeft="13dp"
android:paddingRight="12dp"
android:paddingStart="13dp"
android:paddingTop="9dp"
android:src="#drawable/search_icon" />
<EditText
android:id="#+id/search_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:focusable="true"
android:focusableInTouchMode="true"
android:fontFamily="#string/roboto_light"
android:gravity="center_vertical"
android:hint="#string/action_search"
android:imeOptions="actionGo"
android:maxLines="1"
android:minLines="1"
android:paddingBottom="9dp"
android:paddingTop="9dp"
android:textColor="#666666"
android:textSize="15sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/search_results"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:paddingBottom="?android:listPreferredItemHeightSmall"
android:paddingTop="4dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<TextView
android:id="#+id/search_results_count"
android:layout_width="match_parent"
android:layout_height="?android:listPreferredItemHeightSmall"
android:layout_gravity="bottom"
android:background="#color/light_gray"
android:gravity="center"
android:textColor="#color/medium_grey"
tools:text="results results" />
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
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>
```