Upload
polygon-informatikai-kft
View
313
Download
2
Embed Size (px)
DESCRIPTION
Citation preview
1
p.XML alkalmazási élmény
Csonka EnikőCsonka Enikő
2013. január 16.2013. január 16.
Miről lesz szó?
Felhasználói élmény
JForm Designer
TranTools
Felhasználói élmény
Hogyan alakul ki a felhasználói élmény?
Tetszik Nem tetszik Semleges / nem fontos
"Tetszik a design, de nem tetszik, hogy sokat kell várni egy gomb megnyomása után."
Hogyan növelhető a felhasználói élmény egy alkalmazáson belül: a szimpatikus dolgok arányának növelésével
(pl. gyors, egyértelmű navigálás a képernyők között),
a zavaró dolgok arányának csökkentésével (pl. nincsenek helyesírási hibák).
Felhasználói élmény
Fontos az alkalmazás „tudása” ÉS minél egyszerűbb és könnyebb használhatóság
A részleteken múlik, hogy szívesen használunk-e egy alkalmazást. Érdemes beépíteni a p.XML fejlesztésbe a mai „trendeket”,
nézőpontokat. Cél -> elérni, hogy a felhasználó szívesen használja az alkalmazást,
amit készítünk!
JForm képernyők elkészítésének szempontjai
1. Egységes felépítés
2. Könnyen érthetőek, áttekinthetőek legyenek a képernyők.
3. A lehető legkevesebb kattintásra legyen szükség.
4. A felhasználónak a lehető legkevesebbet kelljen gépelnie.
5. Segítsük, kísérjük a felhasználót a program használata során.
Mitől lehet jó a design?Legyen kellemes a színvilág (Hosszabb ideig nézve se fárassza
túlságosan a szemet.)
Legyen egy saját hangulata, passzoljon az alkalmazáshoz.
Jól láthatóak legyenek a feliratok
Az alkalmazás célját jelképező képek használatával hangulatosabbá, egyedibbé válik a design.
Alkalmazhatunk ikonokat gomb feliratok helyett (pl. egy nagyító ikon a "keresés" felirat helyett).
JFORM Designer
JFORM Designer
- Nyílt szabványokra épülő,
- XML alapú,
- Felhasználói felület (GUI) leíró nyelv
- JFormok megjelenítését egy Java-alapú vékony-kliens végzi
- Asszinkron, HTTP-alapú üzenetküldés
- Operációs rendszertől, géptípustól, böngésző típustól függetlenül egységesen jelennek meg.
JFORM DesignerInteraktív webalkalmazások létrehozása.
A weblap kis mennyiségű adatot cserél a szerverrel a háttérben.
Nő a honlap interaktivitása, sebessége és használhatósága.
Egy böngésző ablakban több alkalmazás elindítható.
A többszálú feldolgozás.
A grafikus felület "motorja" egy egyedülállóan kicsi Java-applet, amely tartalmaz:
• grafikus komponens-készletet • gyors XML-értelmezőt• aszinkron kommunikációs interfészt
JFORM Designer előnyök, képességek
WYSWYG szerkesztő PersonalJava kompatibilis Szabványos; XForms-szabányra
épül Menü-rendszerek Használhatóak magasszintű
komponensek Háttér-képek és ikonok Felbukkanó segédszövegek
Fókusz-sorrend megadása Központosított verzió-kezelés Billentyűzet-parancsok Stíluslapok hozzáadása Validált mezők Hálózati tömörítés
JFORM Designer és az Eclipse
Többféle futtatási környezet
• Indítható önálló alkalmazásként
• Beépül az Eclipse-be grafikus szerkesztő plug-in formájában• Egyéb plug-in-re nincs szükség• Egy JFORM szövegszerkesztővel is megnyitható• Designer súgó beépül az Eclipse ‘Table of Contents’ témakörei
közé• F2 gombra magyar nyelvű súgó• Designer beállításai is beépülnek az Eclipse ‘Prefences…’
menüpontja alá• JFORM mentésekor meghívódik PXBuilder: automatikusan
legenerálja/ módosítja a JFORM-hoz tartozó forráskódot
JFORM Designer és az Eclipse
JFORM Designer - Nemzetközi kódlapok használataA kliens a szervertől kapott lap kódolásának megfelelően változtatja meg
saját kimenő adatainak kódolását.
A "Window/Preferences..." menüpontban állítható be, hogy a tervező melyik kódolást használja (Eclipse plug-in)
JFORM dokumentum felépítése
<?xml version="1.0" encoding="UTF-8"?><WINDOW height="255" id="window" width="360"> <title>Bejelentkezés</title> <style>greenwindow</style> <content> <PANEL href="../_Page/href.Header1000"/> <LABEL id="lab1" x="0" y="10" width="360" height="25"> <text>PhysioSensor Adatkezelő Rendszer</text> <font>Dialog,15,bold</font> <alignment>center</alignment> <foreground/> </LABEL>
... <BUTTON id="but3" x="50" y="185" width="23" height="18"> <style>pagebutton</style> <model>#AUTO</model> <action>_Session/LANGEN</action> <wallpaper>../www/images/zaszlo_en.gif</wallpaper> <wallpaper-mode>stretched</wallpaper-mode> <validated>false</validated> </BUTTON> </content></WINDOW>
Eseménykezelés
Az eseménykezelés JFORM kliensben azt jelenti, hogy a felhasználó pl. egy gombra kattintva, egy meghatározott XML-struktúrát elküld a szervernek,
és a válaszként kapott - vagyis a szerver által visszaküldött - lapot megjeleníti.
Ez a funkció nagyon hasonlít a HTML-lapok "submit" funkciójához.
Egy küldésre képes komponensnek (gombnak, menüpontnak, stb.) különböző paramétereket lehet megadni:
- Engedélyezi, vagy letiltja az eseménykezelést
- p.XML-alapú alkalmazásoknál ezt a paramétert főleg nyomtatandó lapok letöltéséhez (url)
- Megadható, hogy a kliens foglalkozzon-e a hibásan kitöltött szövegmezőkkel, szám-mezőkkel, dátum-komponensekkel, stb.
Grafikus komponensek
Komponensek
Komponensek
Komponensek
Komponensek
Ablakkezelés
Az operációs rendszer ablakkezelője felel a felső szintű ablakok mozgatásáért, átméretezéséért, ő rajzolja ki:• a címsort,• az ablakkereteket, • a tálcát, • az ikonokat,
Modális ablakok
A menük kezelése
Menüsor Felbukkanó (popup) menü
Képek kezelése
A kép komponens segítségével
lehet a felhasználói felületre helyezni
GIF, vagy JPG formátumú képeket.
Felbukkanó menüvel rendelkezhet.
Keretének típusa és annak színei
tetszőlegesen megváltoztathatóak.
Hátterének egy másik képet is be lehet állítani.
Interaktív képekAzonnali adatküldés kiválasztáskor
A kép képes az adatmodellek azonnali elküldésére (kattintás hatására)
Amennyiben a felhasználó a térkép bármely pontjára rákattint a kliens azonnal elküldi a "model" azonosítójú adatmodellt a szervernek. Az adatmodell "xpos" és "ypos" változói a kép megfelelő koordinátáit fogják tartalmazni.
Képek megjelenítése
Képek kezelése
Képek kezelése
Képek kezelése
Grafikonok készítéseAdatok, eredmények könnyen áttekinthető formában kerüljenek
megjelenítésre.
Több adatsort is meg lehet jeleníteni
Meghatározható, hogy a kirajzolt diagram mellett jelenjen-e meg a numerikus érték.
Grafikonok készítése
Táblázatok
Táblázatok kezelése
Ikonok
Minden szöveg típusú komponenshez
hozzárendelhetünk ikont
Ikonok
Dátumok kezeléseDátumok különböző formátumokban, különböző nyelveken történő
megjelenítése és kezelésére
A JFORM kliens dátumok kezelése céljából két grafikus komponenst bocsát a fejlesztők rendelkezésére; a naptár komponenst, és a dátum-mező komponenst
Az alkalmazás-logikának kell kezelnie a különböző nyelvektől függő dátum és számmezők formátumával kapcsolatos paramétereket
Fa struktúrák
A felhasználó könnyen eligazodjon a különböző vezérlő-elemek és funkciók között.
Ha túl sok az információ => a felhasználó nem igazodik el rajta.
Ha túl kevés vezérlő-elem => a felhasználó kénytelen állandóan az ablakok között váltogatni
Mindezek elkerülésére => fa-komponens
könnyű navigálni benne,
a felhasználó az őt érdeklő részeket kinyitogathatja, egészen a levelekig
A billentyűzet támogatása
Munka nagy részét a felhasználók a billentyűzettel végzik
A dialógusdobozokban is lehessen navigálni (TAB, SHIFT+TAB, ENTER, ESC, stb).
Gomb komponens, segédszöveggel és gyorsbillentyűvel
A billentyűzet támogatása
A komponensek között körkörös sorrend definiálása
A stílusokról
A JFORM Designerben használatos stílus-technika működése hasonló a HTML-szintaktikában szokásos "Cascading Style Sheets" szabványhoz;
A stílus-technika használatával a lapok mérete jelentősen csökkenthető
Egységesen változtathatjuk meg az alkalmazás képét.
Célszerű a használatba kerülő stílusok neveit már az alkalmazás tervezésekor meghatározni
Egy beállított stílus több képernyőn keresztül is megmarad, amíg az alkalmazás fut, vagy nem kerül átdefiniálásra, vagy törlésre.
Beépített stílusok
Egyéni stílusokEgy konkrét alkalmazáshoz többféle design is létezhet, melyek között gombnyomásra tudunk választani. Itt
a színeken felül az egyes elemek méretét, kinézetét is változtathatjuk.
Header képe függhet a stílustól A grafikus komponensek és azok pozíciója fix
Képernyő méretezésA képernyőképeket méretarányos "húzással" és fix méretek közötti
változtatással is állíthatjuk.
Képernyő méretezésÁtállítom a méretarányt 800x600 -> 1020x700–ra:
Többnyelvűsítés
TranTools
p.XML eszköz alkalmazások többnyelvűsítésére
Segítségével az ügyfelek akár saját maguk is végezhetik az alkalmazásaik többnyelvűsítését
TranTools
Támogatja a végfelhasználót, hogy alkalmazásait többnyelvűsíthesse
- Önálló termék
- Nyelvfüggő objektumok, amelyek fordításra kerülnek:
ablak leírások (.jform)
panel leírások (.xml)
Kódlisták (.xml)
szövegek (.xml)
címek (.xml)
kódértékek (adatbázisban tárolt listák)
súgók (.html)
TranTools tulajdonságok
- Felhasználóbarát interface
- Menürendszer egyszerű
- Képes párhuzamosan több projekt kezelésére!!
- A használni kívánt nyelv futás közben változtatható anélkül, hogy az üzleti logika sérülne
- Kódtáblák nyelvfüggő információinak fordítása
- Képes legenerálni a teljes vagy rész nyelvfüggő forrásokat
- Korábbi fordítások mentődnek
- Frissíti a segédkönyvtár tartalmát
TranTools működése
- Beolvassa az alkalmazás installációs fájlját (.ear)
- Kicsomagolja azt egy segédkönyvtárba
- Összegyűjti a nyelvfüggő adatokat Excel munkalapra - fordításra
- A lefordított eredményt (Excel) visszatölti a megfelelő helyekre
- Exportálja/importálja a HTML információkat a fordításhoz
- Új verziójú .ear fájlt generál, amely tartalmazza már az új nyelvvel kiegészített forrásokat
Hogyan működik a TranTools?A TranTools kezeli az többnyelvűsítendő alkalmazás két fő részét:
• a projektet
• az adatbázisban tárolt kódtáblákat
Fő lépések a TranTools-ban:
Új projekt betöltése az installációs fájlból (.ear)
TranTools menüje
Projekt információ
Nyelvek beállítása
Nyelvi adatok exportja Excel munkalapra:
Nyelvi adatokat tartalmazó - még üres - Excel munkalap
Nyelvi adatokat tartalmazó – már kitöltött - Excel munkalap
Lefordított szövegek visszatöltésének indítása
Lefordított szövegek visszatöltésének eredménye
Fordítás után legenerálhatjuk a nyelv függő objektumokat
Generálás után ellenőrizzük az eredményt
A hibalistában szereplő tételek javítása, új .ear generálás
Javítási lehetőségek:
• Kijavítjuk a szövegeket az Excel munkalapon pl. rövidítünk
• A képernyőn átszervezzük az objektumokat, hogy legyen elég hely a hosszabb feliratoknak is
Ha minden javítást megtettünk,
Akkor elkészítjük az új
telepíthető csomagot.
Telepítés után
A telepítés után lehetőség van kiválasztani akár az alkalmazás kezdő – pl. Bejelentkező - képernyőjén, hogy melyik nyelven kívánjuk az alkalmazást használni:
Már többnyelvűsített projekt frissítése időről-időre: (Upgrade project…)
Adatbázisban tárolt adatok többnyelvűsítése
Adatbázisban tárolt adatok többnyelvűsítése
A többnyelvű kódérték megjelenik az adatbázis táblában
Példaképernyők
Példaképernyők
Példaképernyők
Köszönöm a figyelmet!