Tässä kuussa palaan ohjelmointiin hetkeksi. Tarvitsen levätä viime kuukauden sarakkeen Talkback-keskustelun oudosta. Aion kuitenkin kirjoittaa lisää teoriakysymyksistä tulevaisuudessa, mutta en seuraavien parin kuukauden ajan.
Minun on tehtävä yksi selvennys viime kuukauden sarakkeesta. Monet ihmiset tulkitsivat käyttöliittymiä koskevia kommenttejani puolustamaan raskaita esineitä, joissa oli miljardeja renderointimenetelmiä. Se ei ollut mielessäni. On olemassa useita käyttökelpoisia tapoja luoda käyttöliittymiä paljastamatta toteutuksen yksityiskohtia. Neljän rakentajan jengi- ja vierailijamallit tulevat heti mieleen. Yksinkertainen Piirrä itsesi()
menetelmä ei selvästikään voi toimia millään muulla kuin yksinkertaisimmilla esineillä, ja sillä on 50 drawYourselfInThisFormat ()
ja drawYourselfInThatFormat ()
Methods on järjetön resepti hallitsemattomalle koodille. Monien mielestä kannatan kuitenkin tätä lähestymistapaa, joten pyydän anteeksi, jos annoin tuon vaikutelman.
Koska olen nähnyt paljon väärinkäsityksiä käyttöliittymäkysymyksessä, aion näyttää sinulle muutamia olio-orientoitujen (OO) käyttöliittymien rakentamisen lähestymistapoja tulevissa sarakkeissa. Esitin yhden tällaisen ratkaisun vuonna JavaWorld muutama vuosi sitten (katso Resurssit), mutta olen rakentanut parempia järjestelmiä tulevina vuosina. Tämä nykyinen sarake esittelee osan näistä käyttöliittymäjärjestelmistä: infrastruktuuriluokan, jota olen käyttänyt asiakaspuolen käyttöliittymien rakentamisessa OO-tavalla. Se ei sinänsä ole ratkaisu käyttöliittymän ongelmaan, mutta se on hyödyllinen rakennusosa.
Koska koodinäytteet ovat melko suuria, jaan esityksen kahteen osaan. Tämä kuukausi on dokumentaatio ja sovelluskoodi; ensi kuussa on lähdekoodi.
Lue koko Luo asiakaspuolen käyttöliittymät HTML-muodossa -sarja:
- Osa 1: Tee JEditorPanesta hyödyllinen (lokakuu 2003)
- Osa 2: HTMLPane-lähteet (marraskuu 2003)
HTML: n käyttö asiakaspuolella
HTML on hieno asia. Sen avulla voit suunnitella monimutkaisia käyttöliittymiä vähällä hässäkällä; se tekee hienoa työtä erottaakseen käyttöliittymän rakenteen ja ulkoasun liiketoimintalogiikasta; se on helppo kirjoittaa; ja se on helppo ylläpitää. Abstract Window Toolkit (AWT) / Swing-asettelua on sitä vastoin ärsyttävän vaikea käyttää. Sinun on muokattava (ja käännettävä uudelleen) koodia, jotta voit muuttaa näyttöjen ulkoasua, ja triviaalin asettelun koodi ei itsessään ole triviaali, ulottuu monille sivuille. Eikö olisi hienoa, jos voisit määrittää koko asiakaspuolen käyttöliittymän HTML-muodossa?
(Tiedän, että jotkut teistä vastaavat edelliseen kysymykseen kiihtyvällä "Ei, se ei olisi kiva!" Monet väittävät, että HTML ja hyvä käyttökokemus ovat toisiaan poissulkevia käsitteitä, koska HTML pakottaa käyttöliittymän "äärettömään CSS: ään valintaikkunatila. Toisaalta monet sovellukset voivat hyödyntää HTML: ää tehokkaasti ainakin jossakin käyttöliittymän osassa - taulukkoraportteja varten, ellei mitään muuta. Et voi heittää vauvaa kylpyveden kanssa.)
Keinut JEditorPane
class, aluksi näyttää olevan vastaus HTML-asettelun ongelmaan. Se ymmärtää HTML-syötteen muodin jälkeen. Esimerkiksi seuraava koodi ponnahtaa esiin kehyksen, joka näyttää yksinkertaista HTML-tekstiä:
JFrame main_frame = uusi JFrame (); JEditorPane-paneeli = uusi JEditorPane (); pane.setContentType ("teksti / html"); pane.setEditable (false); pane.setText ("" + "" + "" + "" + "HeiMaailman"+" "+" "); main_frame.setContentPane (ruutu); main_frame.setDefaultCloseOperation (JFrame.EXIT_ON_CLOSE); main_frame.pack (); main_frame.show ();
Sanon "muodin jälkeen", koska JEditorPane
ei ole erityisen hyvä käsittelemään monimutkaista HTML-koodia. Se ei tee hyvää työtä sisäkkäisillä pöydillä, eikä se tee CSS-CSS-levyjä kovin hyvin. (Minulle on kerrottu, että monet näistä ongelmista korjataan Java 1.5 -julkaisussa ensi vuonna, mutta toistaiseksi meidän kaikkien on siedettävä ne.) Lopuksi, JEditorPane
ei tee erityisen hyvää työtä asettamalla esimerkiksi radiopainikkeita. Niitä ei ole kohdistettu oikein tekstin perusviivan kanssa, ja niissä on aina harmaa tausta, joten ne eivät toimi hyvin, jos muutat sivun taustaväriä (tyylillä esimerkiksi).
Kaikki nämä puutteet ovat ärsyttäviä, mutta show-stopper-ongelma JEditorPane
on se, että se toimii tekstinhallintana, ei asettelutoimintona. Voit määrittää HTML-koodin esimerkiksi syötteessä, mutta lomake lähetetään Web-palvelimelle, kun painat Lähetä-painiketta. Jos haluat olla hyödyllinen asiakaspuolen käyttöliittymän määrittämisessä, haluat, että lomaketiedot palaavat lomaketta näyttäneeseen ohjelmaan, ei johonkin etäpalvelimeen. Tarvitset myös a kätevä tapa lisätä mukautettuja tunnisteita epätyypillisiin syöttö- tai näyttötarkoituksiin tai tarjota paikanpitäjiä tavalliselle Swingille
JComponents
jota haluat käyttää lomakkeessa. (JEditorPane
voit tehdä tämän, mutta mekanismi ei ole kaukana kätevästä.) Lopuksi sinun on käsiteltävä asioita, kuten Peruuta-painike, jota ei ole HTML-muodossa.
Onneksi kaikkein törkein edellä mainituista ongelmista voidaan ratkaista sisäänrakennetuilla mukautustiloilla JEditorPane
itse. Näiden ongelmien korjaamiseen liittyy kuitenkin tietty kompromissi. Voit esimerkiksi käsitellä Peruuta-painiketta-ongelmaa ottamalla käyttöön JavaScript-tulkin ja tukemalla klikkaamalla
ominaisuus, mutta se on hirvittävän paljon työtä. Vastaavasti todellisen mukautetun tagin tuen (jossa voit käsitellä kaikkea alku- ja lopputagin välissä) tarjoamista on erittäin vaikea tehdä olemassa olevan jäsentimen kanssa. Voit korvata JEditorPane
parseri paremmalla, mutta se on myös paljon työtä. Valitsin yksinkertaisemmat ratkaisut, jotka tekivät työn. Lisäsin luokkaani tarpeeksi toimintoja, jotta voisin käyttää sitä rakentamaan käyttöliittymän kirjoittamalleni ohjelmalle, mutta en tarjonnut "täydellistä" ratkaisua. Ratkaisemani ongelma oli: tarjota tapa määrittää käyttöliittymä HTML-muodossa. En ratkaissut ongelmaa: tarjoa tapa näyttää kaikki mahdolliset HTML-tiedostot asiakaspuolen sovelluksessa. HTMLPane
Tässä artikkelissa esittelemäni luokka ratkaisee Specif-a-UI-in-HTML -ongelman hyvin.
HTMLPanen käyttäminen
Vain asiakaspuoleni HTML-syöttöluokka, HTMLPane
, on JEditorPane
johdannainen, joka korjaa aiemmin käsitellyt ongelmat. Luettelossa 1 näkyy, kuinka HTMLPane
. Loin yksinkertaisen JDialog
johdannainen kutsutaan HTMLDialog
jossa voit määrittää valintaikkunan asettelun HTML-muodossa. HTMLDialog
on triviaali esimerkki julkisivumallista. Se vain tekee tarvittavan työn HTMLPane
valintaikkunaan ja näytä se.
HTMLDialog.Test
luokka (Listaus 1, rivi 134) tarjoaa yksinkertaisen esimerkin siitä, kuinka HTMLDialog
. Se luo pääosin tyhjän pääkehyksen (omistaja
). Käyttämällä koodia, kuten alla oleva katkelma, main ()
luo HTMLDialog
objekti, jonka sisältö on määritetty suhteellisessa CLASSPATH-tiedostossa fi / holub / ui / HTML / test / okay.html
(Luettelo 2). Jousi "Testaa HTMLDialog"
näkyy otsikkorivillä. Lopuksi, main ()
avaa valintaikkunan soittamalla d.popup ()
, joka palaa vasta, kun käyttäjä sulkee valintaikkunan:
// Näytä okay.html-tiedosto valintaikkunassa, jolla on// otsikko "Test HtmlDialog".// HtmlDialog-valintaikkuna = uusi HtmlDialog (omistava_kehys, "com / holub / ui / HTML / test / okei.html", "Testaa HtmlDialog"); // Avaa valintaikkuna ja odota, että käyttäjä hylkää sen.// dialog.popup (); // Tulosta käyttäjän kirjoittamat "lomaketiedot".// System.out.println ("hidden =" + dialog.data (). GetProperty ("hidden") + "user-input" + dialog.data (). GetProperty ("user-input"));
Lomaketiedot (teksti, jonka käyttäjä kirjoitti tai vastaava), on saatavana
HTMLDialog
on tiedot ()
menetelmä, joka palauttaa a java.util.Kiinteistöt
objekti, jolla on avain / arvo-parit, jotka edustavat lomaketietoja. Yllä oleva kutsu dialog.data (). getProperty ("piilotettu")
palauttaa merkkijonon "piilotetun kentän tiedot"
. dialog.data (). getProperty ("käyttäjän syöttö")
call palauttaa käyttäjän kirjoittaman syötekentän.
Suurin osa kapseloidun pikaviestinnän työstä HTMLPane
tapahtuu HTMLDialog
rakentaja (Listaus 1, rivi 46). Rakentaja perustaa ensin ActionListener
joka käsittelee lomakkeen Lähetä-painiketta. Tämä tarkkailija sammuttaa nykyisen valintaikkunan ja kopioi kaikki lomaketiedot HTMLPane
että tiedot
instanssimuuttuja. Rakentaja saa sitten syötetiedoston CLASSPATH: lta ja lataa sitten HTML-tiedoston HTMLPane
käyttämällä setText ()
. (Siellä on myös setPage (URL)
menetelmä, mutta tarvitset URL-osoitteen tiedoston absoluuttiselle polulle, jos käytät sitä. Halusin, että HTML-tiedostonimi olisi CLASSPATH-suhteellinen.)
Peruuta käsittely käsitellään ponnahdusikkuna()
(rivi 121), joka olettaa, että Peruuta-painiketta painettiin, jos lähetetyissä lomaketiedoissa on Peruuta-näppäin. (Lisätietoja siitä, miten nämä tiedot pääsevät Ominaisuudet
esine hetkessä.)