Vedä ja pudota JavaFX:ssä – vaiheittainen opas aloittelijoille

Oletko koskaan miettinyt, miten Drag ja Drop toteutetaan graafisessa käyttöliittymässä? Tämä käsite ei ole vain nykyaikaisissa sovelluksissa yleinen, vaan sillä on myös suuri merkitys käyttäjäkokemuksessa. Tässä oppaassa näytän, miten voit toteuttaa Drag ja Dropin JavaFX:ssä tekemällä kaksi neliötä, joita voit siirtää. Se on askel - askeleelta -opas, joten voit helposti seurata kaikkia tarvittavia vaiheita.

Tärkeimmät havainnot

• Drag ja Drop mahdollistaa käyttäjien siirtää objekteja helposti.
• Drag ja Dropin toteuttaminen JavaFX:ssä on helppoa tapahtumankäsittelijöiden ja lambda-lauseiden avulla.
• Kolarihavainnointi on olennaista, jotta voidaan todeta, onko objekti jätetty tiettyyn alueeseen.

Askel askeleelta -opas

1. Projektin asetukset

Ensiksi luot uuden JavaFX-projektin kehitysympäristössäsi. Varmista, että kaikki tarvittavat kirjastot on integroitu. Aloitamme sovelluksesi perusasetuksista luomalla pääluokan.

2. Luo käyttöliittymä

Esimerkkinä luomme kaksi neliötä: pienen, jota haluamme siirtää, ja suuren, joka toimii kohteena. Koodi tähän on seuraava:

Rectangle recToMove = new Rectangle(50, 50, 50, 50); // pieni neliö
Rectangle recTarget = new Rectangle(150, 150, 100, 100); // suuri neliö

Luoessasi neliöt määrittelet niiden sijainnin ja koon.

3. Määritä sijainti ja kohtaus

Seuraavaksi tarvitset muuttujia tallentamaan objektiesi sijainnin. Määritä kohtauksen X- ja Y-koordinaatit. Näitä käytetään myöhemmin seuraamaan liikettä Drag-and-Drop-prosessin aikana.

double mainX, mainY; 

4. Lisää tapahtumankäsittelijät

Seuraava vaihe on lisätä tapahtumankäsittelijät, jotka mahdollistavat Drag-and-Drop-toiminnallisuuden. Aloitamme hiiren painalluksen käsittelijällä.

recToMove.setOnMousePressed(event -> { mainX = event.getSceneX(); mainY = event.getSceneY();
});

Tässä tallennat nykyisen hiiren sijainnin, kun hiiren painiketta painetaan.

5. Siirtokäsittelijän toteuttaminen

Siirtovaiheessa käytämme toista tapahtumankäsittelijää, joka mahdollistaa neliön liikuttamisen, kun pidät hiiren painiketta painettuna.

Tässä päivität neliön sijainnin sen perusteella, miten hiiri liikkuu.

6. Hiiren painikkeen vapauttaminen

Hiiren painikkeen vapauttamisen huomioimiseksi lisää toinen käsittelijä. Tämä muuttaa neliön väriä ja tarkistaa, onko se jätetty tiettyyn kohdepisteeseen.

recToMove.setOnMouseReleased(event -> { // Väri palautetaan recToMove.setFill(Color.BLACK); checkBounce(recToMove);
});

7. Kollision havainta

Tarkistaaksesi, onko siirretty neliö jätetty kohdenneliöön, toteutat metodin nimeltä checkBounce.

Tässä tunnistat, ylittävätkö kaksi neliötä toisiaan ja muutat kohdeneliön väriä sen mukaan.

8. Lisää objektit kohtaukseen

Lopuksi lisäät luodut neliöt kohtaukseesi ja asetat kohtauksen lavalle.

Yhteenveto – Drag ja Drop JavaFX:ssä

Tämän oppaat avulla olet oppinut, miten voit toteuttaa yksinkertaisen Drag-and-Drop-järjestelmän JavaFX:ssä. Olet oppinut kollision tunnistamisen perusteet sekä hiiri-tapahtumien käsittelyn. Drag ja Drop -toiminnallisuudet ovat ratkaisevan tärkeitä sovellustesi käytettävyyden kannalta.