Explorar o código

完美平移动画

詹子聪 %!s(int64=6) %!d(string=hai) anos
pai
achega
87c688b530

+ 25 - 7
app/src/main/java/com/itant/shibei/ui/TabActivity.java

@@ -17,6 +17,7 @@ import com.itant.shibei.ui.home.GoodsFragment;
 import com.itant.shibei.ui.mine.MineActivity;
 import com.itant.shibei.widget.AppbarTranslateListener;
 import com.miekir.common.adapter.TabFragmentAdapter;
+import com.miekir.common.utils.ToastTool;
 import com.miekir.common.utils.ViewTool;
 
 import java.util.ArrayList;
@@ -47,18 +48,21 @@ public class TabActivity extends BaseShiBeiActivity implements View.OnClickListe
         SlidingTabLayout stl_home = findViewById(R.id.stl_home);
         stl_home.setViewPager(vp_main, titles);
 
-        ViewTool.setOnClickListener(this, new int[]{R.id.rl_search_top, R.id.rl_more}, this);
+        ViewTool.setOnClickListener(this, new int[]{R.id.rl_search,
+                R.id.rl_search_top, R.id.rl_search_top_shadow, R.id.rl_more}, this);
 
-        double defaultImageSize = getResources().getDimension(R.dimen.size_image_s);
+        double defaultHeight = getResources().getDimension(R.dimen.height_sliding_tab);
         double defaultWidth = getResources().getDimension(R.dimen.height_edit_text);
-        View rl_search = findViewById(R.id.rl_search);
-        View iv_search = findViewById(R.id.iv_search);
+
         View rl_search_top = findViewById(R.id.rl_search_top);
-        View iv_search_top = findViewById(R.id.iv_search_top);
+        View rl_search_top_shadow = findViewById(R.id.rl_search_top_shadow);
+        View rl_search = findViewById(R.id.rl_search);
         // 搜索图标动画
         AppBarLayout abl_main = findViewById(R.id.abl_main);
-        AppbarTranslateListener listener = new AppbarTranslateListener(defaultWidth, defaultImageSize,
-                rl_search_top, iv_search_top, rl_search, iv_search);
+        AppbarTranslateListener listener = new AppbarTranslateListener(
+                this,
+                defaultWidth, defaultHeight,
+                rl_search_top, rl_search_top_shadow, rl_search);
         abl_main.addOnOffsetChangedListener(listener);
     }
 
@@ -70,6 +74,20 @@ public class TabActivity extends BaseShiBeiActivity implements View.OnClickListe
             case R.id.rl_more:
                 startActivity(new Intent(this, MineActivity.class));
                 break;
+
+            case R.id.rl_search_top:
+                ToastTool.showShort("search top");
+                break;
+
+            case R.id.rl_search_top_shadow:
+                ToastTool.showShort("search top shadow");
+                break;
+
+            case R.id.rl_search:
+                ToastTool.showShort("search ");
+                break;
+
+
             default:
                 break;
         }

+ 61 - 26
app/src/main/java/com/itant/shibei/widget/AppbarTranslateListener.java

@@ -1,6 +1,9 @@
 package com.itant.shibei.widget;
 
+import android.animation.ObjectAnimator;
+import android.app.Activity;
 import android.view.View;
+import android.view.ViewGroup;
 
 import com.google.android.material.appbar.AppBarLayout;
 
@@ -15,29 +18,32 @@ public class AppbarTranslateListener implements AppBarLayout.OnOffsetChangedList
     private static final int STATUS_CLOSE = 1;
     private static final int STATUS_OPEN = 2;
     private static final int STATUS_MOVE = 3;
-
-    private double mDefaultImageSize;
-    private double mDefaultWidth;
     /**
      * 1. 完全关闭 2. 完全打开 3.运动中
      */
     private int mLastStatus = STATUS_CLOSE;
 
+    private double mDefaultHeight;
+    private double mDefaultWidth;
+
+    private ViewGroup mViewGroup;
     private View rl_search_top;
+    private View rl_search_top_shadow;
     private View rl_search;
-    private View iv_search_top;
-    private View iv_search;
 
     private long mLastAnimateMillis;
 
-    public AppbarTranslateListener(double defaultWidth, double defaultImageSize, View rl_search_top,
-                                   View iv_search_top, View rl_search, View iv_search) {
+    public AppbarTranslateListener(Activity activity,
+                                   double defaultWidth, double defaultHeight,
+                                   View rl_search_top, View rl_search_top_shadow,
+                                   View rl_search) {
+        mViewGroup = (ViewGroup) activity.getWindow().getDecorView();
+
         mDefaultWidth = defaultWidth;
-        mDefaultImageSize = defaultImageSize;
+        mDefaultHeight = defaultHeight;
         this.rl_search = rl_search;
         this.rl_search_top = rl_search_top;
-        this.iv_search = iv_search;
-        this.iv_search_top = iv_search_top;
+        this.rl_search_top_shadow = rl_search_top_shadow;
     }
 
     @Override
@@ -55,31 +61,36 @@ public class AppbarTranslateListener implements AppBarLayout.OnOffsetChangedList
         if (reFraction < 0.007) {
             // 完全折叠
             if (mLastStatus != STATUS_CLOSE) {
-                rl_search_top.setVisibility(View.GONE);
+                mViewGroup.getOverlay().remove(rl_search_top);
                 rl_search.setVisibility(View.VISIBLE);
                 mLastStatus = STATUS_CLOSE;
             } else {
                 return;
             }
-
-        } else if (reFraction > 0.988) {
-            // 完全展开
-            if (mLastStatus != STATUS_OPEN) {
-                rl_search.setVisibility(View.GONE);
-                rl_search_top.setVisibility(View.VISIBLE);
-                mLastStatus = STATUS_OPEN;
+        } else {
+            rl_search.setVisibility(View.GONE);
+            if (reFraction > 0.988) {
+                // 完全展开
+                if (mLastStatus != STATUS_OPEN) {
+                    mLastStatus = STATUS_OPEN;
+                    rl_search.setVisibility(View.GONE);
+                    rl_search_top_shadow.setVisibility(View.VISIBLE);
+                    mViewGroup.getOverlay().add(rl_search_top);
+                } else {
+                    return;
+                }
             } else {
-                return;
-            }
-        } /*else {
-            if (mLastStatus != STATUS_MOVE) {
-                rl_search.setVisibility(View.VISIBLE);
-                rl_search_top.setVisibility(View.VISIBLE);
-                mLastStatus = STATUS_MOVE;
+                // 移动中
+                if (mLastStatus != STATUS_MOVE) {
+                    mLastStatus = STATUS_MOVE;
+                    rl_search_top_shadow.setVisibility(View.GONE);
+                }
             }
         }
 
-        double searchSize = mDefaultImageSize * fraction;
+        followFinger(fraction);
+
+        /*double searchSize = mDefaultImageSize * fraction;
         ViewGroup.LayoutParams searchParams = iv_search.getLayoutParams();
         searchParams.width = (int) searchSize;
         searchParams.height = (int) searchSize;
@@ -91,4 +102,28 @@ public class AppbarTranslateListener implements AppBarLayout.OnOffsetChangedList
         topSearchParams.height = (int) topSearchSize;
         iv_search_top.requestLayout();*/
     }
+
+
+
+
+    private void followFinger(float fraction) {
+        // 完全展开时fraction为0,所以实时translationX为mDefaultWidth*fraction,
+        // translationY为mDefaultHeight*fraction
+
+        // add之后,要紧接动画
+        mViewGroup.getOverlay().add(rl_search_top);
+        // 横向移动
+        ObjectAnimator tranXAnim = ObjectAnimator.ofFloat(rl_search_top, "translationX", (float) (mDefaultWidth*fraction));
+        tranXAnim.setDuration(0);
+        // 纵向移动
+        //ObjectAnimator tranYAnim = ObjectAnimator.ofFloat(rl_search_top, "translationY", (float) (mDefaultHeight*fraction));
+        //tranYAnim.setDuration(0);
+
+        tranXAnim.start();
+
+        // 一起做运动
+        //AnimatorSet set = new AnimatorSet();
+        //set.playTogether(tranXAnim, tranYAnim);
+        //set.start();
+    }
 }

+ 35 - 16
app/src/main/res/layout/activity_tab.xml

@@ -13,8 +13,7 @@
         <!--android:minHeight="?actionBarSize"水波纹居中和gravity属性有关-->
         <LinearLayout
             android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:minHeight="?actionBarSize"
+            android:layout_height="@dimen/height_sliding_tab"
             android:paddingStart="@dimen/margin_default"
             android:orientation="horizontal"
             app:layout_scrollFlags="scroll|enterAlways|snap"
@@ -43,20 +42,40 @@
                 android:layout_height="wrap_content"
                 android:layout_weight="1"/>
 
-            <RelativeLayout
-                android:id="@+id/rl_search_top"
-                android:layout_width="@dimen/height_edit_text"
-                android:layout_height="@dimen/height_sliding_tab"
-                android:background="?attr/selectableItemBackgroundBorderless">
-                <!--无边界波纹-->
-                <ImageView
-                    android:id="@+id/iv_search_top"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:layout_centerInParent="true"
-                    android:src="@drawable/ic_search"
-                    android:tint="@color/black_theme" />
-            </RelativeLayout>
+
+            <FrameLayout
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content">
+                <RelativeLayout
+                    android:id="@+id/rl_search_top"
+                    android:layout_width="@dimen/height_edit_text"
+                    android:layout_height="@dimen/height_sliding_tab"
+                    android:background="?attr/selectableItemBackgroundBorderless">
+                    <!--无边界波纹-->
+                    <ImageView
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:layout_centerInParent="true"
+                        android:src="@drawable/ic_search"
+                        android:tint="@color/black_theme" />
+                </RelativeLayout>
+
+                <!--由于作为ViewOverlay的View不再触发点击事件,就用一个影子View来代替-->
+                <RelativeLayout
+                    android:id="@+id/rl_search_top_shadow"
+                    android:layout_width="@dimen/height_edit_text"
+                    android:layout_height="@dimen/height_sliding_tab"
+                    android:background="?attr/selectableItemBackgroundBorderless">
+                    <!--无边界波纹-->
+                    <ImageView
+                        android:id="@+id/iv_search_top"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:layout_centerInParent="true"
+                        android:src="@drawable/ic_search"
+                        android:tint="@color/black_theme" />
+                </RelativeLayout>
+            </FrameLayout>
 
             <RelativeLayout
                 android:id="@+id/rl_more"