Sisällysluettelo:

Laskimen tekeminen Xcode -ohjelmassa Swiftin avulla: 9 vaihetta
Laskimen tekeminen Xcode -ohjelmassa Swiftin avulla: 9 vaihetta

Video: Laskimen tekeminen Xcode -ohjelmassa Swiftin avulla: 9 vaihetta

Video: Laskimen tekeminen Xcode -ohjelmassa Swiftin avulla: 9 vaihetta
Video: Tip Calculator app - iOS application 2024, Marraskuu
Anonim
Image
Image

Tässä nopeassa opetusohjelmassa näytän sinulle, miten voit luoda yksinkertaisen laskimen Swiftin avulla Xcodessa. Tämä sovellus on rakennettu näyttämään lähes identtiseltä alkuperäisen iOS -laskin -sovelluksen kanssa. Voit joko seurata ohjeita vaihe vaiheelta ja rakentaa laskimen kanssani, tai voit yksinkertaisesti siirtyä viimeiseen vaiheeseen ja kopioida ja liittää koodin näkymän ohjaimeen. Jos kuitenkin teet tämän, varmista, että liität kaikki kuvakäsikirjoituksen elementit näkymän ohjaimeen.

Vaihe 1: Projektin luominen

Kuvakäsikirjoituksen asettelu
Kuvakäsikirjoituksen asettelu

Ensimmäinen askel laskimen tekemisessä on itse luoda projekti Xcode -ohjelmassa. Voit tehdä tämän napsauttamalla "Luo uusi Xcode -projekti" ja nimeämällä sen haluamallasi tavalla. Nimesin omani "Laskin". Seuraava vaihe on valita sovellustyypiksi "Single View Application". Pidä kaikki muut tiedot oletusarvona.

Vaihe 2: Kuvakäsikirjoituksen asettelu

Vaihe 2 laskimen luomisessa edellyttää, että suunnittelet kuvakäsikirjoituksen perusasettelun. Ennen kuin aloitat tämän, suosittelen vaihtamaan simulaattorisi iPhone 7 Plus -laitteeseen. Aloita vetämällä painike kuvakäsikirjoitukseen ja muuttamalla sen mitat 89 x 89. Muuta sen taustaväri elohopeaksi määritteiden tarkastajalla ja fonttiväri volframiksi. Säädä seuraavaksi fontti Helvetica Light 30. Jatka painikkeen kopiointia ja liittämistä, kunnes niitä on yhteensä 20. Säädä näiden painikkeiden asettelua siten, että sinulla on viisi riviä ja neljä saraketta.

Vaihe 3: Kuvakäsikirjoituksen suunnittelu ja estetiikka

Kuvakäsikirjoituksen suunnittelu ja estetiikka
Kuvakäsikirjoituksen suunnittelu ja estetiikka

Poista alarivin toinen painike ja laajenna ensimmäinen painike ottaaksesi tämän tilan haltuun. Muuta tämän painikkeen paikkamerkki arvoksi nolla. Jatka kunkin painikkeen numeroarvojen ja symbolien muuttamista, kunnes se on käytännössä sama kuin yllä oleva kuva. Ominaisuuksien tarkastajan tummempi harmaa väri on hopea, oranssi väri mandariini ja fontin väri muuttuu oranssin painikkeiden lumiseksi. Napsauta seuraavaksi näkymän ohjainta ja muuta sen taustaväri mustaksi. Lisää etiketti painikkeiden yläpuolelle ja säädä sen kokoa haluamallasi tavalla. Kohdista teksti oikealle ja vaihda tarran fontiksi Helvetica light 70. Halutessasi voit lisätä rajoituksia kaikkiin elementteihin, jotta sovellus näyttää samanlaiselta kaikilla laitteilla.

Vaihe 4: Elementtien yhdistäminen ja integrointi

Elementtien yhdistäminen ja integrointi
Elementtien yhdistäminen ja integrointi
Elementtien yhdistäminen ja integrointi
Elementtien yhdistäminen ja integrointi

Avaa määritteiden tarkastaja ja vaihda jokaisen numeropainikkeen tunniste. Tunnisteen tulee olla 1 enemmän kuin todellinen numeerinen arvo. Esimerkiksi #0 -painikkeen tunnistearvon on oltava 1, painikkeen #1 tagin arvo 2, painikkeen #2 tunnisteen arvon 3 ja niin edelleen. Paina seuraavaksi ohjainta, napsauta #0 -painiketta ja vedä se näkymäohjaimen päälle. Ponnahdusikkunan pitäisi näkyä näytöllä. Muuta yhteys toimintatavaksi, tyypiksi UIButton, tapahtumaksi Touch Up Inside, argumentteiksi Lähettäjä ja sen nimeksi numero. Voit muuttaa nimen haluamallasi tavalla, mutta se tarkoittaa, että sinun on vaihdettava nimi uudelleen, kun kutsut toimintoa myöhemmin ohjelmassa. Seuraavaksi ohjaa, napsauta ja vedä jokainen numeropainike juuri luomaamme toimintoon. Ohjaa, napsauta ja vedä tarra ohjelmaan, mutta EI toimintoon. Tämä tarkoittaa, että lisäät tarran toimintoon erillisenä muuttujana. Muista, että jos olet koskaan hämmentynyt koodista, olen jättänyt kaiken koodini käytettäväksi tämän ohjeen viimeisessä vaiheessa.

Vaihe 5: Muuttujien määrittäminen

Muuttujien määrittäminen
Muuttujien määrittäminen

Jotta numeropainikkeemme toimisivat, meidän on liitettävä niiden arvo numerot -toiminnon tarraan. Voit tehdä tämän luomalla ensin muuttujan "numberOnScreen" ja tekemällä sen tyypiksi double ja yhtä suuri kuin 0: var numberOnScreen: Double = 0; Ja älä unohda, jos tässä oleva koodi on hieman epäselvä, olen jättänyt sinulle koko koodin viimeisessä vaiheessa, jotta voit käyttää mielesi mukaan. Luo seuraavaksi toinen muuttuja 'performanceMath', jonka tyyppi on bool, ja tee siitä epätosi: var performanceMath = false; Luo myös toinen muuttuja nimeltä "previousNumber", jonka tyyppi on double, ja aseta se arvoksi 0: var previousNumber: Double = 0; Viimeinen muuttuja, joka sinun on luotava, on "operation" -muuttuja. Aseta arvoksi 0: var operaatio = 0;

Vaihe 6: Numeropainikkeiden toiminto

Numeropainikkeet Toiminto
Numeropainikkeet Toiminto

Kun olet määrittänyt sopivat muuttujat, voit jatkaa tämän koodin kopioimista ja liittämistä 'numerot' -toimintoosi:

if performanceMath == true {

label.text = Jono (sender.tag-1)

numberOnScreen = Tuplaa (label.text!)!

performanceMath = epätosi

}

muu {

label.text = label.text! + Jono (sender.tag-1)

numberOnScreen = Tuplaa (label.text!)!

}

Pohjimmiltaan tämä koodi näyttää tietyt numerot tarrassa, kun asianmukaista painiketta painetaan. Meidän on kuitenkin kyettävä käyttämään kaikkia muita painikkeita ja tekemään laskimesta toimiva. Teemme tämän parin seuraavan vaiheen aikana.

Vaihe 7: Käyttöpainikkeiden integrointi

Toimintopainikkeiden integrointi
Toimintopainikkeiden integrointi
Toimintopainikkeiden integrointi
Toimintopainikkeiden integrointi

Avaa määritteiden tarkastaja ja vaihda kaikkien eri painikkeiden tunniste. Tyhjennä -painikkeen tunnisteen tulee olla 11, jakopainikkeen on oltava 12, kertoamispainikkeen tunnisteen on oltava 13, vähennyspainikkeen tagin on oltava 14, lisäyspainikkeen tunnisteen on oltava 15, ja yhtäsuuripainikkeen tunnisteen tulisi olla 16. Paina sitten ohjainta, napsauta tyhjennyspainiketta ja vedä se näkymäohjaimen päälle. Ponnahdusikkunan pitäisi näkyä näytöllä. Muuta yhteys toimintatavaksi, tyypiksi UIButton, tapahtumaksi Touch Up Inside, argumentteiksi Sender ja sen nimeksi painikkeet. Voit muuttaa nimen haluamallasi tavalla, mutta se tarkoittaa, että sinun on vaihdettava nimi uudelleen, kun kutsut toimintoa myöhemmin ohjelmassa. Seuraavaksi ohjaa, napsauta ja vedä jokainen sekapainike juuri luomaamme toimintoon.

Vaihe 8: Muut painikkeet -toiminto

Sekalaiset painikkeet Toiminto
Sekalaiset painikkeet Toiminto

Kun olet liittänyt kaikki merkityt sekalaiset painikkeet asianmukaiseen toimintoonsa, voit aloittaa koodin lisäämisen painiketoimintoon:

previousNumber = Kaksinkertainen (label.text!)!

jos sender.tag == 12 {// Jaa

label.text = "/";

}

jos sender.tag == 13 {// Kerro

label.text = "x";

}

jos sender.tag == 14 {// Vähennä

label.text = "-";

}

jos sender.tag == 15 {// Lisää

label.text = "+";

}

operaatio = lähettäjä.tagi

performanceMath = true;

}

muuten jos sender.tag == 16 {

jos operaatio == 12 {// Jaa

label.text = Merkkijono (previousNumber / numberOnScreen)

}

muuten jos operaatio == 13 {// Kerro

label.text = Merkkijono (previousNumber * numberOnScreen)

}

else if operaatio == 14 {// Vähennä

label.text = Merkkijono (previousNumber - numberOnScreen)

}

else if operation == 15 {// Lisää

label.text = Merkkijono (previousNumber + numberOnScreen)

}

}

muuten jos sender.tag == 11 {

label.text = ""

edellinenNumero = 0;

numberOnScreen = 0;

toiminta = 0;

}

Pohjimmiltaan tämä koodikappale näyttää yhden eri painikkeista, kun sitä painetaan, ja laskee lopullisen vastauksen ja näyttää sen tarrassa.

Vaihe 9: Koko koodi

Koko koodi
Koko koodi

Jos et halunnut käydä läpi ja rakentaa laskinta askel askeleelta kanssani, voit yksinkertaisesti lisätä elementtejä kuvakäsikirjoitukseen ja kopioida ja liittää koko koodin näkymän ohjaimeen. Tässä on koodi:

Tuo UIKit

luokka ViewController: UIViewController {

var numberOnScreen: kaksinkertainen = 0;

var previousNumber: Tupla = 0;

var performanceMath = false;

var -operaatio = 0;

@IBAction func -numerot (_ lähettäjä: UIButton) {

if performanceMath == true {

label.text = Jono (sender.tag-1)

numberOnScreen = Tuplaa (label.text!)!

performanceMath = epätosi

}

muu {

label.text = label.text! + Jono (sender.tag-1)

numberOnScreen = Tuplaa (label.text!)!

}

}

@IBOutlet heikko var label: UILabel!

@IBAction -toiminnon painikkeet (_ lähettäjä: UIButton) {

if label.text! = "" && sender.tag! = 11 && sender.tag! = 16 {

previousNumber = Kaksinkertainen (label.text!)!

jos sender.tag == 12 {// Jaa

label.text = "/";

}

jos sender.tag == 13 {// Kerro

label.text = "x";

}

jos sender.tag == 14 {// Vähennä

label.text = "-";

}

jos sender.tag == 15 {// Lisää

label.text = "+";

}

operaatio = lähettäjä.tagi

performanceMath = true;

}

muuten jos sender.tag == 16 {

jos operaatio == 12 {// Jaa

label.text = Merkkijono (previousNumber / numberOnScreen)

}

muuten jos operaatio == 13 {// Kerro

label.text = Merkkijono (previousNumber * numberOnScreen)

}

else if operation == 14 {// Vähennä

label.text = Merkkijono (previousNumber - numberOnScreen)

}

else if operation == 15 {// Add

label.text = Merkkijono (previousNumber + numberOnScreen)

}

}

muuten jos sender.tag == 11 {

label.text = ""

edellinenNumero = 0;

numberOnScreen = 0;

toiminta = 0;

}

}

ohita func viewDidLoad () {

super.viewDidLoad ()

// Tee muita asetuksia näkymän lataamisen jälkeen, yleensä nibistä.

}

ohita func didReceivedMemoryWarning () {

super.didReceivedMemoryWarning ()

// Hävitä kaikki resurssit, jotka voidaan luoda uudelleen.

}

}

Suositeltava: