Jetpack Compose Academy · Oppitunti

pointerInput ja detectTapGestures

Tunnistakaa napautus, kaksoisnapautus ja pitkä painallus.

Oppitunti 1/413 vaihetta

pointerInput ja detectTapGestures on ilmainen Jetpack Compose Academy-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Jetpack Compose Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Jetpack Compose Academy-kurssilla on yhteensä 4 oppituntia.

Kosketuksen portti

Raakakosketuksen käsittelyyn Composessa käytätte pointerInput-modifioijaa. Se antaa mille tahansa elementille mahdollisuuden lukea sormitapahtumia suoraan. 👆

Lisätkää se mihin tahansa Composableen

Liittäkää pointerInput Modifier-ketjuun. Sen lambdan sisällä saatte käyttöön elealueen, jossa voitte kuunnella napautuksia, vetoja ja muita eleitä.

Box(Modifier.pointerInput(Unit) {
  // gesture detectors go here
})

Tunnistakaa yksinkertaiset napautukset

Kätevin apufunktio on detectTapGestures. Se kokoaa napautuksen, kaksoisnapautuksen, pitkän painalluksen ja painalluksen yhdeksi siistiksi kutsuksi.

detectTapGestures(onTap = { /* tapped */ })

Yksi nopea napautus

onTap-lambda suoritetaan, kun sormi painaa ja nostaa ilman merkittävää liikettä. Se saa parametrina Offset-arvon, joka kertoo napautuksen sijainnin.

detectTapGestures(onTap = { offset -> println(offset) })

Tunnistakaa kaksoisnapautus

Välittäkää onDoubleTap reagoidaksenne kahteen peräkkäiseen nopeaan napautukseen. Se sopii erinomaisesti kuvan tykkäys- tai zoomauspikatoiminnoksi. 💙

detectTapGestures(onDoubleTap = { /* zoom in */ })

Painakaa pitkään

onLongPress-lambda suoritetaan, kun sormi pysyy painettuna määritetyn ajan. Käyttäkää sitä kontekstivalikoiden tai valintatilan avaamiseen.

detectTapGestures(onLongPress = { /* show menu */ })

Seuratkaa itse painallusta

Käyttäkää onPress-funktiota tietääksenne hetken, jolloin sormi koskettaa näyttöä. Sen lambda voi keskeyttää, joten voitte odottaa vapautusta tai peruutusta.

detectTapGestures(onPress = { awaitRelease() })

Jokainen napautus sisältää sijainnin

Jokainen napautuksen callback antaa pikseleinä ilmoitetun Offset-arvon, joka mitataan Composablen vasemmasta yläkulmasta. Sen avulla tiedätte tarkalleen, missä käyttäjä kosketti.

Avainargumentilla on merkitystä

pointerInput-funktion ensimmäinen argumentti on avain. Kun se muuttuu, elelohko käynnistyy uudelleen, joten välittäkää sille kaikki tila, josta käsittelijänne riippuvat.

Modifier.pointerInput(enabled) { /* restarts if enabled flips */ }

Eleet suoritetaan coroutineissa

pointerInput-lohko on suspend-alue. Siksi tunnistimet voivat odottaa tapahtumia ruutu kerrallaan estämättä käyttöliittymäsäiettä.

Yhdistäkää useita callback-funktioita

Yksi detectTapGestures-kutsu voi vastaanottaa napautuksen, kaksoisnapautuksen ja pitkän painalluksen yhdessä. Compose selvittää, mitä käyttäjä tarkoitti.

detectTapGestures(onTap = {...}, onLongPress = {...})

Pikatarkistus

Mikä apufunktio kokoaa napautuksen, kaksoisnapautuksen ja pitkän painalluksen yhdeksi kutsuksi?

Kertaus: raakakosketukset helposti

Tutustuitte pointerInput- ja detectTapGestures-funktioihin, joilla käsitellään napautuksia, kaksoisnapautuksia ja pitkiä painalluksia. Ne muodostavat perustan mukautetulle kosketuksen käsittelylle. 🎉

Aloita maksutta

Opi Kotlin tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
30
Oppitunnit
120

Usein kysytyt kysymykset

Onko oppitunti ”pointerInput ja detectTapGestures” ilmainen?

Kyllä – oppitunnin ”pointerInput ja detectTapGestures” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Jetpack Compose Academy-kurssin, päivitä CoddyKit PROhon. Jetpack Compose Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”pointerInput ja detectTapGestures”?

Tunnistakaa napautus, kaksoisnapautus ja pitkä painallus. Harjoittelet Jetpack Compose Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Jetpack Compose Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Jetpack Compose Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/4.

Kuinka kauan ”pointerInput ja detectTapGestures”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Jetpack Compose Academy-oppitunnilla?

Kyllä. Jokainen Jetpack Compose Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. pointerInput ja detectTapGestures
  2. Vetäminen, pyyhkäisy ja heilahdus
  3. Transform: panorointi, zoomaus ja kierto
  4. Sisäkkäiset vieritysyhteydet
← Takaisin: Jetpack Compose Academy