Open suhaibroomy opened 8 years ago
Can you post your layout here? Which version of SupportDesign and SmoothAppBarLayout are you using?
<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">
<FrameLayout
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true" />
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="@+id/smooth_app_bar_layout"
android:layout_width="match_parent"
android:layout_height="@dimen/app_bar_height"
android:fitsSystemWindows="@bool/fitSystemsWindow">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMargin="@dimen/activity_horizontal_margin"
app:expandedTitleTextAppearance="@style/Base.TextAppearance.AppCompat.Title.Toolbar"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax">
<com.cube26.osp.music.ui.customviews.kenburnsview.KenBurnsView
android:id="@+id/iv_album_art"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/black_24" />
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/parallax_view_gradient" />
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:contentInsetLeft="?attr/actionBarSize"
app:contentInsetStart="?attr/actionBarSize"
app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
app:titleTextAppearance="@style/AppTheme.Toolbar.Title"
style="@style/AppTheme.Toolbar.Title"/>
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
<View
android:id="@+id/shadow_top"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_gravity="bottom"
android:background="@drawable/shadow_gradient" />
<ImageView
android:id="@+id/iv_back"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:padding="@dimen/activity_horizontal_margin"
app:srcCompat="@drawable/ic_arrow_back_white_36dp" />
</android.support.design.widget.CoordinatorLayout>
Recycler view is containted in the fragment_container. Header is added in that
https://drive.google.com/file/d/0B181lwJ5g8kibEktQmhCbzM1Wjg/view?usp=sharing
take a look at this video. flickrs at 00:13
Which version of SupportDesign and SmoothAppBarLayout are you using?
I am using 23.3.0 of smoothappbar. Tested it with 23.3.0 and 23.4.0 of design support. Same results on both.
Based on your implementation, do you think there are any differences between your code and the demo code? It's better if either I can have access to your repo or you can reproduce it on my sample repo in order to troubleshoot it.
https://drive.google.com/file/d/0B181lwJ5g8kiemhIcGpXM1dYTEU/view?usp=sharing
This is video of demo code. I added fit systems window to your layout
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.v7.widget.RecyclerView
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"/>
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="@+id/smooth_app_bar_layout"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:layout_height="@dimen/app_bar_height">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:background="@android:color/transparent"
app:layout_collapseMode="pin"
app:navigationIcon="@drawable/ic_menu_arrow_back"
style="@style/AppStyle.MdToolbar" />
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
</android.support.design.widget.CoordinatorLayout>
Hi @suhaibroomy
If you want to support fitSystemWidnows, Please check out branch issue-114
or see my commit above.
hey @henrytao-me
Thanks for your quick help. I am afraid it didnt fix the issue for me. Although i am not able to reproduce it now in your sample. I think i am doing something wrong. I have to use fitsystemswindow in framelayout that has my recyclerview else my app bar doesnt cover status bar. so i have to give item_header height as 256dp as against 232dp in yours. i think if i am able to fix this it might work. any suggestions about this would be great help
i was trying out things in your sample. I tried with this layout and it is happening again. I removed framelayout. any specific reason for keeping recycler view inside framelayout
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.v7.widget.RecyclerView
android:id="@android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"/>
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="@+id/smooth_app_bar_layout"
android:layout_width="match_parent"
android:layout_height="@dimen/app_bar_height"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/mdColor_blue_accent_dark"
app:contentScrim="@color/mdColor_blue"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:background="@android:color/transparent"
app:layout_collapseMode="pin"
app:navigationIcon="@drawable/ic_menu_arrow_back"
style="@style/AppStyle.MdToolbar" />
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
</android.support.design.widget.CoordinatorLayout>
Hi @suhaibroomy
If you remove android:fitsSystemWindows
in RecyclerView
, everything works fine except some extra space in the header of RecyclerView (which equals statusbar height). This issue is also appeared in original AppBarLayout based on my test. (However, as I remember, it didn't have that issue before. I tried it few months ago).
That's why I recommend to subtract header space of RecyclerView by 24dp
if you fitSystemWindows
is true. Please note that, fitSystemWindows
also works on Android 4.x but I recommend you set it to true on Android 5.x and above only.
Hope it helps. Cheers, Henry
As i told you if i remove android:fitsSystemWindows
from my code, android doesn't give this attribute to app bar as well which is kinda strange. I was digging into it as to why it is happening. i noticed you enable transparent status bar from code whereas i am doing it as a property of my activity theme. when i applied this property to your activity's theme same thing happened. i had to give android:fitsSystemWindows
to framelayout to make it work. anyways for some reason nothing is working in my code. i will try to fix this with android:fitsSystemWindows
to framelayout in your code. Any suggestions where shall i start
Hi @suhaibroomy
I can help to look into your code if we can arrange a time. What's your timezone? Mine is GMT+7. Let's do teamviewer then.
sure.mine is GMT +5:30. its sunday tomorrow. if we can do it in the morning that would be better. my email is suhaibroomy91@gmail.com. same is configured with teamviewer. ping a suitable time on email
Did you guys figure this out? I also have this issue and it seems to be related to recyclerView.addItemDecoration
the glitching deals with the extra space that may be added with this method.
This issue still persists. i am not using any itemdecoration
It has to do this recyclerview.computeVerticalScrollOffset()
which estimates the offset based on the heights of the views.
maybe try
RecyclerView.LayoutManager layoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL) {
@Override
public int computeVerticalScrollOffset(RecyclerView.State state) {
View firstView = recyclerView.getLayoutManager().findViewByPosition(0);
if (firstView != null) {
return - (int) firstView.getY();
}
return super.computeVerticalScrollOffset(state);
}
};
having the same issue with designlibrary 24.1.1 and smooth-appbar-layout 24.0.0.0. I dont use CollapsingToolbarLayout. Its a normal Coordinatorlayout with toolbar and slidingtablayout inside smoothappbarlayout. but i am using a recyclerview with linearlayoutmanager. i think it has something to do with recyclerview and smoothappbarlayout. since smoothappbarlayout version 1.0.0 this library seems to have its difficulties with recyclerviews. with support-version 23.2.1 and smoothappbarlayout version 0.2.3 i have no issues.
Hi @borgwald
Please use smooth-appbar-layout:24.1.1.0
;)
thanks. tried 24.1.1.0. but flickering-bug still happens. reverted back to support-version 23.2.1 and appbarlayout-version 0.2.3.
I have the same issue with @borgwald.
will you be able to look into it if i make a try to reproduce this in a sample app @henrytao-me ?
Sure. @suhaibroomy I couldn't reproduce in sample app. Still dont know why. I am very appreciate if you can help.
Hi @suhaibroomy
Let's verify this issue together. I am up for a call via Hangout tomorrow, around 8 PM to 9 PM (GMT + 7) which is 6:30 PM to 7:30 PM your time if I am right.
Let me know if you are OK.
Hi @henrytao-me
Sorry i just checked your comment. I am only free on sundays i am afraid. we can do a hangout session or i can also try to replicate this on my sample app which ever you may prefer
Thanks
are there any updates on this issue?
Hi all, I still don't have any updates yet. Sorry about that.
Hi @borgwald @suhaibroomy
Please try out latest version. I fixed it. Thanks to @teddychoi for reporting issue with sample project here. https://github.com/henrytao-me/smooth-app-bar-layout/issues/139
Turn out, it's an issue with RecyclerView. onScrolling
return dx > 0 while computeVerticalScrollOffset()
return the same value with previous one.
For now, I close this issue. Please reopen it if you need any further help. Thanks all.
Hey the issue still persists in 24.2.0.2. tried it out with 24.1.0 and 24.2.0 versions of support library. Also fitsystemswindow is not working with this update(also tried with above two versions of support libraries). I have also filed an issue with support library team. seems to be an issue with collapsing toolbar layout. check it out here https://code.google.com/p/android/issues/detail?id=221419
Are there any chances that I can look into your app?
@suhaibroomy
Regarding to fitSystemWindows
issue in 24.2.0. It needs to call setOnApplyWindowInsetsListener
on parallax view
in order to make it work. Checkout my code and screenshot from my app below. If you can provide me access to your current app, I will assist better. I promise your code will be secured. I will delete it immediately right after the issue is fixed for you. It's more interesting for me to help looking into the issue.
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fresco="http://schemas.android.com/apk/res-auto">
<data>
<variable
name="viewModel"
type="com.squar.mychat.ui.home.profile.HomeProfileViewModel" />
</data>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="@bool/isFitSystemWindows">
<LinearLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view_fragment_home_profile"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<View
android:layout_width="match_parent"
android:layout_height="@dimen/backgroundGradientSize"
android:layout_gravity="bottom"
android:background="@drawable/background_gradient_bottom_top" />
<android.support.design.widget.FloatingActionButton
android:layout_gravity="bottom|end"
android:layout_marginBottom="@dimen/fabMargin"
android:layout_marginEnd="@dimen/fabMargin"
android:layout_marginRight="@dimen/fabMargin"
android:theme="@style/AppTheme.Button.Orange"
app:fabSize="normal"
app:srcCompat="@drawable/ic_chat_accent"
style="@style/MdFloatingActionButton" />
</FrameLayout>
<com.squar.mychat.widget.BottomBar
android:id="@+id/bottom_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="@+id/smooth_app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="@bool/isFitSystemWindows"
app:sabl_target_id="@id/recycler_view_fragment_home_profile">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="@bool/isFitSystemWindows"
app:contentScrim="?attr/mdColor_primaryPalette"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<RelativeLayout
android:id="@+id/cover_wrapper"
android:layout_width="match_parent"
android:layout_height="@dimen/profileCoverHeight"
android:fitsSystemWindows="@bool/isFitSystemWindows"
app:layout_collapseMode="parallax">
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/cover"
android:layout_width="match_parent"
android:layout_height="match_parent"
fresco:backgroundImage="@android:color/black"
fresco:placeholderImage="@drawable/sample_cover"
fresco:placeholderImageScaleType="centerCrop" />
<View
android:id="@+id/status_bar"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true" />
<ImageView
android:id="@+id/btn_setting"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="@id/status_bar"
android:layout_margin="@dimen/mdLayoutSpacing"
android:background="@drawable/background_opacity_circle_dark"
app:srcCompat="@drawable/ic_setting_white"
style="@style/MdIcon" />
<ImageView
android:id="@+id/btn_cover"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_margin="@dimen/mdLayoutSpacing"
android:background="@drawable/background_opacity_circle_dark"
app:srcCompat="@drawable/ic_camera_white"
style="@style/MdIcon" />
<TextView
android:id="@+id/btn_edit_profile"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_marginBottom="20dp"
android:layout_toLeftOf="@id/btn_cover"
android:layout_toStartOf="@id/btn_cover"
android:background="@drawable/background_opacity_square_dark"
android:gravity="center"
android:paddingLeft="12dp"
android:paddingRight="12dp"
android:text="Edit Profile"
android:textAllCaps="true"
android:textColor="@android:color/white"
style="@style/MdText.Caption" />
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:background="@android:color/transparent"
app:layout_collapseMode="pin"
style="@style/MdToolbar">
<RelativeLayout
android:id="@+id/toolbar_content"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<ImageView
android:id="@+id/btn_setting_2"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="?attr/selectableItemBackgroundBorderless"
app:srcCompat="@drawable/ic_setting_white"
style="@style/MdIcon" />
<ImageView
android:id="@+id/avatar"
android:layout_width="@dimen/mdListAvatarSize"
android:layout_height="@dimen/mdListAvatarSize"
android:layout_centerVertical="true"
android:padding="@dimen/mdListAvatarPadding"
android:scaleType="fitCenter"
app:srcCompat="@drawable/ic_blank_avatar" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="@id/avatar"
android:layout_toLeftOf="@id/btn_setting_2"
android:layout_toRightOf="@id/avatar"
android:layout_toStartOf="@id/btn_setting_2"
android:orientation="vertical"
android:paddingEnd="0dp"
android:paddingLeft="@dimen/mdLayoutSpacing"
android:paddingRight="0dp"
android:paddingStart="@dimen/mdLayoutSpacing">
<TextView
android:id="@+id/title"
android:text="Oliver"
style="@style/MdToolbar.Title" />
<TextView
android:id="@+id/subtitle"
android:text="23, Female, live in Yangon, Myanmar"
style="@style/MdToolbar.Subtitle" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
</android.support.design.widget.CoordinatorLayout>
</layout>
@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
((AppCompatActivity) getActivity()).setSupportActionBar(mBinding.toolbar);
mBinding.collapsingToolbarLayout.setTitleEnabled(false);
mBinding.collapsingToolbarLayout.setTitle("");
((AppCompatActivity) getActivity()).getSupportActionBar().setTitle("");
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
ViewCompat.setOnApplyWindowInsetsListener(mBinding.coverWrapper, (v, insets) -> insets.consumeSystemWindowInsets());
mBinding.statusBar.getLayoutParams().height = MdCompat.getStatusBarSize(getActivity());
}
mStatusBarSize = MdCompat.getStatusBarSize(getActivity());
mActionBarSize = Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP ? MdCompat.getActionBarSize(getActivity()) : 0;
mBinding.smoothAppBarLayout.addOnOffsetChangedListener((appBarLayout, verticalOffset) -> {
verticalOffset = Math.abs(verticalOffset);
int min = mBinding.coverWrapper.getHeight() - mStatusBarSize - 2 * mActionBarSize;
float alpha = verticalOffset > min ? (verticalOffset - min) * 1.0f / mActionBarSize : 0;
mBinding.toolbarContent.setAlpha(Math.min(alpha, 1f));
});
...
}
Still an issue on 24.2.1. I'm using a nested scroll view with a relative layout and recycler view inside. Only happens when flinging.
Hi @longden
Can you post your layout here? If you put RecyclerView inside NestedScrollView, then the scrolling is on NestedScrollView, isn't it? You may need to disable your RecyclerView like this recyclerView.setNestedScrollingEnabled(false);
I have tried a screen with horizontal RecyclerView inside vertical RecyclerView using above way. It works.
@henrytao-me After playing around with it for a while I found I wasn't using your custom NestedScrollView which fixes the flickering.
It's good to know @longden. My custom NestedScrollView
only support adding multiple OnScrollChangeListener. Depending on your usecase but in general, it plays the same as original NestedScrollView.
@henrytao-me Thank you for your help.
I had a quick look around because I wondered why changing it would fix it. From the quick look I had it seems that the implementation of mNestedScrollView.getViewTreeObserver().addOnScrollChangedListener() introduces some lag (also a potential memory leak because off the add) which might be the cause of the visual flickering. If I force the NestedScrollView to use the built in setOnScrollChangeListener then there is no flickering even when using the base v4 NestedScrollView.
Is there a use case to using getTreeObserver() and adding a scroll listener when NestedScrollView has an OnScrollChangeListener ?
in collapsed position the collapsing toolbars becomes visible for a split second in expanded mode. i have made a video as well but youtube skips that frame i dont know why. will email you the video if you want. I really wanna use your library as support library sucks big time. Lemme know if you will be fixing it and if you need any help from my side