左/右と上/下の間のスワイプ方向を検出する方法
私の質問：ユーザーが指を上下に動かすのと左右に動かすのをどのように検出しますか（また、それらのグループのどの方向に指が動いたかを知るにはどうすればよいですか？）
私の状況：指を上下に動かしたときにアプリの明るさを変更したい（上=明るく、下=暗く）に基づいて、アクティビティやビューを切り替えたい彼らの左/右スワイプ。
SimpleOnGestureListenerクラスを拡張するだけで、
これをクラスで宣言し、
private static final int SWIPE_MIN_DISTANCE = 120;
private static final int SWIPE_MAX_OFF_PATH = 250;
private static final int SWIPE_THRESHOLD_VELOCITY = 200;
水平スワイプの例として、以下のコードを見ることができます、
class MyGestureDetector extends SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
try {
if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH){
return false;
}
// right to left swipe
if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE
&& Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
onLeftSwipe();
}
// left to right swipe
else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE
&& Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
onRightSwipe();
}
} catch (Exception e) {
}
return false;
}
}
これは、垂直スワイプの目的でも同様に行うことができます。
私はこのために簡単なクラスを書きました：それはよく文書化されているのでここでは説明しません
public class OnSwipeListener extends GestureDetector.SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
// Grab two events located on the plane at e1=(x1, y1) and e2=(x2, y2)
// Let e1 be the initial event
// e2 can be located at 4 different positions, consider the following diagram
// (Assume that lines are separated by 90 degrees.)
//
//
// \ A /
// \ /
// D e1 B
// / \
// / C \
//
// So if (x2,y2) falls in region:
// A => it's an UP swipe
// B => it's a RIGHT swipe
// C => it's a DOWN swipe
// D => it's a LEFT swipe
//
float x1 = e1.getX();
float y1 = e1.getY();
float x2 = e2.getX();
float y2 = e2.getY();
Direction direction = getDirection(x1,y1,x2,y2);
return onSwipe(direction);
}
/** Override this method. The Direction enum will tell you how the user swiped. */
public boolean onSwipe(Direction direction){
return false;
}
/**
* Given two points in the plane p1=(x1, x2) and p2=(y1, y1), this method
* returns the direction that an arrow pointing from p1 to p2 would have.
* @param x1 the x position of the first point
* @param y1 the y position of the first point
* @param x2 the x position of the second point
* @param y2 the y position of the second point
* @return the direction
*/
public Direction getDirection(float x1, float y1, float x2, float y2){
double angle = getAngle(x1, y1, x2, y2);
return Direction.fromAngle(angle);
}
/**
*
* Finds the angle between two points in the plane (x1,y1) and (x2, y2)
* The angle is measured with 0/360 being the X-axis to the right, angles
* increase counter clockwise.
*
* @param x1 the x position of the first point
* @param y1 the y position of the first point
* @param x2 the x position of the second point
* @param y2 the y position of the second point
* @return the angle between two points
*/
public double getAngle(float x1, float y1, float x2, float y2) {
double rad = Math.atan2(y1-y2,x2-x1) + Math.PI;
return (rad*180/Math.PI + 180)%360;
}
public enum Direction{
up,
down,
left,
right;
/**
* Returns a direction given an angle.
* Directions are defined as follows:
*
* Up: [45, 135]
* Right: [0,45] and [315, 360]
* Down: [225, 315]
* Left: [135, 225]
*
* @param angle an angle from 0 to 360 - e
* @return the direction of an angle
*/
public static Direction fromAngle(double angle){
if(inRange(angle, 45, 135)){
return Direction.up;
}
else if(inRange(angle, 0,45) || inRange(angle, 315, 360)){
return Direction.right;
}
else if(inRange(angle, 225, 315)){
return Direction.down;
}
else{
return Direction.left;
}
}
/**
* @param angle an angle
* @param init the initial bound
* @param end the final bound
* @return returns true if the given angle is in the interval [init, end).
*/
private static boolean inRange(double angle, float init, float end){
return (angle >= init) && (angle < end);
}
}
}
使用するには、単にOnSwipeListenerを拡張し、onSwipeメソッドをオーバーライドします
Fernandour 答えは完璧です。多くの人が探しているので、ActivityとFragmentでそれを使用する方法についてこの答えを書いています。
public class MyActivity extends Activity implements View.OnTouchListener{
private RelativeLayout someLayout;
//take any layout on which you want your gesture listener;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
gestureDetector=new GestureDetector(this,new OnSwipeListener(){
@Override
public boolean onSwipe(Direction direction) {
if (direction==Direction.up){
//do your stuff
Log.d(TAG, "onSwipe: up");
}
if (direction==Direction.down){
//do your stuff
Log.d(TAG, "onSwipe: down");
}
return true;
}
});
someLayout.setOnTouchListener(this);
}
@Override
public boolean onTouch(View v, MotionEvent event) {
Log.d(TAG, "onTouch: ");
gestureDetector.onTouchEvent(event);
return true;
}
}
使用例を fernandohur answer 上記の場合：
OnSwipeListenerをビューの1つに適用する場合：
このビューはどこでも-次のように、そのビューのタッチリスナーを設定します。
myview.setOnTouchListener(this);
アクティビティのOnCreateまたはカスタムビューコンストラクターで次の操作を行います。
// Global
private GestureDetectorCompat detector;
// In OnCreate or custome view constructor (which extends one of Android views)
detector = new GestureDetectorCompat(context, onSwipeListener);
次のように、同じクラスでonTouchイベントをオーバーライドします。
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
return detector.onTouchEvent(motionEvent);
}
また、同じクラスにこのリスナーオブジェクトがあります。
OnSwipeListener onSwipeListener = new OnSwipeListener() {
@Override
public boolean onSwipe(Direction direction) {
// Possible implementation
if(direction == Direction.left|| direction == Direction.right) {
// Do something COOL like animation or whatever you want
// Refer to your view if needed using a global reference
return true;
}
else if(direction == Direction.up|| direction == Direction.down) {
// Do something COOL like animation or whatever you want
// Refer to your view if needed using a global reference
return true;
}
return super.onSwipe(direction);
}
};
それが私がやった方法、最も簡単な方法です
float initialX, initialY;
@Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getActionMasked();
switch (action) {
case MotionEvent.ACTION_DOWN:
initialX = event.getX();
initialY = event.getY();
// Log.d(TAG, "Action was DOWN");
break;
case MotionEvent.ACTION_MOVE:
//Log.d(TAG, "Action was MOVE");
break;
case MotionEvent.ACTION_UP:
float finalX = event.getX();
float finalY = event.getY();
//Log.d(TAG, "Action was UP");
if (initialX < finalX) {
// Log.d(TAG, "Left to Right swipe performed");
}
if (initialX > finalX) {
// Log.d(TAG, "Right to Left swipe performed");
}
if (initialY < finalY) {
// Log.d(TAG, "Up to Down swipe performed");
}
if (initialY > finalY) {
// Log.d(TAG, "Down to Up swipe performed");
}
break;
case MotionEvent.ACTION_CANCEL:
//Log.d(TAG,"Action was CANCEL");
break;
case MotionEvent.ACTION_OUTSIDE:
// Log.d(TAG, "Movement occurred outside bounds of current screen element");
break;
}
return super.onTouchEvent(event);
}
私はこのように解決しました：
viewPager.setOnTouchListener(new View.OnTouchListener() {
float prevX = -1;
@Override
public boolean onTouch(View v, MotionEvent event) {
if (prevX != -1) {
if (event.getX() > prevX) {
if (viewPager.getCurrentItem() == 0) {
// Left to Right swipe
}
//Log.d("DEBUG", MotionEvent.ACTION_MOVE + ":" + event.getAction() + ":" + event.getActionMasked() + ":Left Swipe" + ":" + prevX + ":" + event.getX() + ":" + viewPager.getCurrentItem());
} else if (prevX > event.getX()) {
// Right to left swipe
//Log.d("DEBUG", MotionEvent.ACTION_MOVE + ":" + event.getAction() + ":" + event.getActionMasked() + ":Right Swipe" + ":" + prevX + ":" + event.getX() + ":" + viewPager.getCurrentItem());
}
}
if (event.getAction() == MotionEvent.ACTION_MOVE) {
prevX = event.getX();
} else {
prevX = -1;
}
return false;
}
});
@ Fernandour answerのKotlin実装を追加します。 Java @f arhan patelをご覧ください。
class ClientFragment : Fragment(), View.OnTouchListener {
private lateinit var gestureDetector: GestureDetector
override fun onTouch(v: View?, event: MotionEvent?): Boolean {
Log.d(TAG, "onTouch: ");
gestureDetector.onTouchEvent(event);
return true
}
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
...
gestureDetector = GestureDetector(activity, object : OnSwipeListener() {
override fun onSwipe(direction: Direction): Boolean {
when(direction){
Direction.up ->
{
Log.d(TAG, "onSwipe: up")
sendCommand("UP")
return true
}
Direction.down ->{
Log.d(TAG, "onSwipe: down")
sendCommand("DOWN")
return true
}
Direction.left ->
{
Log.d(TAG, "onSwipe: left")
sendCommand("LEFT")
return true
}
Direction.right ->{
Log.d(TAG, "onSwipe: right")
sendCommand("RIGHT")
return true
}
else -> {
}
}
return true
}
})
dpadLayout.setOnTouchListener(this)
利用可能な答えは、このような単純な問題には複雑すぎます。別のアプローチをお勧めします（コードはas3ですが、アイデアは得られます）：
var touchDistance:Number = Point.distance(_moveTouchPoint, _startTouchPoint);
if (touchDistance >= SWIPE_MIN_DISTANCE)
{
var xDiff:Number = _moveTouchPoint.x - _startTouchPoint.x;
var yDiff:Number = _moveTouchPoint.y - _startTouchPoint.y;
var yGreater:Boolean = Math.abs(yDiff) >= Math.abs(xDiff);
if (yGreater)
{
// direction is up or down
changePlayerDirectionTo(yDiff < 0 ? DIRECTION_UP : DIRECTION_DOWN);
}
else
{
// direction is left or right
changePlayerDirectionTo(xDiff < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT)
}
}
いずれの場合も、xまたはyの絶対値が大きくなり、特定の方向セットに解決できます。それ以降は、座標記号に依存して、どの方向を正確に検出することができます。
SimpleGestureListenerをオーバーライドして、現在の開始座標と終了座標の差分を計算できます。
private class GestureListener extends SimpleOnGestureListener {
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
if (e2.getY() > e1.getY()) {
// direction up
}else {
// direction down
}
if (e2.getX() > e1.getX()) {
// direction right
}else {
// direction left
}
return true;
}
}
私はこれを行うオープンソースのジェスチャーライブラリをbitbucketに持っています。このライブラリ内には「HGFling」クラスがあります。これは、投げ飛ばしの方向を検出する方法を示しています。ライブラリは、 https://bitbucket.org/warwick/hacergestov からダウンロードできます。オープンソースです。