如何实现滑动事件动画(例如更改alpha)视图?

时间:2016-01-19 11:21:42

标签: android android-animation android-gesture

在我的应用程序中,我希望当用户从底部向上滑动时,ImageView的alpha值应该减少到某个点,同样如果用户从上到下滑动,alpha应该增加到1.我尝试过很多事情仍然没有成功

代码

 gestureDetector = new GestureDetector(this, new GestureDetector.SimpleOnGestureListener());


        GestureDetector.SimpleOnGestureListener simpleOnGestureListener = new GestureDetector.SimpleOnGestureListener() {

            @Override
            public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

                float distanceX = 0;
                float distanceY = 0;

                try {

                    distanceX = e2.getX() - e1.getX();
                    distanceY = e2.getY() - e1.getY();

                } catch (Exception e) {

                }


                if (Math.abs(distanceY) > Math.abs(distanceX) && Math.abs(distanceY) > THRESHOLD && Math.abs(velocityY) > VELOCITY) {

                    if (distanceY > 0) {

                        //increase the alpha

                    } else {

                        //reduce the alpha


                    }
                    return true;

                }

                return false;


            }

        };

        gestureDetector = new GestureDetector(this, simpleOnGestureListener);

    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        // TODO Auto-generated method stub
        return gestureDetector.onTouchEvent(event);
    }

3 个答案:

答案 0 :(得分:1)

试试这段代码。它对我有用。

修改 首先定义mAlpha实例变量然后复制并粘贴以下代码并尝试。

private float mAlpha = 1;

ImageView img = (ImageView) findViewById(R.id.img);
img.setOnTouchListener(new View.OnTouchListener() {
            float mDownY;
            private int mSwipeSlop = -1;

            @Override
            public boolean onTouch(final View v, MotionEvent event) {
                if (mSwipeSlop < 0) {
                    mSwipeSlop = ViewConfiguration.get(MainActivity.this).getScaledTouchSlop();
                }
                switch (event.getAction()) {
                    case MotionEvent.ACTION_DOWN:
                        if (mItemPressed) {
                            // Multi-item swipes not handled
                            return false;
                        }
                        mItemPressed = true;
                        mDownY = event.getY();
                        break;
                    case MotionEvent.ACTION_CANCEL:
                        mItemPressed = false;
                        break;
                    case MotionEvent.ACTION_MOVE:
                    {
                         float y = event.getY() + v.getTranslationY();
                         float deltaY = y - mDownY;
                         if (!mSwiping) {
                            if (deltaY > mSwipeSlop) {
                               mSwiping = true;
                            }
                         }
                         if (mSwiping) {
                            if (mAlpha > 1) {
                               mAlpha = 1;
                            } else if (mAlpha < 0) {
                               mAlpha = 0;
                            }
                            v.setAlpha(mAlpha);
                            mAlpha = mAlpha - deltaY / v.getWidth();
                        }
                    }
                    break;
                    case MotionEvent.ACTION_UP: {
                        mItemPressed = false;
                    }
                    break;
                    default:
                        return false;
                }
                return true;
            }
        });

答案 1 :(得分:0)

@TdSoft回答对我有用......但它只适用于向下滑动。为了使其适用于向上和向下滑动操作,我已经改变了这一点。

case MotionEvent.ACTION_MOVE: {
float y = event.getY() + v.getTranslationY();
float deltaY = y - mDownY;
float deltaYAbs = deltaY;
boolean mSwiping = false;
float mAlpha = 1 - deltaYAbs / v.getWidth();
if (!mSwiping) {
    mSwiping = true;                    
    if (deltaYAbs > mSwipeSlop) {                    
    mAlpha = 1 - deltaYAbs / v.getWidth();                        
    } else {                    
    mAlpha = 1 + deltaYAbs / v.getWidth();                        
    }
}                
if (mSwiping) {
    v.setAlpha(mAlpha); 
}
break;                               

答案 2 :(得分:0)

它只是一个黑客。您可以尝试此代码并可以对其进行改进。

我的想法是,我只是在SeekBar下使用Verticle ImageView并使用SeekBar progressValue来设置图片alpha。(注意:我通过在xml中旋转270来制作Seekbar垂直。

<强> Test.java

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.util.Log;
import android.widget.ImageView;
import android.widget.SeekBar;

public class Test extends AppCompatActivity {

    private SeekBar seekBar;
    private ImageView imageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        imageView = (ImageView) findViewById(R.id.img);

        seekBar = (SeekBar) findViewById(R.id.seekBar1);
        seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                float val = ((float) (100 - progress));
                val = (float) ((val / 100) + 0.3); // minimum alpha is 0.3. you can change it. 
                if (val < 1.00) {
                    Log.e("progress", "" + val);
                    imageView.setAlpha(val);

                }
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {
            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {
            }


        });
    }


}

<强> activity_test.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/seekBarPrefBarContainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <SeekBar
        android:id="@+id/seekBar1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:rotation="270" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white">

        <ImageView
            android:id="@+id/img"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/yourdrawable" />
    </LinearLayout>

</RelativeLayout>