iPhone Hei Maailma tutoriaali

T’ällä kerralla käydään läpi yksinkertaisen “Hei Maailma”-sovelluksen tekeminen iPhone:lle. Tutoriaali olettaa, että olet asentanut kehitysympäristön, joten jos et vielä ole, niin katso Artun kirjoittama artikkeli Näin aloitat iOS-kehityksen. Artikkelissa ei mennä vielä Objective-C:hen saloihin, vaikkakin pari riviä tullaan sitäkin copy+pasteamaan.

Avaa Xcode, tee uusi projekti File -> New Project ja valitse View-based Application.

XCode

View-based Applicationit sisältävät yhden näkymän, joka on heti valmiiksi käytettävissä. Monimutkaisemmat monen näkymän sovellutukset on hyvä toteuttaa Window-based Applicationina.

Valitse projektisi tallennuspaikka ja nimeksi HellowWorld (Huomaa HellowWorld, kiiressä luotu projekti sisälsi nimessään yhden kirjaimen liikaa :)). Tallennettuasi uuden projektin, pitäisi XCoden avautua alla olevan kaltaiseen näkymään.

Xcode mainviewProjekti on nyt alustettu ja siihen on liitetty myös yksi näkymä view.  Avaa HellowWorldViewController.h tiedosto editoriin ja korvaa siellä näkyvät lähdekoodi alla olevalla.

#import <UIKit/UIKit.h>

@interface HellowWorldViewController : UIViewController {
    IBOutlet UILabel* heiMaailmaLabel;
}
@property (nonatomic, retain) IBOutlet UILabel *heiMaailmaLabel;

-(IBAction)nappiaPainettu:(id)sender;

@end

Otsikkotiedosto on nyt valmis. Kiinnitä huomioita IBOutlet ja IBAction termeihin. IBOutlet viittaa siihen, että viewcontroller käskyttää näkymää ja IBAction sitä, että näkymä käskyttää viewcontrolleria.

Avaa seuraavaksi HellowWorldViewController.m tiedosto. .m-tiedostot toteuttavat otsikkotiedostossa olevan luokan kuvauksen Class implemantation file.
Tee siihen alla olevat lisäykset.

#import "HellowWorldViewController.h"

@implementation HellowWorldViewController

@synthesize heiMaailmaLabel;

-(IBAction)nappiaPainettu:(id)sender{
	heiMaailmaLabel.text = @"Hei Maailma!";
}
//Monta riviä komentoitua tekstiä
//...
//Ja pari metodia johon ei tarvitse koskea.
- (void)dealloc {
	[heiMaailmaLabel release];
    [super dealloc];
}
@end

Lähdekoodit on nyt kirjoitettu ja voidaan siirtyä näkymän rakentamiseen. Tupla klikkaa HellowWorldViewController.xib tiedostoa ja Interface Builder aukeaa. Alla olevaan näkymään.

Xcode_interface_builder

Valitse Library ikkunasta Round Rect Button – komponentti ja raahaa se harmaaseen View-ikkunaan. Liikuta nappi keskelle alas ja muuta komponentin asetuksista Title-kenttään teksti “Paina Tästä”. Button Attributes – näkymän saa esille, kun nappi on valittu ja painat Command key icon+1.

UIButton_IOSKun nappi on aseteltu, etsi Library-näkymästä Label-komponentti ja raahaa sekin harmaaseen näkymään. Isonna Label-komponenttia vetämällä sen reunoista, tyhjennät Text-kenttä ja valitse Layout -> keskitys. Näkymäsi pitäisi nyt näyttää tältä.

Interfacebuilder_ViewLisätään seuraavaksi nappiin aikaisemmin määrittelemmä IBAction. Paina kerran näkymässä näkyvää Paina Tästä-nappia ja tämän jälkeen Command key icon+2, jolloin saat näkyviin Button Connections-näkymän. Paina ctrl nappi pohjaan ja vedä hiirellä Touch Up Inside pallurasta yhteys File’s Owneriin ja valitse nappiaPainettu:.

Alla oleva kuva havainnoillistanee asiaa.Interfacebuilder_IBActionNäin liitimme aiemmin lähdekoodissa määritelemmä IBAction-tapahtuman tapahtuvaksi, kun sormi nousee ylös Paina Tästä-napista. Huomaa, että hiukan epäintuitiivesti napin painaminen tarkoittaa iOS-laitteissa sitä, että sormi nostetaan pois napilta.

Aiemmin lähdekoodissa määritelemmä IBOutlet yhdistetään nyt näkymään. Valitse File’s Owner, paina ctrl-nappi pohjaan, vedä yhteys Label:iin ja valitse heiMaailmaLabel.intefacebuilder_IBOutlet

Tallenna näkymä Command key icon+s, palaa takaisin XCodeen ja  paina Build & Run .

Simulaattorin pitäisi nyt pyörähtää käyntiin ja näyttää tekemäsi sovellus.

iphone_hello_worldHeipä vain maailma ! Ensi kerralla jotain vähän erikoisempaa.

Näin pääset Android kehityksessä alkuun

Android sovelluskehityksen alkuun pääset helposti ja nopeasti sekä ilman kustannuksia. Yleisin tapa kehittää Android applikaatioita on asentaa Android Development Tools (ADT) lisäosa Eclipse kehitysympäristöön. Eclipse on avoimen lähdekoodin kehitysympäristö ja saatavissa osoitteesta http://www.eclipse.org/. ADT on Googlen tarjoama lisäosa ja saatavissa osoitteesta http://developer.android.com/. Näiden lisäksi tarvitset vielä Android SDK:n, joka on niinikään saatavissa ilmaiseksi developer.android.com-sivustolta.

Android SDK sisältää kehitys- ja paketointityökalut sekä Android emulaattorin. Lisää tarvittaessa SDK:hon haluamiasi virtuaalisia puhelimia ja tabletteja, joilla haluat ohjelman toimivan. Vaihtoehtoisesti voit käyttää mahdollisesti taskussasi olevaa Android puhelinta — jossa ohjelma toimii yleensä huomattavasti jouhevammin, verrattuna emulaattoriin. Puhelimen asetuksista tarvitsee vain vaihtaa (Applications > ) Unknown sources päälle, jotta voit asentaa ohjelmia Android Marketin ulkopuolelta. Myös (Applications > Development > ) USB debugging pitää olla päällä, jotta voit tarkastella puhelimen loki tiedostoja Eclipsestä.

Seuraavaksi on aika luoda uusi projekti ohjelmaasi varten. Luo uusi Android projekti Eclipseen (File -> New -> Other -> Android project), ja täytä tarvittavat tiedot perus projektitiedostojen luontia varten. Näiden tietojen pohjalta projektiisi tulee AndroidManifest.xml tiedosto, joka määrittelee ohjelman perustiedot ja asetukset. src-hakemistoon tulee ohjelman Java-lähdekoodit ja res-hakemiston alle tulevat kuvat, ulkoasumääritykset sekä lokalisointi. Eclipse luo Aktiviteetin lähdekoodin, mikä on suoraan ajettavissa laitteella. Kun ohjelman käynnistää, tulostaa se näytölle tekstin “Hello World, HelloActivity!”. Ohjelman perusrakenne selviää alla olevasta kuvasta:

Kun olet muodostanut ensimmäisen projektisi pohjan yllä olevan ohjeen mukaan, on aika kokeilla sitä emulaattorissa (tai puhelimessasi). Valitse projektista Run As > Android Application. Seuraavaksi valitset emulaattorin, johon haluat ohjelmasi asennettavan. Valittuasi laitteen Eclipse kääntää sovelluksen lähdekoodit ohjelmaksi, paketoi sen, siirtää, asentaa ja käynnistää ohjelmasi laitteessa. Näin voit testata ohjelmaa emulaattorissa ja samalla saat ohjelman lokitietoja Eclipseen LogCat-näkymään.

Seuraavissa artikkeleissa perehdymme tarkemmin Android-sovellusten kehittämiseen sekä siihen liittyviin teknologioihin, komponentteihin ja menetelmiin. Sitä odotellessa, developer.android.com sivusto tarjoaa paljon tietoa Android-sovelluskehityksestä ja suosittelemme viettämään aikaa myös siellä :)

Näin aloitat iOS-kehityksen

Tämän artikkelin tarkoituksena on esitellä iOS-kehittämiseen liittyviä perusasioita ja työkaluja pintapuolisesti. Seuraavissa artikeleissa käydään läpi ympäristöä ja työkaluja ja kielen syntaksia syvemmin esimerkkien avulla.

Miksi kehittää ohjelmia iOS-alustalle?

  • Hyvät kehitystyökalut. Xcode ja Interface Builder
  • Vain kaksi erilaista laitetta huomioitavana. Toisin kuin muilla alustoilla, on iOS-alustalla vain kaksi eri huomioitavaa laitetyyppiä: iPhone ja iPad.
  • Ohjelmien julkaisukanava. App Store on tällä hetkellä maailman suurin mobiiliohjelmien kauppa.
  • Hyvät valmiit UI-komponentit. Hyvältä näyttävien ja toimivien käyttöliittymien teko on helppoa. Valmiiden UI-komponenttien muokkaaminen ei olekaan sitten ihan niin helppoa…
  • Hyvin dokumentoitu ympäristö. Apple on kirjoittanut kattavan dokumentaation iOS-ympäristön rajapinnoista ja luokista.

Tekniset vaatimukset

iOS-ohjelmien kehityksen aloittaminen on vaivatonta ja osittain ilmaista. Osittain ilmaista siksi, että kehitystyökalut on ilmaisia, mutta ilman $99/vuosi maksavaa kehittäjälisenssiä ohjelmia ei voi ajaa laitteella, eikä julkaista App Storessa. Lisäksi aivan kaikki Applen tekemät esimerkit ja oppaat eivät ole esillä muille kuin maksaneille. Ilmaiseksi pääsee kuitenkin lukemaan suurta määrää oppaita ja itse tekemiä ohjelmia voi ajaa simulaattorissa, joten perusteita opetellessa ei tarvitse, eikä välttämättä kannata maksaa mitään.

iOS-kehittämisen aloittamiseen tarvitaan vain kolme asiaa: uudehko Mac-tietokone, Xcode-kehitysympäristö ja iOS SDK.

Ohjelmat kehitetään pääasiassa Mac-tietokoneilla. Ainoa laitteistovaatimus on OS X Snow Leopard -käyttöjärjestelmä, eli versio 10.6, joka on tullut uusien Mac-koneiden mukana vuoden 2009 puolivälistä lähtien.

Pääasiallinen kehitysympäristö on Xcode. Toki ohjelmakoodin kirjoittamiseen voi käyttää jotain muutakin editoria, mutta alussa ei kannata ampua itseään jalkaan, vaan käyttää Xcodea, kunnes koodaaminen alkaa sujua. Xcode on ilmainen, ja ladattavissa iOS Dev Centeristä. Dev Centeristä lataaminen vaatii rekisteröitymisen Apple-kehittäjäksi, mutta se ei onneksi tarkoita sielunsa myymistä Stevelle, eikä maksa mitään. Dev Center sisältää valtavan määrän dokumentaatiota, esimerkkejä ja ohjeita iOS-kehitykseen.

Tällä hetkellä uusin Xcoden uusin versio on 3.2.5 ja iOS SDK:n on 4.2. Molemmat saa ladattua yhtenä pakettina täältä (paketin koko on n. 3,52 GB).

Xcoden projektinäkymä.

Millä kielellä?

iOS-ohjelmat kehitetään pääasiassa Objective-C -kielellä. Se on laajennus C-kieleen ja tuo mukanaan mm. oliomallin, ollen kuitenkin täysin yhteensopiva C:n kanssa. Apple hyväksyy App Storeen vain Objective-C:llä, C:llä ja C++:lla kirjoitettuja ohjelmia, joten muita kieliä ei ohjelmien kehityksessä voi käyttää.

Simulaattorilla vai oikealla laitteella?

Helpoin ja ilmainen tapa tutustua Objective-C -kieleen ja Cocoa Touchiin, on ajaa ohjelmia simulaattorilla. Simulaattori näyttää iPhone- ja iPad-ohjelmat sellaisena kuin ne näkyisivät itse laitteellakin. Huomaa, että simulaattorissa ei toimi ominaisuudet jotka käyttävät kiihtyvyyssensorin lukemia ja GPS-paikanninta ja kompassia käyttävät ominaisuudet eivät toimi simulaattorissa.

Simulaattorin käyttäminen sopii hyvin iOS-ohjelmoinin opetteluun; se käynnistyy nopeasti ja toimii nopeasti. Valmiin ohjelman lopullinen testaaminen on kuitenkin syytä suorittaa oikealla laitteella, sillä ohjelma saattaa käyttäytyä hieman eri tavalla kuin simulaattorissa. Fyysisen laitteen käyttäminen kehittämisessä edellyttää iOS Developer Program -jäsenyyttä, joka maksaa $99 vuodessa. Jäsenyys mahdollistaa ohjelmien julkaisun App Storessa. Lisää tietoja iOS Developer Programista saa täältä.

Xcoden perusteet

Seuraavassa ohjeessa luodaan tyhjä Xcode-projekti ja ajetaan se simulaattorissa.

  1. Rekisteröidy Apple-kehittäjäksi osoitteessa http://developer.apple.com/devcenter/ios/ Oikeasta yläkulmasta löytyy linkki rekisteröitymiseen.
  2. Lataa uusin Xcode ja iOS SDK samalta sivulta rekisteröitymisen ja kirjautumisen jälkeen. Paketti on ylin linkki, jossa lukee “Xcode 3.2.5 and iOS SDK 4.2″ 
  3. Käy kahvilla 3,5 gigan paketin latautuessa.
  4. Käynnistä Xcode. Edessäsi pitäisi näkyä Xcoden käynnistysikkuna.
  5. Luo uusi projekti valitsemalla “Create a new Xcode project” Xcoden käynnistysikkunan vasemmalta puolelta.
  6. Valitse projektiksi iPhone-ohjelma valitsemalla vasemmalta palstalta, iOS-kohdan alta “Application”, ja oikealla näkyvältä alueelta “View-based Application”.
  7. Tallenna projekti haluamallasi nimellä.
  8. Nyt sinulla on edessäsi projekti joka sisältää iPhone-ohjelman rungon. Ohjelman voi käynnistää, mutta se piirtää ruudulle vain harmaan kuvan.
  9. Käynnistä ohjelma painamalla projekti-ikkunan yläpalkista vasaran ja vihreän play-painikkeen näköistä kuvaketta, jossa lukee “Build and Run” , tai valitsemalla ohjelman ylävalikosta Run -> Run.
  10. Simulaattorin pitäisi käynnistyä ja näyttää harmaata kuvaa.

Esimerkkiohjelma ajossa iPhone-simulaattorissa.

Seuraavassa artikkelissa kerromme iOS-ohjelmien toimintaperiaatteesta ja laitamme simulaattorin näyttämään jotain hienompaa kuin harmaan ruudun!

Yhteenveto kehittämiseen tarvittavista asioista

  1. Mac-tietokone jossa on OS X Snow Leopard (10.6)
  2. Rekisteröityminen Apple-kehittäjäksi
  3. XCode ja iOS SDK
  4. Mielenkiintoa opetella Objective-C:n syntaksi (se ei ole ollenkaan niin vaikeaa miltä se näyttää ;))

Linkkejä

  1. iOS Dev Center
  2. iOS Developer Program