CollapsingToolbarLayout is not behaving well

CollapsingToolbarLayout is not behaving well - android

I have problems to achieve a correct behaviour for my collapsingtoolbarLayout. I have researched many solutions provided by other users in stackoverflow, but till now, I haven't been able to solve it.
Here is the view when not collapsed:
Here is the view when collapsed:
Now the view I would like to achieve when collapsed. The weird thing is that after the user taps into the FABedit and scroll down, the desired results is achieved:
Manifest:
<activity
android:name=".GDriveActivities.DeleteActivity"
android:theme="#style/AppTheme.NoActionBar" />
Style.xlm:
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
<item name="android:statusBarColor">#null</item>
</style>
In the activity_detail.xml, I have tried with and without a FrameLayout. Without the frame layout, the collapsingtoolbarLayout become transparent when collapsed:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:transitionName="tMainHolder">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/activity_background"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/header.collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
android:background="#android:color/white"
app:contentScrim="?attr/colorPrimary">
<FrameLayout
android:id="#+id/main.framelayout.title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0">
<include layout="#layout/activity_detail_project_detail"/>
<include layout="#layout/activity_detail_editable_fields"/>
</FrameLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/main.toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:popupTheme="#style/AppTheme.PopupOverlay"
android:titleTextColor="#color/white"
app:title=""/>
</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:background="#color/activity_background"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="#+id/article_collection"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:requiresFadingEdge="vertical" />
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabEdit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_mode_edit_black_24dp"
android:tint="#android:color/white"
app:layout_anchor="#id/main.appbar"
app:layout_anchorGravity="bottom|right|end"
app:backgroundTint="#color/colorPrimary"
app:elevation="4dp" />
</android.support.design.widget.CoordinatorLayout>
DetailActivity.java:
mAppBarLayout.addOnOffsetChangedListener(this);
...
#Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
int maxScroll = appBarLayout.getTotalScrollRange();
float percentage = (float) Math.abs(verticalOffset) / (float) maxScroll;
handleAlphaOnTitle(percentage);
handleToolbarTitleVisibility(percentage);
}
private void handleToolbarTitleVisibility(float percentage) {
if (percentage >= PERCENTAGE_TO_SHOW_TITLE_AT_TOOLBAR) {
if(!mIsTheTitleVisible) {
collapsingToolbarLayout.setTitle(mProject.getpName()+ ":Article Collection");
mIsTheTitleVisible = true;
}
} else {
if (mIsTheTitleVisible) {
collapsingToolbarLayout.setTitle("");
mIsTheTitleVisible = false;
}
}
}
private void handleAlphaOnTitle(float percentage) {
if (percentage >= PERCENTAGE_TO_HIDE_TITLE_DETAILS) {
if(mIsTheTitleContainerVisible) {
mIsTheTitleContainerVisible = false;
}
} else {
if (!mIsTheTitleContainerVisible) {
mIsTheTitleContainerVisible = true;
}
}
}
I have also tried solutions like the ones proposed here and here.
Any idea what am I doing wrong? If you need also the layouts I have included in the activity_detail.xml, let me know and I will include it.
Thanks in advance for your time. I would much appreciate any help. I am completely blocked.

just put app:layout_collapseMode="pin" in your appbar
this are well example just copy paest all xml files http://saulmm.github.io/mastering-coordinator
here code - https://github.com/saulmm/CoordinatorExamples
or you can also use ancher for your actionbar
<?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:background="#android:color/background_light">
<android.support.design.widget.AppBarLayout
android:id="#+id/ioexample.appbar"
android:layout_width="match_parent"
android:layout_height="300dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/ioexample.collapsing"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">
<ImageView
android:id="#+id/ioexample.backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/material_flat"
app:layout_collapseMode="parallax"
tools:ignore="ContentDescription"
/>
</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"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="56dp"
android:textSize="20sp"
android:lineSpacingExtra="8dp"
android:text="#string/lorem"
android:padding="#dimen/activity_horizontal_margin"
/>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar
android:id="#+id/ioexample.toolbar"
android:layout_width="match_parent"
android:layout_height="112dp"
android:background="#color/brand_primary"
android:elevation="4dp"
app:layout_collapseMode="pin"
app:layout_anchor="#id/ioexample.appbar"
app:layout_anchorGravity="bottom"
app:theme="#style/ThemeOverlay.AppCompat.Light"
style="#style/ToolBarWithNavigationBack">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="8dp"
android:minHeight="?android:attr/actionBarSize"
android:orientation="vertical"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="#style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
android:text="#string/example_title"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:textAppearance="#style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle.Inverse"
android:text="#string/example_subtitle"
/>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CoordinatorLayout>

Related

CollapsingToolbarLayout Showing padding bottom in ImageView

When using android:fitsSystemWindows="true" and android:adjustViewBounds="true" together for ImageView in CollapsingToolbarLayout its give padding to ImageView at bottom
and i am posting its answer to help this reference this issue solution to help others on github issue that i have raised a long time ago
Expected behavior:
Current behavior:
Layout XMl:
<androidx.coordinatorlayout.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">
<androidx.core.widget.NestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include
android:id="#+id/include_bundle_detail_layout"
layout="#layout/include_bundle_detail_layout" />
</androidx.core.widget.NestedScrollView>
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBarLayout"
style="#style/Widget.Base.AppBarLayout"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimarySurface"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<ImageView
android:id="#+id/imageView_bundleOfferImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:visibility="gone"
app:layout_collapseMode="parallax"
tools:ignore="ContentDescription"
tools:src="#drawable/playstore_feature_graphic"
tools:visibility="visible" />
<View
android:id="#+id/view_image_upper_gradient"
android:layout_width="match_parent"
android:layout_height="96dp"
android:background="#drawable/gradient_black_transparent"
android:visibility="gone"
app:layout_collapseMode="pin"
tools:visibility="visible" />
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Widget.Base.Toolbar"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
styles.xml
<style name="Widget.Base.Toolbar">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">?actionBarSize</item>
<item name="android:paddingTop">24dp</item>
</style>

to fix that you need to add android:fitsSystemWindows="true" from root to every child view until the view that you want to show below the status bar and just set android:fitsSystemWindows="false" to those views you want to get auto padding according to status bar height so this will fix the padding issue on image view but now that black gradient act weird and being to the size of the toolbar to fix that i have manually set padding to gradient in code using window insets check code below for that
Layout
<androidx.coordinatorlayout.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">
<androidx.core.widget.NestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include
android:id="#+id/base_model_detail_layout_include"
layout="#layout/base_model_detail_layout_include" />
</androidx.core.widget.NestedScrollView>
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:minHeight="?actionBarSize"
app:contentScrim="?colorPrimarySurface"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
app:statusBarScrim="?colorPrimarySurface"
app:titleEnabled="false">
<ImageView
android:id="#+id/imageView_bundleOffer"
style="#style/Widget.PNBO.BundleOfferDetailFragment.ImageView"
android:fitsSystemWindows="true"
android:visibility="gone"
tools:ignore="ContentDescription"
tools:src="#drawable/playstore_feature_graphic"
tools:visibility="visible" />
<View
android:id="#+id/view_image_upper_gradient"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:background="#drawable/gradient_black_transparent"
android:fitsSystemWindows="true"
android:visibility="gone"
app:layout_collapseMode="pin"
tools:visibility="visible" />
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/toolbar"
android:fitsSystemWindows="false"
style="#style/Widget.PNBO.BundleOfferDetailFragment.Toolbar" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Kotlin code
private fun setUpSystemBars() {
binding.root.apply {
ViewCompat.setOnApplyWindowInsetsListener(this) { _, insets ->
val top = insets.getInsets(WindowInsetsCompat.Type.statusBars()).top
val height: Int
binding.viewImageUpperGradient?.also {
height = it.layoutParams.height
it.layoutParams.height = height + top
}
insets
}
}
}

Android full screen dialog fragment and collapsing toolbar issue

I'm having trouble with showing a full screen dialog in an activity which contains a collapsing toolbar. When I show the full screen dialog, the toolbar goes under the status bar instead of being below the status bar as shown below:
If I take away the collapsing toolbar (like in other activities I have), I don't have this problem. The toolbar from the dialog shows perfectly below the status bar. Here is my xml to for the activity:
<?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="com.casillassportsapps.mytrackfieldteam.views.RosterDetailsActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/roster_details_app_bar_height"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance="#style/TextAppearance.AppCompat.Large"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/photoImageView"
android:layout_width="#dimen/roster_details_image_size"
android:layout_height="#dimen/roster_details_image_size"
android:layout_gravity="center_horizontal"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:adjustViewBounds="true"
android:importantForAccessibility="no"
android:src="#drawable/ic_account_circle_white"
app:layout_collapseMode="parallax" />
<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>
<FrameLayout
android:id="#+id/detailContainer"
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_margin="#dimen/fab_margin"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|right|end"
app:srcCompat="#drawable/ic_assessment_white_24dp" />
</android.support.design.widget.CoordinatorLayout>
Is there anything wrong with the way I have my collapsing toolbar set up?

Try this:
Add android:fitsSystemWindows="true" for both AppBarLayout and CollapsingToolbarLayout
Full Code:
<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:fitsSystemWindows="true"
tools:context="com.casillassportsapps.mytrackfieldteam.views.RosterDetailsActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/photoImageView"
android:layout_width="#dimen/roster_details_image_size"
android:layout_height="#dimen/roster_details_image_size"
android:layout_gravity="center_horizontal"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:adjustViewBounds="true"
android:importantForAccessibility="no"
android:src="#drawable/ic_account_circle_white"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/detailContainer"
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_margin="#dimen/fab_margin"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|right|end"
app:srcCompat="#drawable/ic_assessment_white_24dp" />
</android.support.design.widget.CoordinatorLayout>

Apply this style to your DialogFragment -
Style -
<style name="AppTheme.FullScreenDialogStyle" parent="AppTheme.YourParentTheme">
<item name="android:windowNoTitle">true</item>
<item name="android:windowFullscreen">false</item>
<item name="android:windowIsFloating">false</item>
</style>
DialogFragment Java -
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setStyle(DialogFragment.STYLE_NORMAL, R.style.AppTheme.AppTheme_FullScreenDialogStyle);
}
Refer here

You can use this method to show full screen with Navigation Bar or not
public static void makeActivityFullScreen(AppCompatActivity activity, boolean showNavigationBar) {
Window window = activity.getWindow();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
if (showNavigationBar)
window.setFlags(FLAG_LAYOUT_NO_LIMITS, FLAG_FULLSCREEN);
else
window.setFlags(FLAG_LAYOUT_NO_LIMITS, FLAG_LAYOUT_NO_LIMITS);
} else
window.setFlags(FLAG_FULLSCREEN, FLAG_FULLSCREEN);
}
and add this attr in your style
<item name="android:windowTranslucentStatus">true</item>

RecyclerView Hide behind AppbarLayout?

I have an Activity with CoordinatorLayout and inside it with a FrameLayout as a fragment container. I use the toolbar and change the visibility and FitSystemWindows attribute to control the Appbar Overlay like this:
private void modifyToolbar(boolean isVisible) {
if (isVisible) {
appbar.setFitsSystemWindows(true);
imageToolBar.setVisibility(View.VISIBLE);
imageToolBar.setFitsSystemWindows(true);
coll.setFitsSystemWindows(true);
appbar.requestApplyInsets();
} else {
appbar.setFitsSystemWindows(false);
imageToolBar.setVisibility(View.GONE);
imageToolBar.setFitsSystemWindows(false);
coll.setFitsSystemWindows(false);
appbar.requestApplyInsets();
}
}
It works fine except when in my overlay Fragment, I collapse the overlay ImageView and return to the non-overlay Fragment then come back. The overlay item will hide behind the toolbar.
Normal :
Error :
Here is my activity and my appbar
<?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/coordinator"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.phoenix.soft.agenda.MainActivity">
<include layout="#layout/app_bar"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|start"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_add_white_24dp"
app:backgroundTint="#drawable/fab_background"
app:layout_anchor="#+id/fragment_content"
app:layout_anchorGravity="bottom|right" />
<FrameLayout
android:id="#+id/fragment_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_overlapTop="64dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
Appbar:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="false"
android:theme="#style/AppThemeNew.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/coll_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="#color/primary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<ImageView
android:id="#+id/image_over_lay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/find_bank"
android:transitionName="#string/toolbar_transition"
android:visibility="gone"
app:layout_collapseMode="parallax" />
<android.support.design.widget.TabLayout
android:id="#+id/tab_bar"
android:visibility="gone"
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="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppThemeNew.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
And also, there is a "blink" shows up when I collapse the AppBar and return. I guess it's somehow the same reason cause this problem.
Thanks for the help.

Android tabs in fragment with collapsing toolbar

I have a Collapsing Toolbar in my app.
I use a NavigationDrawer and switch between the items with different fragments, while replacing a FrameLayout, and leaving the Toolbar across the app.
One of the fragments has a tab layout.
When I show that fragment it is shown underneath the Toolbar, with the Toolbar shadow overlapping it.
I want it to be on the same level with the Toolbar, and to look and act like it is in the same AppBarLayout.
Also, I want to make the tabs transparent when the Toolbar is expanded.
How do I reorganize my layouts so that this will work?
Here is my Xml:
Main Xml:
<android.support.v4.widget.DrawerLayout 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:layout_gravity="right"
android:clickable="true"
android:layoutDirection="rtl"
android:fitsSystemWindows="true"
android:id="#+id/drawer_layout">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/mainCoordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layoutDirection="rtl"
android:background="#EEEEEE"
android:clickable="true">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/toolbar_layout">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="250dp"
app:collapsedTitleGravity="right"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:collapsedTitleTextAppearance="#style/CollapsedTitleTextAppearance"
app:expandedTitleTextAppearance="#style/ExpandedTitleTextAppearance"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp">
<ImageView
android:id="#+id/headerImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
android:src="#drawable/soldier" />
<View
android:layout_width="match_parent"
android:layout_height="88dp"
android:background="#drawable/scrim_top"
app:layout_collapseMode="pin" />
<View
android:layout_width="match_parent"
android:layout_height="88dp"
android:layout_gravity="bottom"
android:layout_alignBottom="#+id/headerImage"
android:background="#drawable/scrim_bottom" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/WhiteTitle"
app:layout_scrollFlags="scroll|enterAlways"
app:titleTextColor="#color/White"
android:fitsSystemWindows="true"
android:layout_gravity="right"
android:layoutDirection="rtl"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/content_frame"
android:animateLayoutChanges="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fillViewport="true" />
</FrameLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/mainFab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_gravity="bottom|end"
android:layout_marginLeft="16dp"
android:layout_marginBottom="16dp"
android:layout_marginTop="5dp"
android:elevation="8dp"
app:pressedTranslationZ="12dp"
app:backgroundTint="?android:colorAccent"
android:src="#drawable/ic_perm_phone_msg_white_24px" />
<LinearLayout
android:id="#+id/miniFabFrame"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"
android:layout_alignParentLeft="true"
android:layout_gravity="bottom|end"
android:layout_marginLeft="20dp"
android:layout_marginBottom="80dp"
android:padding="0dp">
<android.support.design.widget.FloatingActionButton
android:id="#+id/messageFab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:elevation="8dp"
android:layout_marginTop="5dp"
android:layout_marginRight="0dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="5dp"
app:pressedTranslationZ="12dp"
app:backgroundTint="?android:colorPrimary"
app:fabSize="mini"
android:src="#drawable/ic_textSMS_white_24px" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/callFab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginTop="5dp"
android:layout_marginRight="0dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="5dp"
android:elevation="8dp"
app:pressedTranslationZ="12dp"
app:backgroundTint="?android:colorPrimary"
app:fabSize="mini"
android:src="#drawable/ic_call_white_24px" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:id="#+id/nav_view"
android:layoutDirection="rtl"
app:headerLayout="#layout/header"
app:menu="#menu/nav_menu" />
Fragment with tabs layout:
<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:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fitsSystemWindows="true"
android:id="#+id/halachot_layout"
android:layoutDirection="ltr"
android:animateLayoutChanges="true">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:elevation="0dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.refractored.PagerSlidingTabStrip
android:id="#+id/halachotTabs"
android:layout_below="#id/halachot_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
pstsPaddingMiddle="false"
app:pstsShouldExpand="true" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/halachotPager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
Any guidance will be appreciated.
Thanks.

You should make a strucure like this
<?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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:tabMode="scrollable"
app:tabContentStart="72dp" />
<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/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="parallax" />
</android.support.design.widget.CollapsingToolbarLayout>
</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.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="8dp"
android:src="#drawable/ic_done"
app:layout_anchor="#id/tabs"
app:layout_anchorGravity="center|left|start"
app:fabSize="mini"
app:layout_behavior="com.support.android.designlibdemo.ScrollAwareFABBehavior"
app:borderWidth="0dp" />
</android.support.design.widget.CoordinatorLayout>
Taken from here
Also see this answer it explained well there.
If you want further explaination then read these blogs
http://blog.grafixartist.com/parallax-scrolling-tabs-design-support-library
http://blog.nkdroidsolutions.com/collapsing-toolbar-with-tabs-android-example
https://lab.getbase.com/nested-scrolling-with-coordinatorlayout-on-android/

I had a similar problem.
I solved removing the elevation of the ActionBar while showing the fragment with the undesired shadow.
I added this two methods in the Activity:
public void setToolbarElevation(){
if (Build.VERSION.SDK_INT >= 21){
if (toolbar!=null) {
toolbar.setElevation(getResources().getDimensionPixelSize(R.dimen.actionbar_elevation));
}
}
}
public void removeToolbarElevation(){
if (Build.VERSION.SDK_INT >= 21){
if (toolbar!=null) {
toolbar.setElevation(0);
}
}
}
So when you call the fragment with the tabs, you call the removeToolbarElevation() in the activity and the shadow should disappear.
Let me know if it works for you.

When I show that fragment it is shown underneath the Toolbar, with the Toolbar shadow overlapping it.
I want it to be on the same level with the Toolbar, and to look and act like it is in the same AppBarLayout.
for this give the same elevation to the tab layout as per the material design guidelines described here default elevation is 4 dp. so try giving the tab layout elevation
Also, I want to make the tabs transparent when the Toolbar is expanded.
for this add a class like this
public abstract class AppBarStateChangeListener implements AppBarLayout.OnOffsetChangedListener {
public enum State {
EXPANDED,
COLLAPSED,
IDLE
}
private State mCurrentState = State.IDLE;
#Override
public final void onOffsetChanged(AppBarLayout appBarLayout, int i) {
if (i == 0) {
if (mCurrentState != State.EXPANDED) {
onStateChanged(appBarLayout, State.EXPANDED);
}
mCurrentState = State.EXPANDED;
} else if (Math.abs(i) >= appBarLayout.getTotalScrollRange()) {
if (mCurrentState != State.COLLAPSED) {
onStateChanged(appBarLayout, State.COLLAPSED);
}
mCurrentState = State.COLLAPSED;
} else {
if (mCurrentState != State.IDLE) {
onStateChanged(appBarLayout, State.IDLE);
}
mCurrentState = State.IDLE;
}
}
public abstract void onStateChanged(AppBarLayout appBarLayout, State state);
}
then in your activity use it like
appBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener() {
#Override
public void onStateChanged(AppBarLayout appBarLayout, State state) {
Log.d("STATE", state.name());
//if state is expanded then set your tab layout background to transparent
}
});

You have go through this. As I am refering this Blog.
It is combination of what you have require means the combination of DrawerLayout + Fragments + CollapsingToolbarLayout.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
app_bar_main.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=".MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="192dp"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<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_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
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>
content_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView 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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/app_bar_main">
<FrameLayout
android:id="#+id/content_main_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
Output :

Thank you everyone for all the input.
What I ended up doing, is this:
Main Xml:
<android.support.v4.widget.DrawerLayout 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:layout_gravity="right"
android:clickable="true"
android:layoutDirection="rtl"
android:fitsSystemWindows="true"
android:id="#+id/drawer_layout">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/mainCoordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layoutDirection="rtl"
android:background="#EEEEEE"
android:clickable="true">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/toolbar_layout">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:collapsedTitleGravity="right"
app:expandedTitleGravity="bottom|right"
app:expandedTitleMarginBottom="50dp"
app:collapsedTitleTextAppearance="#style/CollapsedTitleTextAppearance"
app:expandedTitleTextAppearance="#style/ExpandedTitleTextAppearance"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp">
<ImageView
android:id="#+id/headerImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
android:background="#drawable/soldier" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="top"
app:titleTextColor="#color/White"
android:fitsSystemWindows="true"
android:layout_gravity="right"
android:layoutDirection="rtl"
app:layout_collapseMode="pin"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:titleMarginTop="15dp" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:tabIndicatorHeight="3dp"
android:layoutDirection="ltr"
app:tabIndicatorColor="#android:color/white"
app:tabSelectedTextColor="#color/White"
app:tabTextColor="#color/Black"
app:tabMode="fixed"
app:tabGravity="fill" />
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/content_frame"
android:animateLayoutChanges="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fillViewport="true" />
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:id="#+id/nav_view"
android:layoutDirection="rtl"
app:headerLayout="#layout/header"
app:menu="#menu/nav_menu" />
</android.support.v4.widget.DrawerLayout>
Then, when I switch the fragments, I show the tabs only on the fragment that I want them in, and hide them when I don't want them to show:
toolbar_layout.SetExpanded(true);
tabs.Visibility = ViewStates.Gone;
And when I want to show them:
toolbar_layout.SetExpanded(false,false);
tabs.Visibility = ViewStates.Visible;
Although I don't get them transparent, but I decided to just collapse the toolbar when I show them, and disable expanding it on the fragment with the tabs.
Maybe not the best solution, but it works pretty well for me.
These links really helped me:
- http://blog.iamsuleiman.com/parallax-scrolling-tabs-design-support-library/
- http://blog.iamsuleiman.com/material-design-tabs-with-android-design-support-library/
- How to use a TabLayout with Toolbar inside CollapsingToolbarLayout?
- http://manishkpr.webheavens.com/android-material-design-tabs-collapsible-example/
- Disable Scrolling in child Recyclerview android - How to disable expanding the toolbar on the fragment with the tabs (that also contains a recyclerview).
See what it looks like here:
https://youtu.be/y2xLVSQ_NGM
It may not be the best solution, but I wanted a cleaner way that looks good.
Thank you all for your help!

CollapsingToolbarLayout crash

I have a RecyclerView that triggers a CollapsingToolbarLayout and when I try and reopen the collapsed toolbar on 4.2.2 I get the crash below. Any ideas?
java.lang.IllegalArgumentException: width and height must be > 0
at android.graphics.Bitmap.createBitmap(Bitmap.java:638)
at android.graphics.Bitmap.createBitmap(Bitmap.java:620)
at android.support.design.widget.CollapsingTextHelper.ensureExpandedTexture(CollapsingTextHelper.java:405)
at android.support.design.widget.CollapsingTextHelper.setInterpolatedTextSize(CollapsingTextHelper.java:382)
at android.support.design.widget.CollapsingTextHelper.calculateOffsets(CollapsingTextHelper.java:227)
at android.support.design.widget.CollapsingTextHelper.setExpansionFraction(CollapsingTextHelper.java:203)
at android.support.design.widget.CollapsingToolbarLayout$OffsetUpdateListener.onOffsetChanged(CollapsingToolbarLayout.java:754)
at android.support.design.widget.AppBarLayout$Behavior.dispatchOffsetUpdates(AppBarLayout.java:851)
at android.support.design.widget.AppBarLayout$Behavior.setAppBarTopBottomOffset(AppBarLayout.java:834)
at android.support.design.widget.AppBarLayout$Behavior.scroll(AppBarLayout.java:793)
at android.support.design.widget.AppBarLayout$Behavior.onNestedScroll(AppBarLayout.java:644)
at android.support.design.widget.AppBarLayout$Behavior.onNestedScroll(AppBarLayout.java:583)
at android.support.design.widget.CoordinatorLayout.onNestedScroll(CoordinatorLayout.java:1428)
at android.support.v4.view.ViewParentCompat$ViewParentCompatStubImpl.onNestedScroll(ViewParentCompat.java:97)
at android.support.v4.view.ViewParentCompat.onNestedScroll(ViewParentCompat.java:330)
at android.support.v4.view.NestedScrollingChildHelper.dispatchNestedScroll(NestedScrollingChildHelper.java:162)
at android.support.v7.widget.RecyclerView.dispatchNestedScroll(RecyclerView.java:8306)
at android.support.v7.widget.RecyclerView.scrollByInternal(RecyclerView.java:1387)
at android.support.v7.widget.RecyclerView.onTouchEvent(RecyclerView.java:2209)
at android.view.View.dispatchTouchEvent(View.java:7127)
at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2170)
at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:1905)
Update:
It looks like the method in the library that causes the crash is only checking if either the height or width is greater than 0 -- but a Bitmap requires both to be > 0:
private void ensureExpandedTexture() {
if(this.mExpandedTitleTexture == null && !this.mExpandedBounds.isEmpty() && !TextUtils.isEmpty(this.mTextToDraw)) {
this.mTextPaint.setTextSize(this.mExpandedTextSize);
this.mTextPaint.setColor(this.mExpandedTextColor);
int w = Math.round(this.mTextPaint.measureText(this.mTextToDraw, 0, this.mTextToDraw.length()));
int h = Math.round(this.mTextPaint.descent() - this.mTextPaint.ascent());
this.mTextWidth = (float)w;
if(w > 0 || h > 0) {
this.mExpandedTitleTexture = Bitmap.createBitmap(w, h, Config.ARGB_8888);
Canvas c = new Canvas(this.mExpandedTitleTexture);
c.drawText(this.mTextToDraw, 0, this.mTextToDraw.length(), 0.0F, (float)h - this.mTextPaint.descent(), this.mTextPaint);
if(this.mTexturePaint == null) {
this.mTexturePaint = new Paint();
this.mTexturePaint.setAntiAlias(true);
this.mTexturePaint.setFilterBitmap(true);
}
}
}
}
Here is the 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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="#dimen/series_detail_header_image_height"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleTextAppearance="#style/TransparentText">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"
>
<ImageView
android:id="#+id/image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="?attr/colorPrimary"
android:paddingLeft="20dp"
android:paddingTop="10dp"
android:paddingRight="10dp"
android:layout_gravity="bottom"
>
<TextView
android:id="#+id/seriesDetailTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="American Pickers"
android:textColor="#android:color/white"
android:textSize="20sp"/>
<TextView
android:id="#+id/seriesDetailTunein"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tune in tuesdays at 8pm"
android:textColor="#android:color/white"
android:textSize="18sp"/>
<LinearLayout
android:id="#+id/adFrame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingRight="#dimen/padding_small"
android:visibility="gone">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="#dimen/margin_minimal"
android:text="#string/show_detail_presented_by"
android:textAppearance="#android:style/TextAppearance.DeviceDefault.Small"
android:textColor="#android:color/white"
android:textSize="10sp"
android:visibility="visible"/>
<FrameLayout
android:id="#+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible"/>
</LinearLayout>
</LinearLayout>
</FrameLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/show_view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:paddingTop="#dimen/toolbar_height"
/>
<RelativeLayout android:id="#+id/controls"
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_height"
android:background="#color/app_primary"
app:layout_collapseMode="pin"
android:layout_gravity="bottom"
app:layout_anchor="#id/show_view_pager"
app:layout_anchorGravity="top"
>
<Spinner
android:id="#+id/season_spinner"
android:layout_width="124dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="#dimen/series_detail_spinner_left_margin"
android:prompt="#string/seasons"
android:spinnerMode="dropdown"
android:dropDownVerticalOffset="-48dp"
android:dropDownWidth="124dp"
android:background="#drawable/selector_spinner_selector_list"
/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:clipToPadding="false"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:tabMode="scrollable" />
</RelativeLayout>
I filed a bug: Crash in Design support library - CollapsingTextHelper class -- but if anyone has a fix in the meantime I'd be very grateful!

I've discovered the cause. In the xml for the CollapsingToolbarLayout I set:
app:expandedTitleTextAppearance="#style/TransparentText"
And the style was:
<style name="TransparentText">
<item name="android:textColor">#00666666</item>
</style>
So that it would only show the text when the toolbar was collapsed.
Turns out that the styles for expandedTitleTextAppearance and collapsedTitleTextAppearance need to specifically inherit from TextAppearance. So this style works properly:
<style name="TransparentText" parent="#android:style/TextAppearance">
<item name="android:textColor">#00666666</item>
</style>
Just a heads up for anyone else who makes the same mistake...
Update (7/20/2015): This bug appears to be fixed in v22.2.1 of the Design Support Library (https://code.google.com/p/android/issues/detail?id=178674)

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

CollapsingToolbarLayout is not behaving well - android

Related

CollapsingToolbarLayout Showing padding bottom in ImageView

Android full screen dialog fragment and collapsing toolbar issue

RecyclerView Hide behind AppbarLayout?

Android tabs in fragment with collapsing toolbar

CollapsingToolbarLayout crash

Categories

Resources