ניהול אירועי מגע ב-ViewGroup

חשוב להיזהר בטיפול באירועי מגע ב-ViewGroup, כי לרוב ל-ViewGroup יש צאצאים שהם מטרות לאירועי מגע שונים מאלה של ה-ViewGroup עצמו. כדי לוודא שכל תצוגה מקבלת בצורה נכונה את אירועי המגע שמיועדים לה, צריך לשנות את השיטה onInterceptTouchEvent().

יירוט אירועי מגע ב-ViewGroup

השיטה onInterceptTouchEvent() נקראת בכל פעם שזוהה אירוע מגע על פני השטח של ViewGroup, כולל על פני השטח של הצאצאים שלו. אם הפונקציה onInterceptTouchEvent() מחזירה את הערך true, הקריאה ל-MotionEvent נתפסת, כלומר היא לא מועברת לצאצא אלא ל-method‏ onTouchEvent() של ההורה.

השיטה onInterceptTouchEvent() מאפשרת להורה לראות אירועי מגע לפני שהילדים שלו רואים אותם. אם מחזירים את הערך true מ-onInterceptTouchEvent(), תצוגת הצאצא שהייתה מטפלת באירועי המגע מקבלת את הערך ACTION_CANCEL, והאירועים מאותו רגע ואילך נשלחים לשיטה onTouchEvent() של ההורה לטיפול הרגיל. הפקודה onInterceptTouchEvent() יכולה גם להחזיר את הפקודה false ולרגל אחרי אירועים במהלך היררכיית התצוגות, בהתאם ליעדים הרגילים שלהם, שמטפלים באירועים באמצעות onTouchEvent() משלהם.

בקטע הקוד הבא, הכיתה MyViewGroup היא תת-מחלקה של ViewGroup. MyViewGroup מכיל מספר צפיות צאצא. אם גוררים את האצבע על פני תצוגת צאצא לרוחב, תצוגת הצאצא לא מקבלת יותר אירועי מגע ו-MyViewGroup מטפל באירועי מגע על ידי גלילה של התוכן שלה. עם זאת, אם מקישים על לחצנים בתצוגת הצאצא או גוללים בתצוגת הצאצא אנכית, אירועי המגע האלה לא ייחסמו על ידי האב כי הצאצא הוא היעד המיועד. במקרים כאלה, onInterceptTouchEvent() מחזירה את הערך false ולא מתבצעת קריאה לפונקציה onTouchEvent() של הכיתה MyViewGroup.

class MyViewGroup @JvmOverloads constructor(
        context: Context,
        private val mTouchSlop: Int = ViewConfiguration.get(context).scaledTouchSlop
) : ViewGroup(context) {
    ...
    override fun onInterceptTouchEvent(ev: MotionEvent): Boolean {
        // This method only determines whether you want to intercept the motion.
        // If this method returns true, onTouchEvent is called and you can do
        // the actual scrolling there.
        return when (ev.actionMasked) {
            // Always handle the case of the touch gesture being complete.
            MotionEvent.ACTION_CANCEL, MotionEvent.ACTION_UP -> {
                // Release the scroll.
                mIsScrolling = false
                false // Don't intercept the touch event. Let the child handle it.
            }
            MotionEvent.ACTION_MOVE -> {
                if (mIsScrolling) {
                    // You're currently scrolling, so intercept the touch event.
                    true
                } else {

                    // If the user drags their finger horizontally more than the
                    // touch slop, start the scroll.

                    // Left as an exercise for the reader.
                    val xDiff: Int = calculateDistanceX(ev)

                    // Touch slop is calculated using ViewConfiguration constants.
                    if (xDiff > mTouchSlop) {
                        // Start scrolling!
                        mIsScrolling = true
                        true
                    } else {
                        false
                    }
                }
            }
            ...
            else -> {
                // In general, don't intercept touch events. The child view
                // handles them.
                false
            }
        }
    }

    override fun onTouchEvent(event: MotionEvent): Boolean {
        // Here, you actually handle the touch event. For example, if the action
        // is ACTION_MOVE, scroll this container. This method is only called if
        // the touch event is intercepted in onInterceptTouchEvent.
        ...
    }
}

public class MyViewGroup extends ViewGroup {

    private int mTouchSlop;
    ...
    ViewConfiguration vc = ViewConfiguration.get(view.getContext());
    mTouchSlop = vc.getScaledTouchSlop();
    ...
    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        // This method only determines whether you want to intercept the motion.
        // If this method returns true, onTouchEvent is called and you can do
        // the actual scrolling there.

        final int action = MotionEventCompat.getActionMasked(ev);

        // Always handle the case of the touch gesture being complete.
        if (action == MotionEvent.ACTION_CANCEL || action == MotionEvent.ACTION_UP) {
            // Release the scroll.
            mIsScrolling = false;
            return false; // Don't intercept touch event. Let the child handle it.
        }

        switch (action) {
            case MotionEvent.ACTION_MOVE: {
                if (mIsScrolling) {
                    // You're currently scrolling, so intercept the touch event.
                    return true;
                }

                // If the user drags their finger horizontally more than the
                // touch slop, start the scroll.

                // Left as an exercise for the reader.
                final int xDiff = calculateDistanceX(ev);

                // Touch slop is calculated using ViewConfiguration constants.
                if (xDiff > mTouchSlop) {
                    // Start scrolling.
                    mIsScrolling = true;
                    return true;
                }
                break;
            }
            ...
        }

        // In general, don't intercept touch events. The child view handles them.
        return false;
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        // Here, you actually handle the touch event. For example, if the
        // action is ACTION_MOVE, scroll this container. This method is only
        // called if the touch event is intercepted in onInterceptTouchEvent.
        ...
    }
}

שימו לב ש-ViewGroup מספק גם שיטה requestDisallowInterceptTouchEvent(). ה-ViewGroup קורא לשיטה הזו כשהילד לא רוצה שהאב והאבות הקדמונים שלו יפריעו לאירועי מגע באמצעות onInterceptTouchEvent().

עיבוד אירועי ACTION_OUTSIDE

אם ViewGroup מקבל MotionEvent עם ACTION_OUTSIDE, האירוע לא נשלח לצאצאים שלו כברירת מחדל. כדי לעבד MotionEvent עם ACTION_OUTSIDE, צריך לשנות את dispatchTouchEvent(MotionEvent event) כדי לשלוח אותו ל-View המתאים או לטפל בו ב-Window.Callback הרלוונטי – לדוגמה, Activity.

שימוש בקבועים של ViewConfiguration

קטע הקוד הקודם משתמש ב-ViewConfiguration הנוכחי כדי לאתחל משתנה בשם mTouchSlop. אפשר להשתמש בכיתה ViewConfiguration כדי לגשת למרחקים, למהירויות ולזמנים נפוצים שבהם נעשה שימוש במערכת Android.

'הזזה לא מכוונת' מתייחסת למרחק בפיקסלים שהמשתמש יכול לזוז ממנו במהלך המגע לפני שהמחווה תפורש כגלילה. בדרך כלל משתמשים ב-Touch Slop כדי למנוע גלילה מקרית כשהמשתמש מבצע פעולת מגע אחרת, כמו מגע ברכיבים במסך.

שתי שיטות נפוצות נוספות של ViewConfiguration הן getScaledMinimumFlingVelocity() ו-getScaledMaximumFlingVelocity(). השיטות האלה מחזירות את המהירות המינימלית והמהירות המקסימלית, בהתאמה, כדי להתחיל תנועה מהירה, שנמדדת בפיקסלים לשנייה. לדוגמה:

private val vc: ViewConfiguration = ViewConfiguration.get(context)
private val mSlop: Int = vc.scaledTouchSlop
private val mMinFlingVelocity: Int = vc.scaledMinimumFlingVelocity
private val mMaxFlingVelocity: Int = vc.scaledMaximumFlingVelocity
...
MotionEvent.ACTION_MOVE -> {
    ...
    val deltaX: Float = motionEvent.rawX - mDownX
    if (Math.abs(deltaX) > mSlop) {
        // A swipe occurs, do something.
    }
    return false
}
...
MotionEvent.ACTION_UP -> {
    ...
    if (velocityX in mMinFlingVelocity..mMaxFlingVelocity && velocityY < velocityX) {
        // The criteria are satisfied, do something.
    }
}

ViewConfiguration vc = ViewConfiguration.get(view.getContext());
private int mSlop = vc.getScaledTouchSlop();
private int mMinFlingVelocity = vc.getScaledMinimumFlingVelocity();
private int mMaxFlingVelocity = vc.getScaledMaximumFlingVelocity();
...
case MotionEvent.ACTION_MOVE: {
    ...
    float deltaX = motionEvent.getRawX() - mDownX;
    if (Math.abs(deltaX) > mSlop) {
        // A swipe occurs, do something.
    }
...
case MotionEvent.ACTION_UP: {
    ...
    } if (mMinFlingVelocity <= velocityX && velocityX <= mMaxFlingVelocity
            && velocityY < velocityX) {
        // The criteria are satisfied, do something.
    }
}

הרחבת אזור המגע בתצוגת הילד או הילדה

מערכת Android מספקת את הסיווג TouchDelegate כדי לאפשר להורה להרחיב את אזור המגע במסך של הילד או הילדה מעבר לגבולות של הילד או הילדה. האפשרות הזו שימושית כשהילדים צריכים להיות קטנים, אבל צריכים אזור מגע גדול יותר. אפשר גם להשתמש בשיטה הזו כדי לצמצם את אזור המגע של הילד או הילדה.

בדוגמה הבאה, ImageButton הוא _התצוגה המשויכת_ – כלומר הצאצא ששטח המגע שלו מורחב על ידי ההורה. זהו קובץ הפריסה:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/parent_layout"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context=".MainActivity" >

     <ImageButton android:id="@+id/button"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:background="@null"
          android:src="@drawable/icon" />
</RelativeLayout>

קטע הקוד הבא משלים את המשימות האלה:

• הפונקציה מקבלת את תצוגת ההורה ומפרסמת Runnable בשרשור של ממשק המשתמש. כך מוודאים שהרכיב ההורה פורס את הצאצאים שלו לפני שהוא קורא לשיטה getHitRect(). השיטה getHitRect() מקבלת את מלבן ההיט של הילד או הילדה (או האזור שאפשר לגעת בו) בקואורדינטות של ההורה.
• מאתר את תצוגת הצאצא ImageButton וקורא ל-getHitRect() כדי לקבל את הגבולות של האזור שניתן לגעת בו בצאצא.
• הרחבת הגבולות של ריבוע ההיט של תצוגת הצאצא ImageButton.
• יצירת מופע של TouchDelegate, עם העברת ריבוע ההיט המורחב ותצוגת הצאצא ImageButton כפרמטרים.
• מגדיר את TouchDelegate בתצוגת ההורה כך שהקשות בתוך גבולות הענקת הגישה למגע מנותבות לצאצא.

בתור נציג מגע של תצוגת הצאצא ImageButton, תצוגת ההורה מקבלת את כל אירועי המגע. אם אירוע המגע מתרחש בתוך ריבוע ההיט של הצאצא, הורה מעביר את אירוע המגע לצאצא לטיפול.

public class MainActivity : Activity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // Post in the parent's message queue to make sure the parent lays out
        // its children before you call getHitRect().
        findViewById<View>(R.id.parent_layout).post {
            // The bounds for the delegate view, which is an ImageButton in this
            // example.
            val delegateArea = Rect()
            val myButton = findViewById<ImageButton>(R.id.button).apply {
                isEnabled = true
                setOnClickListener {
                    Toast.makeText(
                            this@MainActivity,
                            "Touch occurred within ImageButton touch region.",
                            Toast.LENGTH_SHORT
                    ).show()
                }

                // The hit rectangle for the ImageButton.
                getHitRect(delegateArea)
            }

            // Extend the touch area of the ImageButton beyond its bounds on the
            // right and bottom.
            delegateArea.right += 100
            delegateArea.bottom += 100

            // Set the TouchDelegate on the parent view so that touches within
            // the touch delegate bounds are routed to the child.
            (myButton.parent as? View)?.apply {
                // Instantiate a TouchDelegate. "delegateArea" is the bounds in
                // local coordinates of the containing view to be mapped to the
                // delegate view. "myButton" is the child view that receives
                // motion events.
                touchDelegate = TouchDelegate(delegateArea, myButton)
            }
        }
    }
}

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // Get the parent view.
        View parentView = findViewById(R.id.parent_layout);

        parentView.post(new Runnable() {
            // Post in the parent's message queue to make sure the parent lays
            // out its children before you call getHitRect().
            @Override
            public void run() {
                // The bounds for the delegate view, which is an ImageButton in
                // this example.
                Rect delegateArea = new Rect();
                ImageButton myButton = (ImageButton) findViewById(R.id.button);
                myButton.setEnabled(true);
                myButton.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        Toast.makeText(MainActivity.this,
                                "Touch occurred within ImageButton touch region.",
                                Toast.LENGTH_SHORT).show();
                    }
                });

                // The hit rectangle for the ImageButton.
                myButton.getHitRect(delegateArea);

                // Extend the touch area of the ImageButton beyond its bounds on
                // the right and bottom.
                delegateArea.right += 100;
                delegateArea.bottom += 100;

                // Instantiate a TouchDelegate. "delegateArea" is the bounds in
                // local coordinates of the containing view to be mapped to the
                // delegate view. "myButton" is the child view that receives
                // motion events.
                TouchDelegate touchDelegate = new TouchDelegate(delegateArea,
                        myButton);

                // Set the TouchDelegate on the parent view so that touches
                // within the touch delegate bounds are routed to the child.
                if (View.class.isInstance(myButton.getParent())) {
                    ((View) myButton.getParent()).setTouchDelegate(touchDelegate);
                }
            }
        });
    }
}