Scott MacKenzieYork University

CSE4443 – Mobile User Interfaces

© Scott MacKenzie

(Part 2)

Demo_Multitouch

© Scott MacKenzie 2

EscLet’s have a look.

What is Where!

© Scott MacKenzie 3

DemoTouchActivity.java

PaintPanel

Activity

View

onTouch

DemoInkActivity.java

PaintPanel.java

Activity

View

onTouch

Demo Touch Demo InkDemoMultitouchActivity.java

PaintPanel.java

Activity

View

onTouch

Demo Multitouch

DemoScaleActivity.java

Activity

PaintPanel.java

View

onTouchEvent

Demo Scale

Coming Up…

Map

• Android’s “Touch Mode”• Single touch• Multitouch• Touch gestures

© Scott MacKenzie 4

Android Touch “Gestures”

• Question:– Is it possible to detect high-level finger actions, such

as double tap, flick, drag, pinch, etc.?

• Answer: – Yes (of course) … but how?

• Two approaches:– Roll your own (use a touch listener in combination

with MotionEvent, state variables, timers, etc.) – Use Android’s gesture detector classes

© Scott MacKenzie 5

Android Touch “Gestures”

• Question:– Is it possible to detect high-level finger actions, such

as double tap, flick, drag, pinch, etc.?

• Answer: – Yes (of course) … but how?

• Two approaches:– Roll your own (use a touch listener in combination

with MotionEvent, state variables, timers, etc.) – Use Android’s gesture detector classes

© Scott MacKenzie 6

1-Finger ( ) Gestures

Touch Longpress

Swipe ordrag

Double touchdrag

Doubletouch

7© Scott MacKenzie

Long pressdrag

Android’s GestureDetector Class(single touch)

• From the API:– Detects various gestures and events using the

supplied MotionEvents

• Programming approach:– Extend the “convenience” class…

… and implement methods of interest

© Scott MacKenzie 8

GestureDetector.SimpleOnGestureListener

GestureDetector.SimpleOnGestureListenera “convenience” class

9© Scott MacKenzie

© Scott MacKenzie 10

Minimum Implementation

Note: We are handing touch events in the view, not in the activity.

2-finger ( ) Gestures

Pinchopen

Pinchclosed

11© Scott MacKenzie

Android’s ScaleGestureDetector Class(multitouch)

• From the API:– Detects scaling transformation gestures using the

supplied MotionEvents

• Programming approach:– Extend the “convenience” class…

… and implement methods of interest

© Scott MacKenzie 12

ScaleGestureDetector.SimpleOnScaleGestureListener

ScaleGestureDetector.SimpleOnScaleGestureListener

a “convenience” class

13© Scott MacKenzie

Notes:• The listener methods above receive a ScaleGestureDetector

object. • This is different from the listener methods in GestureDetector.SimpleOnGestureListener, which receive a MotionEvent object.

• What methods are available with ScaleGestureDetector? (next slide)

ScaleGestureDetector

14© Scott MacKenzie

© Scott MacKenzie 15

Minimum Implementation

Demo Scale

Note: See PaintPanel class in Demo Scale16

© Scott MacKenzie

EscLet’s have a look.

Focus-point Zooming(see DemoScale for details)

© Scott MacKenzie 17

Zooming PhilosophyDo not:

• Zoom about the centre of the imageDo:

• Zoom about the focus point

Focus-point zooming is desirable because the focus point is• The point of interest to the user• Where the user is looking

Homework

• The usual…

• I.e.,– Download all the “demo” programs from earlier slides– Import into Android Studio projects– Connect your device and click “Run”– Observe UI behaviour– Ready the APIs (and links within)– Study source code

© Scott MacKenzie 18

Thank You

19© Scott MacKenzie