Fix silly bug with dribble FAB position.

WeRockStar · Jul 13, 2016 · 6e4d52a · 6e4d52a
1 parent 88716e2
commit 6e4d52a
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 35 deletions.
diff --git a/app/src/main/java/io/plaidapp/ui/DribbbleShot.java b/app/src/main/java/io/plaidapp/ui/DribbbleShot.java
@@ -95,6 +95,7 @@
 import io.plaidapp.util.ColorUtils;
 import io.plaidapp.util.HtmlUtils;
 import io.plaidapp.util.ImeUtils;
+import io.plaidapp.util.ViewOffsetHelper;
 import io.plaidapp.util.ViewUtils;
 import io.plaidapp.util.customtabs.CustomTabActivityHelper;
 import io.plaidapp.util.glide.CircleTransform;
@@ -682,14 +683,7 @@ private void enterAnimation() {
             viewEnterAnimation(description, offset, interp);
         }
         offset *= 1.5f;
-        float fabTransY = fab.getTranslationY();
-        fab.setAlpha(0f);
-        fab.setTranslationY(fabTransY + offset);
-        fab.animate()
-                .translationY(fabTransY)
-                .setDuration(600)
-                .setInterpolator(interp)
-                .start();
+        fabEnterAnimation(interp, offset);
         offset *= 1.5f;
         viewEnterAnimation(shotActions, offset, interp);
         offset *= 1.5f;
@@ -698,18 +692,9 @@ private void enterAnimation() {
         viewEnterAnimation(shotTimeAgo, offset, interp);
         back.animate()
                 .alpha(1f)
-                .setDuration(600)
+                .setDuration(600L)
                 .setInterpolator(interp)
                 .start();
-
-        Animator showFab = ObjectAnimator.ofPropertyValuesHolder(fab,
-                PropertyValuesHolder.ofFloat(View.ALPHA, 0f, 1f),
-                PropertyValuesHolder.ofFloat(View.SCALE_X, 0f, 1f),
-                PropertyValuesHolder.ofFloat(View.SCALE_Y, 0f, 1f));
-        showFab.setStartDelay(300L);
-        showFab.setDuration(300L);
-        showFab.setInterpolator(getLinearOutSlowInInterpolator(this));
-        showFab.start();
     }
 
     private void viewEnterAnimation(View view, float offset, Interpolator interp) {
@@ -718,12 +703,49 @@ private void viewEnterAnimation(View view, float offset, Interpolator interp) {
         view.animate()
                 .translationY(0f)
                 .alpha(1f)
-                .setDuration(600)
+                .setDuration(600L)
                 .setInterpolator(interp)
                 .setListener(null)
                 .start();
     }
 
+    private void fabEnterAnimation(Interpolator interp, int offset) {
+        // FAB should enter upwards with content and also scale/fade. As the FAB uses
+        // translationY to position itself on the title seam, we can animating this property.
+        // Instead animate the view's layout position (which is a bit more involved).
+        final ViewOffsetHelper fabOffset = new ViewOffsetHelper(fab);
+        final View.OnLayoutChangeListener fabLayout = new View.OnLayoutChangeListener() {
+            @Override
+            public void onLayoutChange(View v, int left, int top, int right, int bottom, int
+                    oldLeft, int oldTop, int oldRight, int oldBottom) {
+                fabOffset.onViewLayout();
+            }
+        };
+
+        fab.addOnLayoutChangeListener(fabLayout);
+        fabOffset.setTopAndBottomOffset(offset);
+        Animator fabMovement = ObjectAnimator.ofInt(fabOffset, ViewOffsetHelper.OFFSET_Y, 0);
+        fabMovement.setDuration(600L);
+        fabMovement.setInterpolator(interp);
+        fabMovement.addListener(new AnimatorListenerAdapter() {
+            @Override
+            public void onAnimationEnd(Animator animation) {
+                fab.removeOnLayoutChangeListener(fabLayout);
+            }
+        });
+        fabMovement.start();
+
+        fab.setAlpha(0f);
+        Animator showFab = ObjectAnimator.ofPropertyValuesHolder(fab,
+                PropertyValuesHolder.ofFloat(View.ALPHA, 0f, 1f),
+                PropertyValuesHolder.ofFloat(View.SCALE_X, 0f, 1f),
+                PropertyValuesHolder.ofFloat(View.SCALE_Y, 0f, 1f));
+        showFab.setStartDelay(300L);
+        showFab.setDuration(300L);
+        showFab.setInterpolator(getLinearOutSlowInInterpolator(this));
+        showFab.start();
+    }
+
     private void doLike() {
         performingLike = true;
         if (fab.isChecked()) {

diff --git a/app/src/main/java/io/plaidapp/ui/widget/FABToggle.java b/app/src/main/java/io/plaidapp/ui/widget/FABToggle.java
@@ -21,8 +21,6 @@
 import android.widget.Checkable;
 import android.widget.ImageButton;
 
-import io.plaidapp.util.ViewOffsetHelper;
-
 /**
  * A {@link Checkable} {@link ImageButton} which can be offset vertically.
  */
@@ -32,19 +30,15 @@ public class FABToggle extends ImageButton implements Checkable {
 
     private boolean isChecked = false;
     private int minOffset;
-    private int offset = 0;
-    private ViewOffsetHelper offsetHelper;
 
     public FABToggle(Context context, AttributeSet attrs) {
         super(context, attrs);
-        offsetHelper = new ViewOffsetHelper(this);
     }
 
-    public void setOffset(int newOffset) {
-        if (newOffset != offset) {
-            newOffset = Math.max(minOffset, newOffset);
-            offsetHelper.setTopAndBottomOffset(newOffset);
-            postInvalidateOnAnimation();
+    public void setOffset(int offset) {
+        if (offset != getTranslationY()) {
+            offset = Math.max(minOffset, offset);
+            setTranslationY(offset);
         }
     }
 
@@ -75,10 +69,4 @@ public int[] onCreateDrawableState(int extraSpace) {
         }
         return drawableState;
     }
-
-    @Override
-    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
-        super.onLayout(changed, left, top, right, bottom);
-        offsetHelper.onViewLayout();
-    }
 }