Распознавание жестов в Android

Распознавание жестов в Android

Распознавание жестов в Android

Здравствуйте! В сегодняшней статье мы рассмотрим жесты в Android с точки зрения разработчика. Вы узнаете, как обрабатывать простые и сложные жесты на уровне кода, какие инструменты предоставляет Android SDK и как реализовать их в интерфейсе с использованием Jetpack Compose.

Что такое жесты для разработчика?

С точки зрения программирования, жест (gesture) — это последовательность касаний или движений пальца по экрану, которую приложение может распознать и обработать. Жесты позволяют пользователю управлять интерфейсом более естественно: прокрутка, увеличение, свайпы, нажатия и т.д.

Шаг 1: Обработка простых жестов через onTouchEvent()

В классическом Android-развитии вы можете отлавливать базовые события касания с помощью метода onTouchEvent(), который доступен в любом View.


override fun onTouchEvent(event: MotionEvent): Boolean {

    when (event.action) {

        MotionEvent.ACTION_DOWN -> Log.d("Gesture", "Палец коснулся экрана")

        MotionEvent.ACTION_MOVE -> Log.d("Gesture", "Палец двигается")

        MotionEvent.ACTION_UP -> Log.d("Gesture", "Палец оторвался от экрана")

    }

    return true

}

Этот способ подходит для базовой работы, но неудобен при реализации сложных жестов.

Шаг 2: Использование GestureDetector и ScaleGestureDetector

Android предоставляет удобные классы GestureDetector и ScaleGestureDetector, которые помогают распознавать стандартные жесты, такие как клик, длинное нажатие, скролл, масштабирование и другие.

  1. Создайте объекты:


val gestureDetector = GestureDetector(context, object : GestureDetector.SimpleOnGestureListener() {

    override fun onDown(e: MotionEvent): Boolean = true



    override fun onSingleTapUp(e: MotionEvent): Boolean {

        Toast.makeText(context, "Клик!", Toast.LENGTH_SHORT).show()

        return true

    }



    override fun onScroll(e1: MotionEvent, e2: MotionEvent, distanceX: Float, distanceY: Float): Boolean {

        Log.d("Gesture", "Прокрутка на $distanceY пикселей")

        return true

    }

})



val scaleDetector = ScaleGestureDetector(context, object : ScaleGestureDetector.OnScaleGestureListener {

    var scaleFactor = 1f



    override fun onScale(detector: ScaleGestureDetector): Boolean {

        scaleFactor *= detector.scaleFactor

        // Применяем масштаб к изображению или любому другому View

        return true

    }



    override fun onScaleBegin(detector: ScaleGestureDetector): Boolean = true

    override fun onScaleEnd(detector: ScaleGestureDetector) {}

})

  1. Передавайте событие в них:


override fun onTouchEvent(event: MotionEvent): Boolean {

    gestureDetector.onTouchEvent(event)

    scaleDetector.onTouchEvent(event)

    return true

}

Шаг 3: Работа с жестами в Jetpack Compose

Jetpack Compose предоставляет мощный и декларативный способ обработки жестов прямо внутри UI-компонента. Это делает код понятнее и лаконичнее.

  1. Добавьте зависимость (если её ещё нет):


implementation "androidx.compose.ui:ui:1.5.0"

implementation "androidx.compose.foundation:foundation:1.5.0"

  1. Используйте Modifier.pointerInput для обработки жестов:


@Composable

fun GestureDemo() {

    var offsetX by remember { mutableStateOf(0f) }

    var offsetY by remember { mutableStateOf(0f) }

    var scale by remember { mutableStateOf(1f) }



    Box(

        modifier = Modifier

            .fillMaxSize()

            .background(Color.LightGray)

            .pointerInput(Unit) {

                detectTransformGestures { _, pan, zoom, _ ->

                    scale *= zoom

                    offsetX += pan.x

                    offsetY += pan.y

                }

            }

        

        .then(

            Modifier.offset { IntOffset(offsetX.roundToInt(), offsetY.roundToInt()) }

            .scale(scale)

        )

    ) {

        Text(text = "Перетащи меня", modifier = Modifier.align(Alignment.Center))

    }

}

Теперь элемент можно перемещать, масштабировать и взаимодействовать с ним с помощью мультитача!

Шаг 4: Дополнительные возможности

Jetpack Compose также позволяет легко добавлять:

  • Нажатия: Modifier.clickable
  • Длинные нажатия: combinedClickable
  • Прокрутку: verticalScroll / horizontalScroll
  • Жесты перелистывания: с помощью swipeable
  • Заключение

    Работа с жестами в Android стала намного проще с появлением Jetpack Compose. Теперь вы можете создавать богатые интерфейсы с минимальным количеством кода, используя декларативный подход.

    Если вы хотите научиться создавать современные приложения на Android, рекомендуем видеокурс Разработка приложений на Android с Нуля до Гуру.

    Источник

    НЕТ КОММЕНТАРИЕВ

    Оставить комментарий