In my application when I start scrolling the layout, the CollapsingToolbarLayout starts almost immediately changing the background to the scrim color I set.
Is there a way to set the value at which the CollapsingToolbar starts to change the background?
This is my XML layout:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="eu.ericnisoli.ambrosettiap.activities.MeetingActivity"
android:visibility="visible"
android:id="#+id/container">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:fitsSystemWindows="true"
android:layout_height="#dimen/app_bar_height"
android:layout_width="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:titleEnabled="false">
<RelativeLayout
android:id="#+id/relativeLayout_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
app:layout_collapseMode="parallax">
<FrameLayout
android:id="#+id/frameLayout_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/frameLayout_info">
<ImageView
android:id="#+id/imageView_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/login_bg"
android:scaleType="centerCrop"/>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/detail_meeting_gradient" />
<LinearLayout
android:id="#+id/linearLayout_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingStart="16dp"
android:paddingEnd="80dp"
android:paddingTop="16dp"
android:paddingBottom="16dp"
android:layout_gravity="bottom">
<TextView
android:id="#+id/textView_meeting"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:text="#string/meeting"
android:textColor="#color/text_grey_1"
android:textSize="#dimen/text_size_14"
android:textAllCaps="true"
/>
<TextView
android:id="#+id/textView_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:textSize="#dimen/text_size_16"
android:text="New Text"
/>
</LinearLayout>
</FrameLayout>
<FrameLayout
android:id="#+id/frameLayout_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/grey_2">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:paddingTop="32dp"
android:paddingBottom="32dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/pin_small_icon"
android:layout_marginBottom="4dp"/>
<TextView
android:id="#+id/textView_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_black_1"/>
<TextView
android:id="#+id/textView_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_black_1"/>
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:paddingTop="32dp"
android:paddingBottom="32dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/cal_small_icon"
android:layout_marginBottom="4dp"/>
<TextView
android:id="#+id/textView_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_black_1"/>
<TextView
android:id="#+id/textView_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_black_1"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</FrameLayout>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="#string/event_caps"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:layout_anchor="#+id/app_bar"
app:layout_anchorGravity="bottom"
app:layout_collapseMode="pin">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:layout_anchor="#+id/app_bar"
app:layout_anchorGravity="bottom"
android:background="#color/grey_2"
app:tabTextColor="#color/text_black_1"
app:tabSelectedTextColor="#color/text_black_1"
style="#style/DetailTab"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#drawable/shadow"
android:layout_gravity="bottom"/>
</FrameLayout>
<android.support.v4.view.ViewPager
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_height="match_parent"
android:layout_width="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_marginTop="?attr/actionBarSize"/>
<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/frameLayout_title"
app:layout_anchorGravity="bottom|end"/>
</android.support.design.widget.CoordinatorLayout>
<ProgressBar
android:id="#+id/progress"
android:layout_width="48dp"
android:layout_height="48dp"
android:indeterminate="true"
android:layout_gravity="center"
android:visibility="gone"/>
</FrameLayout>
With version 26.1 or newer, you can use the scrimVisibleHeightTrigger attribute to set the height threshold when to show the scrim overlay.
<android.support.design.widget.CollapsingToolbarLayout
app:scrimVisibleHeightTrigger="80dp"
...>
Set the amount of visible height in pixels used to define when to trigger a scrim visibility change.
If the visible height of this view is less than the given value, the scrims will be made visible, otherwise they are hidden.
Dry
After looking into CollapsingToolbarLayout's implementation, you may see, that content scrim is appearing when CollapsingToolbarLayout height gets lower than its minimum height x 2 + "status bar height":
if (mContentScrim != null || mStatusBarScrim != null) {
setScrimsShown(getHeight() + verticalOffset < getScrimTriggerOffset() + insetTop);
}
and here is getScrimTriggerOffset implementation:
final int getScrimTriggerOffset() {
return 2 * ViewCompat.getMinimumHeight(this);
}
Unfortunately setting minHeight property won't work, because this piece of code will overwrite it during onLayout:
if (mToolbarDirectChild == null || mToolbarDirectChild == this) {
setMinimumHeight(getHeightWithMargins(mToolbar));
} else {
setMinimumHeight(getHeightWithMargins(mToolbarDirectChild));
}
Solution
Extend CollapsingToolbarLayout and after onLayout call setMinimumHeight. You may also use the following implementation with setContentScrimHeight method:
import android.content.Context;
import android.support.design.widget.CollapsingToolbarLayout;
import android.util.AttributeSet;
public class MyCollapsingToolbarLayout extends CollapsingToolbarLayout {
private int contentScrimHeight;
public MyCollapsingToolbarLayout(Context context) {
super(context);
}
public MyCollapsingToolbarLayout(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MyCollapsingToolbarLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
super.setMinimumHeight(contentScrimHeight);
}
public int getContentScrimHeight() {
return contentScrimHeight;
}
public void setContentScrimHeight(int contentScrimHeight) {
this.contentScrimHeight = contentScrimHeight;
requestLayout();
}
}
Use setParallaxMultiplier(float) on view's layout parameters with id relativeLayout_title.
setParallaxMultiplier changes the threshold at which parallax animation starts triggering. By default it triggers at half the parent height, equivalent of setting the value of 0.5f.
Source
Related
I would like to add a floating action button between two layouts with different elevation to get something like this:
This is my layout, but probably it's overcomplicated:
<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"
android:theme="#style/AppTheme.NoActionBar">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="250dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="#color/color_primary"
app:scrimAnimationDuration="300"
app:titleEnabled="false"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<ImageView
android:id="#+id/trailer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true"
tools:ignore="ContentDescription" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat"
app:layout_collapseMode="pin" />
</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:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="150dp"
android:background="#color/color_primary"
android:elevation="16.0dp">
<com.est.streamcorn.views.AspectRatioImageView
android:id="#+id/image"
android:layout_width="150dp"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:scaleType="centerInside"
android:theme="#style/MoviePosterImage"
tools:ignore="ContentDescription"
app:elevation="6dp"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/play"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:elevation="6dp"
app:srcCompat="#drawable/player_action_play"
app:layout_constraintTop_toBottomOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="parent"
app:layout_constraintStart_toEndOf="#id/image"/>
<TextView
android:id="#+id/link1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/title"
app:layout_constraintStart_toEndOf="#id/image"/>
</android.support.constraint.ConstraintLayout>
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.constraint.ConstraintLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
All the examples I found anchor the floating button to the coordinator layout, but I would like to have it fixed like the other elements inside the NestedScrollView. Mybe there is a better way to accomplish the different color and elevation without needing two different layouts?
At the end I was able to achieve this:
This is the layout:
<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"
android:background="#color/colorPrimaryReverse"
android:theme="#style/AppTheme.NoActionBar">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="220dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar">
<com.est.streamcorn.views.CustomCollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:scrimAnimationDuration="250"
app:titleEnabled="false"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<ImageView
android:id="#+id/trailer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:scaleType="centerCrop"
tools:ignore="ContentDescription"
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"
app:layout_collapseMode="pin">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:ellipsize="end"
android:layout_marginEnd="5dp"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title" />
</android.support.v7.widget.Toolbar>
</com.est.streamcorn.views.CustomCollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_overlapTop="40dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" >
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.FloatingActionButton
android:id="#+id/play"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:layout_margin="20dp"
app:elevation="6dp"
app:srcCompat="#drawable/player_action_play"
app:backgroundTint="#color/colorAccent"
app:layout_anchor="#id/header"
app:layout_anchorGravity="bottom|right|end"/>
<android.support.v7.widget.CardView
android:id="#+id/image_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="15dp"
app:cardElevation="6dp"
app:cardCornerRadius="6dp"
app:layout_anchor="#id/header"
app:layout_anchorGravity="top|left|start">
<com.est.streamcorn.views.AspectRatioImageView
android:id="#+id/image"
android:layout_width="110dp"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
tools:ignore="ContentDescription"
app:aspectRatio="#dimen/movie_poster_aspect_ratio" />
</android.support.v7.widget.CardView>
<FrameLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="170dp"
android:background="#android:color/transparent"
android:elevation="4.0dp">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="130dp"
android:background="#color/colorPrimaryReverse"
android:orientation="vertical"
android:layout_gravity="bottom"
android:layout_marginBottom="0dp"
android:paddingEnd="0dp"
android:paddingStart="135dp">
<TextView
android:id="#+id/title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:ellipsize="end"
android:maxLines="2"
android:singleLine="false"
android:textAppearance="#style/MovieDetail.Title"
app:layout_constraintBottom_toTopOf="#id/text1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#id/download"
app:layout_constraintHorizontal_weight="0"
tools:text="The Martian - A Test Movie As Placeholder" />
<TextView
android:id="#+id/text1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:textAppearance="#style/MovieDetail.Text1"
app:layout_constraintBottom_toTopOf="#id/text2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#id/download"
android:layout_marginBottom="5dp"
tools:text="2015" />
<TextView
android:id="#+id/text2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:textAppearance="#style/MovieDetail.Text2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="#id/download"
android:layout_marginBottom="15dp"
tools:text="141 minutes" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="20dp"
android:background="#android:color/transparent"
app:layout_constraintBottom_toBottomOf="#id/title"
app:layout_constraintTop_toTopOf="#id/title"
app:layout_constraintEnd_toEndOf="parent"
app:backgroundTint="#android:color/transparent"
app:borderWidth="0dp"
app:elevation="0dp"
app:srcCompat="#drawable/ic_download"
tools:ignore="ContentDescription" />
</android.support.constraint.ConstraintLayout>
</FrameLayout>
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="150dp"
android:background="#color/backgroundColorReverse"
android:orientation="vertical"
android:paddingEnd="15dp"
android:paddingStart="15dp"
android:paddingTop="60dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:textSize="16sp"
android:textAllCaps="true"
android:textColor="#color/textColorPrimaryReverse"
android:text="#string/description" />
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
The custom view:
public class CustomCollapsingToolbarLayout extends CollapsingToolbarLayout {
private Boolean previousShowing = true;
public static interface Listener {
public void onContentScrimAnimationStarted(boolean showing);
}
private Listener mListener;
public CustomCollapsingToolbarLayout(Context context) {
super(context);
}
public CustomCollapsingToolbarLayout(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomCollapsingToolbarLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
public void setScrimsShown(boolean shown, boolean animate) {
super.setScrimsShown(shown, animate);
if (animate && mListener != null && shown != previousShowing) {
mListener.onContentScrimAnimationStarted(shown);
previousShowing = shown;
}
}
public void setListener(Listener listener) {
mListener = listener;
}
}
And in the activity OnCreate:
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
TypedValue tv = new TypedValue();
getTheme().resolveAttribute(android.R.attr.actionBarSize, tv, true);
final int actionBarHeight = getResources().getDimensionPixelSize(tv.resourceId);
collapsingToolbarLayout.setScrimVisibleHeightTrigger(actionBarHeight + 100);
collapsingToolbarLayout.setListener(showing -> {
if(showing){
toolbarTitle.setVisibility(View.VISIBLE);
toolbarTitle.animate().alpha(1).setDuration(250);
}
else{
toolbarTitle.setVisibility(View.INVISIBLE);
toolbarTitle.animate().alpha(0).setDuration(250);
}
});
The custom view is needed only if you want to make the title disappear when expanding the CollapsingToolbarLayout. For the layout maybe it's not a good solution but it's smooth. Better ideas are welcome.
I have two ViewPager on the same view with weight= 70/30 . The problem is when the keyboard pops, my both view keep the same weight and do not display my EditText.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fab="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:focusableInTouchMode="true"
tools:context="com.suez.memboard.fragments.formWaterQuality">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="30">
<com.suez.memboard.controls.TextView
android:id="#+id/path"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:textAppearance="#style/FreeTextBold" />
<LinearLayout
android:id="#+id/date_picker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp">
<com.suez.memboard.controls.TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="forms.label.intervention_date"
android:textAppearance="#style/FreeText"
android:textSize="15sp" />
<com.suez.memboard.controls.TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" : "
android:textAppearance="#style/FreeText"
android:textSize="15sp" />
<com.suez.memboard.controls.DateTimeText
android:id="#+id/date"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.7"
android:drawableRight="#drawable/ic_date_range_black_24dp"
android:focusable="false"
android:hint="forms.label.intervention_date"
fab:type="date" />
</LinearLayout>
<Spinner
android:id="#+id/spin_location"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabLayout
android:id="#+id/tabA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/suez_blue_1"
app:tabGravity="fill" />
<ImageButton
android:id="#+id/buttonAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/suez_blue_1"
android:src="#drawable/ic_add_box_white_48dp" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewA"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="70">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabLayout
android:id="#+id/tabB"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/suez_blue_1"
app:tabGravity="fill" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewB"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<FAB ....>
I think my last solution is to make disappear my picker at the top when my keyboard pops. How can I do this?
Hope this help you :
public class YourActivity extends BaseActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.your_activity);
attachKeyboardListeners();
}
#Override
protected void onShowKeyboard(int keyboardHeight) {
// when keyboard is shown
yourWidget.setVisibility(View.GONE);
}
#Override
protected void onHideKeyboard() {
// when keyboard is hidden
yourWidget.setVisibility(View.VISIBLE);
}
}
Try to use ScrollView in parent view, for example-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fab="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:focusableInTouchMode="true">
<ScrollView
android:id="#+id/scroll_view_parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:fillViewport="true"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
..................................
type your code here
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:orientation="vertical">
..................................
type your code here
</LinearLayout>
</LinearLayout>
</ScrollView>
</RelativeLayout>
You can set listeners when keyboard is opened and closed.
// ContentView is the root view of the layout of this activity/fragment
contentView.getViewTreeObserver().addOnGlobalLayoutListener(
new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
Rect r = new Rect();
contentView.getWindowVisibleDisplayFrame(r);
int screenHeight = contentView.getRootView().getHeight();
// r.bottom is the position above soft keypad or device button.
// if keypad is shown, the r.bottom is smaller than that before.
int keypadHeight = screenHeight - r.bottom;
Log.d(TAG, "keypadHeight = " + keypadHeight);
if (keypadHeight > screenHeight * 0.15) { // 0.15 ratio is perhaps enough to determine keypad height.
// keyboard is opened
} else {
// keyboard is closed
}
}
});
I started playing around with coordinatoralyout and I'm trying to achieve the behavior on the attached image, I want a background image to be on full screen size and upon a scroll I want some textviews to dissapear and some to stick as parts of a viewpager (rather then a toolbarlayout) any guidance on how can I achieve this?
You can use layout_behavior to handle the strings which you want to be disappear upon scroll. Customise your view behaviour using CoordinatorLayout.Behavior
ViewBehavior.java
public class ViewBehavior extends CoordinatorLayout.Behavior<RelativeLayout> {
private Context mContext;
public ViewBehavior(Context context, AttributeSet attrs) {
mContext = context;
}
#Override
public boolean layoutDependsOn(CoordinatorLayout parent, RelativeLayout child, View dependency) {
return dependency instanceof AppBarLayout;
}
#Override
public boolean onDependentViewChanged(CoordinatorLayout parent, RelativeLayout child, View dependency) {
child.measure(View.MeasureSpec.makeMeasureSpec(parent.getWidth(), View.MeasureSpec.EXACTLY), View.MeasureSpec.makeMeasureSpec(parent.getHeight(), View.MeasureSpec.AT_MOST));
int maxScroll = ((AppBarLayout) dependency).getTotalScrollRange();
float percentage = Math.abs(dependency.getY()) / (float) maxScroll;
float childPosition = dependency.getHeight()
+ dependency.getY()
- child.getMeasuredHeight()
- (getToolbarHeight() - child.getMeasuredHeight()) * percentage / 2;
CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
child.setLayoutParams(lp);
child.setY(childPosition);
return true;
}
public int getToolbarHeight() {
int result = 0;
TypedValue tv = new TypedValue();
if (mContext.getTheme().resolveAttribute(android.R.attr.actionBarSize, tv, true)) {
result = TypedValue.complexToDimensionPixelSize(tv.data, mContext.getResources().getDisplayMetrics());
}
return result;
}
}
In layout xml, set your custom view behaviour as a app:layout_behavior in the view you want to handle.
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:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
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"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
</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:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:id="#+id/llViewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<com.astuetz.PagerSlidingTabStrip
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dp"
android:textColor="#color/red"
app:pstsShouldExpand="true"
app:pstsTextAllCaps="true" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.stacktest.ViewBehavior">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginBottom="20dp"
android:layout_marginLeft="36dp"
android:layout_marginTop="20dp"
android:text="Text-1" />
<TextView
android:id="#+id/txt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginBottom="20dp"
android:layout_marginRight="36dp"
android:layout_marginTop="20dp"
android:text="Text-2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/txt2"
android:layout_marginBottom="20dp"
android:layout_marginLeft="36dp"
android:paddingRight="20dp"
android:text="Text-3" />
<TextView
android:id="#+id/txt4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/txt2"
android:layout_marginBottom="20dp"
android:layout_marginRight="36dp"
android:text="Text-4" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
Finally, use the layout and create ViewPager and Tabs in your Activity class.
MainActivity.java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
((CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar)).setTitle(" ");
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
PagerSlidingTabStrip tabsStrip = (PagerSlidingTabStrip) findViewById(R.id.tabs);
tabsStrip.setViewPager(viewPager);
}
public class MyPagerAdapter extends FragmentPagerAdapter {
final int PAGE_COUNT = 2;
private String tabTitles[] = new String[] { "Tab1", "Tab2" };
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public int getCount() {
return PAGE_COUNT;
}
#Override
public Fragment getItem(int position) {
return TestFragment.newInstance(position + 1);
}
#Override
public CharSequence getPageTitle(int position) {
return tabTitles[position];
}
}
}
Add following extra dependency in build.gradle along with appcompat and support library.
com.android.support:design:23.2.1
com.astuetz:pagerslidingtabstrip:1.0.1 (for ViewPager tabs)
As I am not sure if you want a particular or a general solution, I am going to give you my solution for your particular question. The key is to work with scrollFlags and collapseMode. If you really want to hide the tabs when the appBar is expanded, you can play with visibility.
<?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="wrap_content"
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="wrap_content"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|snap">
<RelativeLayout
android:layout_marginTop="?attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="375dp"
android:src="#drawable/ic_launcher"/>
<LinearLayout
android:layout_marginBottom="30dp"
android:layout_below="#+id/image"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<TextView
android:layout_marginLeft="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="textView1"/>
<TextView
android:layout_marginLeft="140dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="textView2"/>
</LinearLayout>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/mToolbar"
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>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<TextView
android:layout_marginLeft="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="textView3"/>
<TextView
android:layout_marginLeft="140dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="textView4"/>
</LinearLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:background="?attr/colorPrimary"
app:tabMode="scrollable"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/tab_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
In my XML i set the entire screen as scrollable, I created the scroll view inside that set the Framelayout for View pager and Grid view. Here Grid view only scrolled but it doesn't scroll the entire screen.
Below is my code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:scrollbars="vertical">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="200dp"
android:id="#+id/framelayoutViewpager">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</android.support.v4.view.ViewPager>
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal" >
<Button
android:id="#+id/btnImagePrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Previous" />
<Button
android:id="#+id/btnImageNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Next" />
</LinearLayout>
</FrameLayout>
<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/framelayoutViewpager"
android:numColumns="3"
android:stretchMode="columnWidth"
android:paddingTop="7dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:layout_marginBottom="2dp"
android:id="#+id/gridView" />
</RelativeLayout>
</ScrollView>
</LinearLayout>
NonScrollGridView will do the trick here..
NonScrollGridView
import android.content.Context;
import android.util.AttributeSet;
import android.view.ViewGroup;
public class NonScrollGridView extends GridViewWithHeaderAndFooter {
public NonScrollGridView(Context context) {
super(context);
}
public NonScrollGridView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public NonScrollGridView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int heightMeasureSpec_custom = MeasureSpec.makeMeasureSpec(
Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, heightMeasureSpec_custom);
ViewGroup.LayoutParams params = getLayoutParams();
params.height = getMeasuredHeight();
}
}
If ready to use AppCompact support lib then try NestedScrollView and CoordinatorLayout.
sample layout code:
<?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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="250dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v4.view.ViewPager
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal" >
<Button
android:id="#+id/btnImagePrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Previous" />
<Button
android:id="#+id/btnImageNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Next" />
</LinearLayout>
</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">
<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/framelayoutViewpager"
android:numColumns="3"
android:stretchMode="columnWidth"
android:paddingTop="7dp"
android:layout_marginTop="2dp"
android:layout_marginRight="2dp"
android:layout_marginBottom="2dp"
android:id="#+id/gridView" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
I am working on one android app in which I am using CoordinatorLayout,AppBarLayout and CollapsingToolbarLayout to use the advance collapse bar functionality.
I am using recyclerview to show the number of items in the fragment. When I'm scrolling up recyclerview it smoothly collapse AppBarLayout but when I scroll down and reach at on the first item of the recyclerview it automatically stop scrolling without expanding `AppBarLayout'.
Then again I need to scroll down again to make AppBarLayout visible. So my requirement is that on scrolling down when I reach to top of recyclerview it must expand `AppBarLayout'.
How can we do this. Any idea ? Please see video of same https://www.dropbox.com/s/va5jk27ikytk5ax/app_collapsebar_issue.mp4?dl=0
Here is my layout of same :-
<?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"
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<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:adjustViewBounds="true"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="220dp"
android:background="#drawable/offer_image"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!-- <com.flaviofaria.kenburnsview.KenBurnsView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="220dp"
android:src="#drawable/offer_image" />-->
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<com.flaviofaria.kenburnsview.KenBurnsView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="220dp"
android:src="#drawable/offer_image" />
<FrameLayout
android:id="#+id/collapse_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#B3c85a00">
</FrameLayout>
<FrameLayout
android:id="#+id/centerCircle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<ImageView
android:id="#+id/imageViewCenter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/offer" />
</FrameLayout>
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="15dp"
app:tabIndicatorColor="#FFFFFF"
app:tabMode="scrollable" />
<!--</FrameLayout>-->
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!--<FrameLayout-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="match_parent"-->
<!-- -->
<!--android:visibility="visible">-->
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
style="#style/floating_action_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:src="#drawable/ic_share_white_24dp"
android:visibility="gone"
app:backgroundTint="#FF9800"
app:elevation="6dp"
app:pressedTranslationZ="12dp" />
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom|fill_vertical"
android:layout_marginTop="0dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"></android.support.v4.view.ViewPager>
<!--</FrameLayout>-->
<!--<include layout="#layout/content_scrolling" />-->
</android.support.design.widget.CoordinatorLayout>
<RelativeLayout
android:id="#+id/bannerView"
android:layout_width="match_parent"
android:layout_height="58dp"
android:layout_gravity="bottom|center"
android:background="#drawable/curved_white_with_blue_border"
android:visibility="gone">
<TextView
android:id="#+id/bannerText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:layout_centerVertical="true"
android:gravity="center"
android:padding="3dp"
android:text="Banner"
android:visibility="gone" />
<ImageView
android:id="#+id/bannerImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:padding="3dp"
android:scaleType="fitXY"
android:visibility="gone" />
<ImageView
android:id="#+id/bannerClose"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_centerVertical="true"
android:src="#drawable/cross_icon" />
</RelativeLayout>
<LinearLayout
android:id="#+id/socialTabs"
android:layout_width="match_parent"
android:layout_height="46dp"
android:layout_gravity="bottom|center"
android:layout_marginBottom="5dp"
android:background="#color/White"
android:orientation="horizontal"
android:visibility="gone">
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:src="#drawable/follow" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:background="#color/White">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="46dp"
android:layout_gravity="center"
android:gravity="center"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:weightSum="3">
<ImageView
android:id="#+id/facebookImageView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_weight="1"
android:src="#drawable/fb_follow" />
<ImageView
android:id="#+id/googlePlusImageView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:src="#drawable/google_follow" />
<ImageView
android:id="#+id/twitterImageView"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:src="#drawable/twitter_follow" />
</LinearLayout>
</FrameLayout>
</LinearLayout>
</FrameLayout>
<ExpandableListView
android:id="#+id/left_drawer"
android:layout_width="265dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#fff"
android:choiceMode="singleChoice"
android:divider="#null"
android:dividerHeight="0dp"
android:drawSelectorOnTop="true"
android:groupIndicator="#null"
android:scrollbars="#null" />
</android.support.v4.widget.DrawerLayout>
I've just put together a sample app that seems to demonstrate the behaviour you're after. The AppBar will automatically expand whenever the RecyclerView beneath it is scrolled to the top, rather than stopping and waiting for another swipe to open the AppBar.
The most relevant components reside in a custom RecyclerView class. I've added a few explanatory comments:
public class ScrollFeedbackRecyclerView extends RecyclerView {
private WeakReference<Callbacks> mCallbacks;
public ScrollFeedbackRecyclerView(Context context) {
super(context);
attachCallbacks(context);
}
public ScrollFeedbackRecyclerView(Context context, AttributeSet attrs) {
super(context, attrs);
attachCallbacks(context);
}
/*If the first completely visible item in the RecyclerView is at
index 0, then we're at the top of the list, so we want the AppBar to expand
**if the AppBar is also collapsed** (otherwise the AppBar will constantly
attempt to expand).
*/
#Override
public void onScrolled(int dx, int dy) {
if(((LinearLayoutManager)getLayoutManager()).findFirstCompletelyVisibleItemPosition() == 0) {
Log.e(getClass().getSimpleName(), "index 0 visible");
if(mCallbacks.get().isAppBarCollapsed()) {
mCallbacks.get().setExpanded(true);
}
}
super.onScrolled(dx, dy);
}
/* the findFirstCompletelyVisibleItem() method is only available with
LinearLayoutManager and its subclasses, so test for it when setting the
LayoutManager
*/
#Override
public void setLayoutManager(LayoutManager layout) {
if(!(layout instanceof LinearLayoutManager)) {
throw new IllegalArgumentException(layout.toString() + " must be of type LinearLayoutManager");
}
super.setLayoutManager(layout);
}
private void attachCallbacks(Context context) {
try {
mCallbacks = new WeakReference<>((Callbacks)context);
} catch (ClassCastException e) {
throw new ClassCastException(context.toString() + " must implement " +
"ScrollFeedbackRecyclerView.Callbacks");
}
}
/* Necessary to interact with the AppBarLayout in the hosting Activity
*/
interface Callbacks {
boolean isAppBarCollapsed();
void setExpanded(boolean expanded);
}
}
MainActivity.java
public class MainActivity extends AppCompatActivity implements ScrollFeedbackRecyclerView.Callbacks{
private AppBarLayout mAppBarLayout;
private Toolbar mToolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ScrollFeedbackRecyclerView mRecyclerView = (ScrollFeedbackRecyclerView) findViewById(R.id.rv_container);
RecyclerViewAdapter mAdapter = new RecyclerViewAdapter();
mRecyclerView.setAdapter(mAdapter);
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
mAppBarLayout = (AppBarLayout) findViewById(R.id.app_bar);
mToolbar = (Toolbar) findViewById(R.id.toolbar);
}
/* When collapsed, calling getY() on the AppBar will return a negative number.
Adding this number to getHeight() will return the same value as the toolbar's
height if the AppBar is fully collapsed.
*/
#Override
public boolean isAppBarCollapsed() {
final int appBarVisibleHeight = (int) (mAppBarLayout.getY() + mAppBarLayout.getHeight());
final int toolbarHeight = mToolbar.getHeight();
return (appBarVisibleHeight == toolbarHeight);
}
#Override
public void setExpanded(boolean expanded) {
mAppBarLayout.setExpanded(expanded, true);
}
}