Last active
June 8, 2016 11:11
-
-
Save vaibhav-jani/965018bf3d2f50e7ce93feb94362c72f to your computer and use it in GitHub Desktop.
Custom parallax collapsing toolbar
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?xml version="1.0" encoding="utf-8"?> | |
| <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" | |
| xmlns:app="http://schemas.android.com/apk/res-auto" | |
| xmlns:tools="http://schemas.android.com/tools" | |
| android:layout_width="match_parent" | |
| android:layout_height="match_parent" | |
| android:background="#dedede" | |
| tools:context="com.example.vaibhav.testingapp.MainActivity"> | |
| <com.example.vaibhav.testingapp.ObservableScrollView | |
| android:id="@+id/scroll_view" | |
| android:layout_width="match_parent" | |
| android:layout_height="match_parent"> | |
| <LinearLayout | |
| android:layout_width="match_parent" | |
| android:layout_height="match_parent" | |
| android:gravity="center_horizontal" | |
| android:orientation="vertical"> | |
| <LinearLayout | |
| android:id="@+id/llHeader" | |
| android:layout_width="match_parent" | |
| android:layout_height="256dp" | |
| android:gravity="center_horizontal" | |
| android:background="@drawable/home_profile_bg" | |
| android:orientation="vertical" | |
| android:paddingTop="?attr/actionBarSize"> | |
| <ImageView | |
| android:layout_height="150dp" | |
| android:layout_width="150dp" | |
| android:src="@drawable/shifu_action" | |
| android:id="@+id/iv"/> | |
| <TextView | |
| android:text="Some Player" | |
| android:textSize="24sp" | |
| android:textColor="#fff" | |
| android:textStyle="bold" | |
| android:layout_height="wrap_content" | |
| android:layout_width="wrap_content"/> | |
| </LinearLayout> | |
| <android.support.v7.widget.CardView | |
| android:layout_width="match_parent" | |
| android:layout_height="300dp" | |
| app:cardBackgroundColor="#fff" | |
| android:layout_marginLeft="10dp" | |
| android:layout_marginRight="10dp" | |
| android:layout_marginTop="10dp"> | |
| <LinearLayout | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:orientation="vertical"> | |
| <TextView | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:text="This text is part of first Cardview\n\n" | |
| android:textColor="#ff0000" | |
| android:textSize="20sp" /> | |
| </LinearLayout> | |
| </android.support.v7.widget.CardView> | |
| <android.support.v7.widget.CardView | |
| android:layout_width="match_parent" | |
| android:layout_height="400dp" | |
| app:cardBackgroundColor="#fff" | |
| android:layout_marginLeft="10dp" | |
| android:layout_marginRight="10dp" | |
| android:layout_marginTop="10dp"> | |
| <LinearLayout | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:orientation="vertical"> | |
| <TextView | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:text="This text is part of first Cardview\n\n" | |
| android:textColor="#ff0000" | |
| android:textSize="20sp" /> | |
| </LinearLayout> | |
| </android.support.v7.widget.CardView> | |
| <android.support.v7.widget.CardView | |
| android:layout_width="match_parent" | |
| android:layout_height="300dp" | |
| app:cardBackgroundColor="#fff" | |
| android:layout_marginLeft="10dp" | |
| android:layout_marginRight="10dp" | |
| android:layout_marginTop="10dp"> | |
| <LinearLayout | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:orientation="vertical"> | |
| <TextView | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:text="This text is part of first Cardview\n\n" | |
| android:textColor="#ff0000" | |
| android:textSize="20sp" /> | |
| </LinearLayout> | |
| </android.support.v7.widget.CardView> | |
| <android.support.v7.widget.CardView | |
| android:layout_width="match_parent" | |
| android:layout_height="400dp" | |
| app:cardBackgroundColor="#fff" | |
| android:layout_marginLeft="10dp" | |
| android:layout_marginRight="10dp" | |
| android:layout_marginTop="10dp"> | |
| <LinearLayout | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:orientation="vertical"> | |
| <TextView | |
| android:layout_width="match_parent" | |
| android:layout_height="wrap_content" | |
| android:text="This text is part of first Cardview\n\n" | |
| android:textColor="#ff0000" | |
| android:textSize="20sp" /> | |
| </LinearLayout> | |
| </android.support.v7.widget.CardView> | |
| </LinearLayout> | |
| </com.example.vaibhav.testingapp.ObservableScrollView> | |
| <android.support.v7.widget.Toolbar | |
| android:id="@+id/toolbar" | |
| android:layout_width="match_parent" | |
| android:layout_height="?attr/actionBarSize" | |
| app:layout_collapseMode="pin" | |
| app:theme="@style/ActionbarTheme" /> | |
| </RelativeLayout> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| package com.example.vaibhav.testingapp; | |
| import android.graphics.drawable.ColorDrawable; | |
| import android.support.v7.widget.Toolbar; | |
| import android.view.Menu; | |
| import android.view.animation.AccelerateInterpolator; | |
| import android.view.animation.DecelerateInterpolator; | |
| import com.utils.Logger; | |
| import com.utils.PixelUtils; | |
| public class ExampleActivity extends BaseActivity { | |
| private int lastScrolledPosition = 0; | |
| @Override | |
| protected int getContentView() { | |
| return R.layout.activity_main; | |
| } | |
| @Override | |
| protected void initViews() { | |
| final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); | |
| setSupportActionBar(toolbar); | |
| setTitle("Toolbar title"); | |
| getSupportActionBar().setDisplayHomeAsUpEnabled(true); | |
| final ColorDrawable cd = new ColorDrawable(getResources().getColor(R.color.main_bg)); | |
| toolbar.setBackgroundDrawable(cd); | |
| cd.setAlpha(0); | |
| final int MAX_SCROLL = PixelUtils.dpToPx(220); | |
| final ScrollViewX scrollView = (ScrollViewX) findViewById(R.id.scroll_view); | |
| if (scrollView != null) { | |
| scrollView.setOnScrollViewListener(new ScrollViewX.OnScrollViewListener() { | |
| @Override | |
| public void onScrollChanged(ScrollViewX v, int l, int t, int oldl, int oldt) { | |
| int scrollY = v.getScrollY(); | |
| cd.setAlpha(getAlphaforActionBar(scrollY)); | |
| int diff = scrollY - lastScrolledPosition; | |
| if (Math.abs(diff) > 10) { | |
| if (diff > 0) { | |
| if (scrollY > MAX_SCROLL) { | |
| //toolbar.setVisibility(View.GONE); | |
| //getSupportActionBar().hide(); | |
| toolbar.animate().translationY(-toolbar.getBottom()).setInterpolator(new AccelerateInterpolator()).start(); | |
| } | |
| } else { | |
| //toolbar.setVisibility(View.VISIBLE); | |
| //getSupportActionBar().show(); | |
| toolbar.animate().translationY(0).setInterpolator(new DecelerateInterpolator()).start(); | |
| } | |
| } | |
| lastScrolledPosition = scrollY; | |
| /*RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) toolbar.getLayoutParams(); | |
| layoutParams.topMargin = layoutParams.topMargin - scrollY; | |
| if(layoutParams.topMargin < layoutParams.height) { | |
| layoutParams.topMargin = - layoutParams.height; | |
| } | |
| toolbar.setLayoutParams(layoutParams); | |
| toolbar.requestLayout();*/ | |
| } | |
| private int getAlphaforActionBar(int scrollY) { | |
| int minDist = 0, maxDist = MAX_SCROLL; | |
| Logger.d("Jani scrollY", "Jani : " + scrollY); | |
| if (scrollY > maxDist) { | |
| return 255; | |
| } else if (scrollY < minDist) { | |
| return 0; | |
| } else { | |
| int alpha = 0; | |
| alpha = (int) ((255.0 / maxDist) * scrollY); | |
| return alpha; | |
| } | |
| } | |
| }); | |
| } | |
| } | |
| @Override | |
| protected void setTextLabels() { | |
| } | |
| @Override | |
| protected void loadData() { | |
| } | |
| @Override | |
| public boolean onCreateOptionsMenu(Menu menu) { | |
| getMenuInflater().inflate(R.menu.menu_home, menu); | |
| return true; | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| package com.example.vaibhav.testingapp; | |
| import android.content.Context; | |
| import android.util.AttributeSet; | |
| import android.widget.ScrollView; | |
| public class ScrollViewX extends ScrollView { | |
| private OnScrollViewListener mOnScrollViewListener; | |
| public ScrollViewX(Context context) { | |
| super(context); | |
| } | |
| public ScrollViewX(Context context, AttributeSet attrs) { | |
| super(context, attrs); | |
| } | |
| public ScrollViewX(Context context, AttributeSet attrs, int defStyle) { | |
| super(context, attrs, defStyle); | |
| } | |
| public interface OnScrollViewListener { | |
| void onScrollChanged(ScrollViewX v, int l, int t, int oldl, int oldt); | |
| } | |
| public void setOnScrollViewListener(OnScrollViewListener l) { | |
| this.mOnScrollViewListener = l; | |
| } | |
| protected void onScrollChanged(int l, int t, int oldl, int oldt) { | |
| mOnScrollViewListener.onScrollChanged(this, l, t, oldl, oldt); | |
| super.onScrollChanged(l, t, oldl, oldt); | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment