1. NetBeans IDE: Lage en enkel mobilapplikasjon

Avdeling for informatikk og e-læring, Høgskolen i Sør-Trøndelag NetBeans IDE: Lage en enkel mobilapplikasjon Mildrid Ljosland/Lene Hoff 09.09.2008 Lærestoffet er utviklet for faget SO350D J2ME for programmering av mobile enheter 1. NetBeans IDE: Lage en enkel mobilapplikasjon Resymé: Denne leksjonen tar for seg programmet NetBeans IDE 5.5 for å utvikle en enkel mobilapplikasjon og kjøre den. Innhold 1.1. INNLEDNING... 1 1.2. NEDLASTING OG INSTALLASJON... 1 1.3. GRENSESNITTET TIL NETBEANS IDE... 2 1.4. LAGE EN ENKEL MOBILAPPLIKASJON... 4 1.4.1. Opprette et prosjekt... 4 1.4.2. Opprette klasser... 6 1.4.3. Sett inn kode... 8 1.4.4. Kompilere og kjøre applikasjonen... 9 1.1. Innledning I leksjon 1 lærte dere hvordan J2ME Wireless Toolkit kan brukes for å lage mobilapplikasjoner. Dette er et veldig enkelt program med få muligheter. Du må blant annet bruke en egen teksteditor for å programmere selve klassene. Vi skal nå se på et alternativ til dette programmet som samler all utviklingen på samme sted. Programmet heter NetBeans IDE 6.1 og er forholdsvis enkel å bruke i forbindelse med mobilapplikasjoner. Det kan også brukes for å lage vanlige javaapplikasjoner og webapplikasjoner. Dette gjør at programmet i første omgang kan se noe omfattende ut, men etter kort tid vil du kunne bruke det effektivt. Programmet er frivillig å bruke, så denne leksjonen er kun et tilbud for dere som ønsker å se nærmere på programmet. 1.2. Nedlasting og installasjon NetBeans IDE 6.1 kan du laste ned fra følgende nettsted: http://www.netbeans.org/index.html Når du trykker på knappen Download NetBeans IDE får du opp et valg mellom en rekke ulike versjoner. Velg Mobilty (eller eventuelt All hvis du planlegger å bruke J2EE eller andre

NetBeans IDE: Lage en enkel mobilapplikasjon side 2 av 10 ting i tillegg til J2ME). Dette programmet fungerer mot J2SE versjon 5 og 6. (Har du en eldre versjon av Java, må du enten oppgradere den eller velge en eldre versjon av NetBeans. Det enkleste er antakelig å gå til http://java.sun.com/javase/downloads/netbeans.html å få både Java og Netbeans i en pakke.) 1.3. Grensesnittet til NetBeans IDE Grensesnittet til NetBeans IDE er delt inn i flere deler. Når du åpner programmet vil det bestå av en toppmeny, Prosjektpanel og et Innholdspanel (i figuren under er det opprettet et prosjekt med en klasse som vi snart kommer tilbake til). Her ser du prosjektet som vi snart skal lage: Faner med filer Meny for fil i innholdspanel Toppmeny Prosjektpanel Navigasjonspanel Innholdspanel I toppmenyen finner du en del vanlige knapper som lukke, åpne, lagre, klippe, lime ol. Videre finnes knapper for å kompilere og kjøre programmer. Beveg musmarkøren over de ulike knappene for å få opp en beskrivelse (prøv dette når du har opprettet et prosjekt, se neste punkt). Til venstre har vi et prosjektpanel med fanene Projects, Files, Services. I Projects vil du se alt som hører til et prosjekt som alle klassene og de pakker som de er lagt i. Hver gang et prosjekt opprettes vil det bli laget en mappestruktur for prosjektet hvor alle de ulike filene legges. Under Files-fanen vil du kunne se klassene og hvilke mapper de ligger i. Javafilene ligger i mappen src, mens class-filene plasseres i build/compiled når de kompileres. Denne visningen vil tilsvare for eksempel Utforsker i Windows. Legg merke til at det står en + foran flere av mappene i prosjektpanelet. Hvis vi trykker på denne + vil noden utvide seg med alt innhold, se figur under som viser utdrag av prosjektpanelet (Projects til venstre i figuren ovenfor):

NetBeans IDE: Lage en enkel mobilapplikasjon side 3 av 10 Her ser du klassen HeiVerdenMidlet med de komponenter den består av. Når du dobbelklikker på en klasse i prosjektpanelet, vil den åpnes i innholdspanelet, se figur under. I dette panelet finnes det knapper for å søke, sette inn bokmerke, velge et navn i kildekoden og velge å gå til andre steder dette navnet brukes, sette inn/fjerne tabulatorer, markere tekst som kommentar ol. Gjør deg kjent med denne menyen, det kan lette videre arbeid. Du kan også få opp en egen meny ved å høyreklikke på musmarkøren over ulike deler av kildekoden. I nedre venste del av vinduet får vi opp et panel med en meny som er spesifikk for denne klassen. I menyen er det først en nedtrekksliste som består av alle variabler og metoder i klassen. Ved å velge en variabel/metode i listen vil denne vises i innholdspanelet. Meny for klasse som vises i innholdspanelet Under menyvalget Tools/Options er det mulig å endre på mange egenskaper som for eksempel hvordan kildekoden ser ut i innholdspanelet.

NetBeans IDE: Lage en enkel mobilapplikasjon side 4 av 10 Under Help / Keyboard Shortcuts Card finner du en oversikt over hurtigtaster som kan brukes i programmet. Etter hvert som du blir kjent med programmet vil disse kunne effektivisere ditt arbeid. 1.4. Lage en enkel mobilapplikasjon En aktivitet i NetBeans kan startes på flere måter. I denne beskrivelsen bruker vi hovedsakelig menyvalg. Et menyvalg gjøres ofte i flere trinn. Hvert trinn settes opp med skråstrek mellom, for eksempel: File / New. Verktøylinja øverst på skjermen og tastekombinasjoner kan også brukes. Du skal nå lage en enkel HeiVerden-mobilapplikasjon. 1.4.1. Opprette et prosjekt Når man lager applikasjoner som består av flere filer, er det en fordel å organisere dem i et prosjekt. Fordelen med det er at da kan man kompilere alle filene på en gang, det gis en oversikt over alle filer som prosjektet består av og man kan konfigurere unike innstillinger til akkurat dette prosjektet. Prosjektet vil omfatte alle filer som hører sammen med programmet ditt inkludert de som blir generert,.java/.class/.html/.gif. Nå skal du starte med å opprette et prosjekt. Velg File / New Project og du vil få opp en dialogboks, se figur under. Her kan du velge hvilke type prosjekt du vil opprette. Vi ønsker å lage en Mobilapplikasjon og velger derfor Mobility under Categories og MIDP Application under Projects. Legg merke til at det er flere valg under Projects, for blant annet å importere eksisterende prosjekter. Trykk Next.

NetBeans IDE: Lage en enkel mobilapplikasjon side 5 av 10 I neste dialogboks kan du skrive inn navnet på prosjektet, her HeiVerdenMobil, samt hvor du vil lagre prosjektet. Legg merke til at det vil opprettes en prosjektmappe under den mappen du velger med navnet på selve prosjektet. Her får du også valg om du ønsker å automatisk generere en Hello MIDlet. Det ønsker vi ikke, og tar derfor bort dette krysset. Trykk Next (for senere anledning kan du også trykke Finish her når du ikke skal endre på noe i neste dialogboks). I neste dialogboks kan du velge hvilke versjoner prosjektet ditt skal støtte og hvilken telefon du vil vise programmet på (de samme telefoner som med emulatoren). Trykk Finish.

NetBeans IDE: Lage en enkel mobilapplikasjon side 6 av 10 Du vil nå få generert et nytt prosjekt i prosjektpanelet. Hvis du klikker på Files-fanen vil du se hvilken mappestruktur som foreløpig er generert. I src-mappen vil all kildekoden plasseres. 1.4.2. Opprette klasser Nå er du klar for å legge til klasser i prosjektet. Velg HeiVerdenMobil-noden i Projectsfanen vi nettopp så på. Nå kan du trykke på File / New File (alternativet er å høyreklikke på noden HeiVerdenMobil-noden og velge New / MIDlet for å hoppe over første dialogboks). En dialogboks åpnes hvor vi kan velge hvilken type klasse som skal lages, se figuren under. Velg kategorien MIDP og filtypen MIDlet. Trykk Next.

NetBeans IDE: Lage en enkel mobilapplikasjon side 7 av 10 I neste dialogboks, se under, skriver du inn HeiVerdenMidlet under MIDlet Name. Resten av valgene gjør NetBeans for deg. Legg merke til at filen legges i src-mappen. Trykk Finish. Du har nå laget MIDlet-klassen HeiVerdenMidlet. Hvis du dobbeltklikker på klassen i Projects-fanen vil klassen åpnes i innholdspanelet:

NetBeans IDE: Lage en enkel mobilapplikasjon side 8 av 10 Her ser du at de nødvendige metodene er ført opp i klassen, samt de import-setninger vi trenger for å lage brukergrensesnitt. 1.4.3. Sett inn kode Neste steg er å legge inn koden for mobilapplikasjonen. Vi ønsker bare å legge til en enkel tekstboks, samt en Avslutt-kommando. Legg til koden som er markert med uthevet skrift under: /* * HeiVerdenMidlet.java * * Created on 11. januar 2007, 13:05 */ import javax.microedition.midlet.*; import javax.microedition.lcdui.*; /** * * @author mildrid * @version */ public class HeiVerdenMidlet extends MIDlet implements CommandListener{ private Command avslutt; private TextBox hei;

NetBeans IDE: Lage en enkel mobilapplikasjon side 9 av 10 public void startapp() { Display.getDisplay(this).setCurrent(hei); public void pauseapp() { public void destroyapp(boolean unconditional) { public HeiVerdenMidlet() { avslutt = new Command("Avslutt", Command.EXIT, 0); hei = new TextBox("Hei", "Hei Verden!", 50, TextField.ANY); hei.addcommand(avslutt); hei.setcommandlistener(this); public void commandaction(command c, Displayable d) { if (c == avslutt) notifydestroyed(); Selve koden blir forklart i leksjon 2. Etter hvert som du skriver koden vil du få litt hjelp. Hvis du skriver inn et objektnavn og punktum vil du få opp en popupboks som viser alternativer metoder for dette objektet. Hvis denne ikke kommer opp kan du trykke på Ctrl+space. 1.4.4. Kompilere og kjøre applikasjonen Vi ønsker nå å prøve vår nye mobilapplikasjon. Vi kan enten kjøre prosjektet direkte, da vil det kompileres først. Eller vi kan sette i gang kompileringen selv. Det er flere veier å gå for å kompilere prosjektet: - Høyreklikke på prosjektnoden i prosjektpanelet. I popupmenyen velges Build. Nå vil hele prosjektet kompileres. - Velg klassen du vil kompilere og trykk F9 for å kompilere denne klassen, eventuelt F11 for å kompilere hele prosjektet. - Trykk på knappen Build Main Project. Under kompilering vil det komme opp et output-vindu helt nederst i vinduet. Her vises resultatet av kompileringen. Hvis alt gikk greit står det BUILD SUCCESSFUL på slutten. Alle System.out.println-setninger som eventuelt står i klassene vil vises i dette outputvinduet. Du kan også se under Files-fanen at det har kommet opp en ny mappe; dist. I denne mappen vil du finne jar- og jad-filen for prosjektet.

NetBeans IDE: Lage en enkel mobilapplikasjon side 10 av 10 På samme måte som over kan vi kjøre prosjektet på flere måter. En måte er å høyreklikke på prosjektnoden og velge Run, andre måter er å bruke knappen Run Main Project eller trykke F6.