Метод detectDragGestures

Метод detectDragGestures вызывают в PointerInputScope внутри pointerInput. После нажатия приходят смещения в onDrag, начало жеста - в onDragStart, конец - в onDragEnd. Для простого сдвига по оси часто берут draggable.

Синтаксис

detectDragGestures(
	onDragStart = { offset -> },
	onDragEnd = { },
	onDrag = { change, dragAmount -> },
)

Параметры

Параметр	Описание
`onDragStart`	Лямбда в точке начала перетаскивания.
`onDrag`	Лямбда на каждый шаг. Получает изменение и delta.
`onDragEnd`	Лямбда при отпускании пальца.
`onDragCancel`	Лямбда, если жест прервали.

Пример

Давайте сдвинем текст по горизонтали через onDrag:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.detectDragGestures
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Text
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableFloatStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.unit.IntOffset
import androidx.compose.ui.unit.dp
import kotlin.math.roundToInt

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			var offsetX by remember { mutableFloatStateOf(0f) }
			Text(
				text = "abcde",
				modifier = Modifier
					.offset { IntOffset(offsetX.roundToInt(), 0) }
					.pointerInput(Unit) {
						detectDragGestures { change, dragAmount ->
							change.consume()
							offsetX += dragAmount.x
						}
					}
					.background(Color.LightGray)
					.padding(16.dp),
			)
		}
	}
}

На экране серая плашка с текстом будет ехать влево и вправо за пальцем.

Пример

Давайте сбросим смещение в onDragEnd:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.gestures.detectDragGestures
import androidx.compose.foundation.layout.offset
import androidx.compose.material3.Text
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableFloatStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.unit.IntOffset
import kotlin.math.roundToInt

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			var offsetX by remember { mutableFloatStateOf(0f) }
			Text(
				text = "12345",
				modifier = Modifier
					.offset { IntOffset(offsetX.roundToInt(), 0) }
					.pointerInput(Unit) {
						detectDragGestures(
							onDrag = { change, dragAmount ->
								change.consume()
								offsetX += dragAmount.x
							},
							onDragEnd = { offsetX = 0f },
						)
					},
			)
		}
	}
}

На экране текст вернётся в исходную позицию, когда палец оторвут от экрана.

Смотрите также

метод detectTapGestures,
который ловит нажатия без drag
метод draggable,
который тянет элемент по одной оси проще
класс DraggableState,
куда draggable складывает delta
метод pointerInput,
который открывает PointerInputScope