First time toolbar animation works good, toolbar animates out of the screen successfully.
Problem: Animation on the toolbar is not working on click of any view, toolbar doesn't reappears in the screen by animation.
xml code of activity:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_image_viewer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/activity_image_viewer_view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black" />
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
</RelativeLayout>
Toolbar code is:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary">
</android.support.v7.widget.Toolbar>
Activity code: In onCreate, This will hide the statusbar, navigationbar and toolbar
RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) toolbar.getLayoutParams();
layoutParams.setMargins(0, uiUtils.getStatusBarHeight(getResources()), 0, 0);
toolbar.setLayoutParams(layoutParams);
toolbar.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
toolbar.animate().translationY(-toolbar.getBottom()).setInterpolator(new AccelerateInterpolator()).start();
}
uiUtils.hideStatusNavigationBar(getWindow());
ViewTreeObserver observer = toolbar.getViewTreeObserver();
if (observer.isAlive()) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
observer.removeOnGlobalLayoutListener(this);
} else {
observer.removeGlobalOnLayoutListener(this);
}
}
}
});
Below is problematic code, Toolbar doesn't reappear by animation In click of any view (OnClickListener is already set on views)
#Override
public void onClick(View view) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
toolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator()).start();
}
uiUtils.showStatusNavigationBar(getWindow());
}
By mistake i have set the OnClickListener on ViewPager, Now i have realized that onClick() method never going to be called for view pager.
That's why toolbar reappear animation is not working.
Sometimes we doesn't mind very simple thing.
Solution: remove OnClickListener from ViewPager and set it to other clickable view.
Related
I've some troubles trying to hide toolbar when user scrolls over the recyclerView.
The toolbar is transparent and is over the recyclerView (through FrameLayout). I've searched a lot but I haven't found any solution to solve this incorrect behaviour.
Currently, I've this xml:
<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:orientation="vertical"
app:statusBarBackground="#android:color/transparent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:fitsSystemWindows="true">
<include layout="#layout/toolbar_activity" />
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
With this code, the toolbar is fixed at the top and it's not affected by app:layout_behavior="#string/appbar_scrolling_view_behavior". I've tried moving that attribute to the FrameLayout but in this case, the recyclerview is below the toolbar, not behind it.
Any idea of how can I solve this? I'm going crazy...
set property
app:layout_scrollFlags="scroll|enterAlways"
to child view of android.support.design.widget.AppBarLayout
Create a custom class and then extend RecyclerView.OnScrollListener
public class ScrollListener extends RecyclerView.OnScrollListener {
public ScrollListener() {
}
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
switch (newState) {
case RecyclerView.SCROLL_STATE_IDLE:
System.out.println("The RecyclerView is not scrolling");
break;
case RecyclerView.SCROLL_STATE_DRAGGING:
System.out.println("Scrolling now");
break;
case RecyclerView.SCROLL_STATE_SETTLING:
System.out.println("Scroll Settling");
break;
}
}
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
if (dy > 0) {
//scrolling downwards: hide/show toolbar
System.out.println("Scrolled Downwards");
} else if (dy < 0) {
//scrolling downwards: hide/show toolbar
}
}
}
Attach listener to recycler view
mRecyclerView.addOnScrollListener(new ScrollListener());
Add these scroll flags to child of your app bar layout
app:layout_scrollFlags="scroll|enterAlways|snap"
I have a fragment with a RecyclerView inside of a ViewPager, and I want to manage the behavior of a Floating Action Button located in my MainActivity. In my onCreateView() of the Fragment, I have the following code:
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_recycler, container, false);
recycler = (RecyclerView) v.findViewById(R.id.recycler);
initiate_recycler();
if (getActivity() instanceof MainActivity) {
((MainActivity) getActivity()).set_fab_behavior(recycler);
}
return v;
}
In the MainActivity, I have the set_fab_behavior() method, which is:
public void set_fab_behavior(RecyclerView recyclerView) {
recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
#Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
if (dy < 0) {
fab.show();
} else {
fab.hide();
}
}
});
}
The code works fine, and it shows/hides the Floating Action Button when it is scrolled. However, the fab isn't initialized when the app first runs. It isn't there, and when the RecyclerView is scrolled for the first time, it doesn't animate in. Instead, it just appears. How should I modify the code so the fab is present on the application start?
Also, note that the fab works fine when this method is not called, but it doesn't hide on scroll, which is necessary. I already tried passing the fab to the fragment via a getter method, and adding the OnScrollListener in the fragment, but the results were the same.
Edit: below is the MainActivity layout file
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.gworkman.shoutout.MainActivity">
<android.support.design.widget.FloatingActionButton
android:layout_width="64dp"
android:layout_height="64dp"
android:layout_gravity="bottom"
android:background="#color/white"
app:backgroundTint="#color/white"
android:src="#drawable/ic_mic"
app:elevation="12dp"
android:id="#+id/fab"/>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/pager"/>
</android.support.design.widget.CoordinatorLayout>
I am using the latest version of the design support library (23.1.1) and I am facing an issue when I use the CollapsingToolbarLayout with the enterAlways scroll flag. Basically, when you scroll back up, the view appears but if also leaves a empty white space at top.
Normal View:
After scrolling down and then back up (notice the whitespace below status bar):
MainActivity.java
public class MainActivity extends AppCompatActivity {
AppBarLayout appBar;
View expandedView;
Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
setTitle("");
initViews();
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
private void initViews() {
appBar = (AppBarLayout) findViewById(R.id.appBar);
appBar.addOnOffsetChangedListener(appBarOffsetChangedListener);
expandedView = findViewById(R.id.expandedView);
RecyclerView rv = (RecyclerView) findViewById(R.id.rv);
rv.setLayoutManager(new LinearLayoutManager(this));
rv.setAdapter(new DummyAdapter());
}
private AppBarLayout.OnOffsetChangedListener appBarOffsetChangedListener = new AppBarLayout.OnOffsetChangedListener() {
#Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
int maxOffset = appBar.getTotalScrollRange();
verticalOffset = Math.abs(verticalOffset);
if(verticalOffset > maxOffset)
return;
float percentage = verticalOffset / (float) maxOffset;
if(expandedView!=null)
expandedView.setAlpha(1 - percentage);
}
};
}
activity_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"
android:fitsSystemWindows="true"
tools:context="com.media2359.fragmenttoolbarchange.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="180dp"
android:background="#color/colorPrimaryDark"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed|enterAlways">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin">
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:id="#+id/expandedView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:paddingLeft="#dimen/toolbar_text_margin_left"
android:paddingTop="#dimen/toolbar_text_margin_top"
tools:background="#color/colorPrimaryDark">
<TextView
android:id="#+id/tvName"
style="#style/TextAppearance.AppCompat.Headline"
android:layout_width="#dimen/toolbar_text_width"
android:layout_height="wrap_content"
android:text="Hello" />
<TextView
android:id="#+id/tvTime"
style="#style/TextAppearance.AppCompat.Body1"
android:layout_width="#dimen/toolbar_text_width"
android:layout_height="wrap_content"
android:layout_below="#id/tvName"
android:layout_marginTop="7dp"
android:text="04 Feb, Tuesday evening" />
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:listitem="#layout/item_dummy" />
</android.support.design.widget.CoordinatorLayout>
Using enterAlwaysCollapsed along with enterAlways avoids this issue but I want the full view to come back because in the actual app, the expanded section is way smaller.
Another thing that I have noticed is that, the height of the whitespace is equal to the height to the toolbar.
EDIT 1
I replaced exitUntilCollapsed with snap and then there wasn't any white space but then the toolbar doesn't pin and scrolls away
EDIT 2
Looks like this is an issue with the Design Library: CollapsingToolbarLayout enterAlways not supported
Temporary Workaround: Cheesesquare: enterAlways produces wrong layout
Perhaps that's because of:
enterAlways
Which the codepath/android_guides says:
enterAlways: The view will become visible when scrolling up. This flag
is useful in cases when scrolling from the bottom of a list and
wanting to expose the Toolbar as soon as scrolling up takes place.
Maybe you wanna try this: (standard way)
app:layout_scrollFlags="scroll|exitUntilCollapsed"
Honestly, I didn't see somebody is using enterAlways in CollapsingToolbarLayout in my whole development life.Especially, with those two flags:
app:layout_scrollFlags="scroll|exitUntilCollapsed|enterAlways"
Otherwise, It could be a bug and needs the Google's staffs to answer about it.
Context
I have a base activity which contains a drawer navigation from the example in android studio. I made the statusbar transparent and I want the menu to slide under it allowing its color to overflow into the transparency like this:
(notice the blue on the right)
However on default it looks like this:
Question
The blue color is from the theme colorPrimaryDark, however I want to dynamically change this color, so I can't rely on the theme. Is there any way to dynamically/programmatically set the color?
Things I've tried
Adjusting the color of the decor view; getWindow().getDecorView().setBackgroundColor(Color.White)
Setting color of the statusbar and use the flag
DRAWS_SYSTEM_BAR_BACKGROUNDS:
if (android.os.Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(Color.BLUE);
}
(Sorry for the poor coding block, it doesn't want to listen)
This will not make it transparent as the first image, but simply a solid color.
Changing the color of the rootView anyView.getRootView().setBackgroundColor()
XML file: root_controller.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:clipToPadding="false"
tools:openDrawer="end">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- toolbar -->
<include android:id="#+id/toolbar_group"
layout="#layout/toolbar"/>
<FrameLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
<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.support.v4.widget.DrawerLayout>
</RelativeLayout>
XML file toolbar:
<?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:layout_width="match_parent"
android:layout_height="52dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="52dp"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
RootController activity
public class RootController extends AppCompatActivity implements
NavigationView.OnNavigationItemSelectedListener {
#Override
public void setContentView(int layoutResID) {
rootView = getLayoutInflater().inflate(R.layout.root_controller, null);
drawer = (DrawerLayout)rootView.findViewById(R.id.drawer_layout);
FrameLayout frameLayout = (FrameLayout) drawer.findViewById(R.id.main_content);
targetView = getLayoutInflater().inflate(layoutResID, frameLayout, true);
initMenu(drawer);
super.setContentView(rootView);
}
private void initMenu(DrawerLayout drawer){
// get toolbar
toolbarGroup = rootView.findViewById(R.id.toolbar_group);
initToolbarGroup(toolbarGroup, "test");
// get the navigation view
nav = (NavigationView) drawer.findViewById(R.id.nav_view);
nav.setBackgroundColor(ColorDelegate.getNavColor());
Menu menu = nav.getMenu();
// set navigation listener
nav.setNavigationItemSelectedListener(this);
// ... fill menu
}
Try with this in your Activity:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
String dynamicColor = "#99000000";
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN); /*You were missing this*/
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(Color.parseColor(dynamicColor));
}
I have a quite simple layout and I animate the showing/hiding of the toolbars with the appended functions. I'm using AppCompat and Toolbars...
PROBLEM
One person reported that the top toolbar is never shown. Any ideas why? What could be the reason? It's working fine on my phone and others...
Function
public void showHideToolbar(boolean forceHide, boolean animate)
{
L.d(this, "showHideToolbar: " + mShowToolbar);
toolbar.clearAnimation();
toolbar2.clearAnimation();
if (mShowToolbar || forceHide)
{
if (animate) {
toolbar.animate().translationY(-toolbar.getBottom()).setInterpolator(new AccelerateInterpolator()).start();
toolbar2.animate().translationY(toolbar2.getBottom()).setInterpolator(new AccelerateInterpolator()).start();
}
else
{
toolbar.setTranslationY(-toolbar.getBottom());
toolbar2.setTranslationY(toolbar2.getBottom());
}
mShowToolbar = false;
}
else
{
if (animate) {
toolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator()).start();
toolbar2.animate().translationY(0).setInterpolator(new DecelerateInterpolator()).start();
}
else
{
toolbar.setTranslationY(0);
toolbar2.setTranslationY(0);
}
mShowToolbar = true;
}
}
Layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/flMain"
android:background="?attr/main_background_color"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:theme="?actionBarThemeStyle"
app:popupTheme="?actionBarPopupThemeStyle" />
<android.support.v4.view
android:id="#+id/vpSlides"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar2"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/bottom_bar_background"
android:elevation="0dp"
android:layout_alignParentBottom="true"
android:gravity="top|start"
app:theme="?actionBarThemeStyle"
app:popupTheme="?actionBarPopupThemeStyle" >
</android.support.v7.widget.Toolbar>
</RelativeLayout>
It seems like, even if you make a toolbar to an actionbar, you have to respect layout ordering in the xml. setSupportActionBar won't bring the action bar on top of the main layout...
So the simple solution was to reorder the toolbar to being under the content...
I never ad problems yet as normally I show the content underneath the toolbar, here I didn't want to that and therefore faced the problem