Kazalo:

Kako narediti kalkulator v Xcode z uporabo Swift: 9 korakov
Kako narediti kalkulator v Xcode z uporabo Swift: 9 korakov

Video: Kako narediti kalkulator v Xcode z uporabo Swift: 9 korakov

Video: Kako narediti kalkulator v Xcode z uporabo Swift: 9 korakov
Video: iOS App Development with Swift by Dan Armendariz 2024, November
Anonim
Image
Image

V tej hitri vadnici vam bom pokazal, kako z uporabo Swifta v Xcode ustvariti preprost kalkulator. Ta aplikacija je narejena tako, da izgleda skoraj enako originalni aplikaciji za kalkulator za iOS. Lahko sledite navodilom po korakih in z menoj sestavite kalkulator, ali pa preprosto pojdite na zadnji korak in kodo kopirajte in prilepite v krmilnik pogleda. Če to storite, pa vse svoje elemente na snemalni knjigi povežite s krmilnikom pogleda.

1. korak: Ustvarjanje projekta

Postavitev snemalne knjige
Postavitev snemalne knjige

Prvi korak pri izdelavi našega kalkulatorja je dejansko ustvariti projekt v Xcode. To lahko storite tako, da kliknete »Ustvari nov projekt Xcode« in ga poimenujete, kot želite. Svojega sem poimenoval "Kalkulator". Naslednji korak je, da za vrsto aplikacije izberete "Aplikacija za en pogled". Ostali podatki naj bodo privzeta vrednost.

2. korak: postavitev snemalne knjige

2. korak pri ustvarjanju našega kalkulatorja zahteva, da v snemalni knjigi oblikujete osnovno postavitev. Preden začnete s tem, priporočam, da svojo simulatorsko napravo spremenite v iPhone 7 Plus. Začnite tako, da povlečete gumb na snemalno knjigo in spremenite njene dimenzije v 89 x 89. Spremenite barvo ozadja v živo srebro na pregledovalniku lastnosti in barvo pisave v volfram. Nato nastavite pisavo na Helvetica Light 30. Nadaljujte s kopiranjem in lepljenjem gumba, dokler ne dobite skupaj 20. Prilagodite postavitev teh gumbov tako, da imate pet vrstic in štiri stolpce.

3. korak: Oblikovanje snemalnih slik in estetika

Storyboard Design in estetika
Storyboard Design in estetika

Izbrišite drugi gumb v spodnji vrstici in razširite prvi gumb, da prevzamete ta prostor. Zamenjajte vrednost tega gumba na nič. Še naprej spreminjajte številske vrednosti in simbole vsakega gumba, dokler ni skoraj enak zgornji sliki. Na inšpektorju za atribute je temnejša siva barva srebrna, oranžna barva je mandarina, barva pisave pa se na oranžnih gumbih spremeni v snežno. Nato kliknite krmilnik pogleda in spremenite barvo ozadja v črno. Nad gumbi dodajte oznako in prilagodite njeno velikost tako, da se počutite udobno. Besedilo poravnajte na desno in spremenite pisavo nalepke v Helvetica light 70. Če želite, lahko vsem elementom dodate omejitve, da bo aplikacija videti enako za vse naprave.

4. korak: Povezovanje in povezovanje elementov

Povezovalni in integracijski elementi
Povezovalni in integracijski elementi
Povezovalni in integracijski elementi
Povezovalni in integracijski elementi

Odprite inšpektor za atribute in spremenite oznako za vsak posamezen številski gumb. Oznaka mora biti za 1 večja od dejanske številčne vrednosti. Na primer, gumb #0 mora imeti vrednost oznake 1, gumb #1 mora imeti vrednost oznake 2, gumb #2 mora imeti vrednost oznake 3 itd. Nato pritisnite control, kliknite gumb #0 in ga povlecite na krmilnik pogleda. Na zaslonu se mora pojaviti pojavno okno. Povezavo spremenite v »dejanje«, vrsto v »UIButton«, dogodek v »Dotaknite se znotraj«, argumente v »Pošiljatelj« in njeno ime v »številke«. Ime lahko spremenite v poljubno, vendar to pomeni, da bi morali pri ponovnem klicu funkcije pozneje v programu ime znova spremeniti. Nato nadzirajte, kliknite in povlecite vsak številski gumb v funkcijo, ki smo jo pravkar ustvarili. Zdaj nadzirajte, kliknite in povlecite oznako v program, NE pa v funkcijo. To pomeni, da preprosto vnesete oznako v funkcijo kot ločeno spremenljivko. Ne pozabite: če ste kdaj zmedeni glede kode, sem vso svojo kodo pustil, da jo uporabite na zadnjem koraku tega navodila.

5. korak: Vzpostavitev spremenljivk

Vzpostavitev spremenljivk
Vzpostavitev spremenljivk

Da bi bili naši številski gumbi funkcionalni, bomo morali njihovo vrednost povezati z oznako v naši funkciji 'številke'. To lahko storite tako, da najprej ustvarite spremenljivko 'numberOnScreen' in jo naredite tipa double in enako 0: var numberOnScreen: Double = 0; In ne pozabite, če je koda tukaj malo nejasna, sem vam pustil celotno kodo na zadnjem koraku, ki jo lahko uporabite po svojih željah. Nato vzpostavite drugo spremenljivko 'performansMath' tipa bool in jo nastavite kot napačno: var izvajanjuMath = false; Ustvarite tudi drugo spremenljivko z imenom 'previousNumber' tipa double in jo nastavite na 0: var previousNumber: Double = 0; Zadnja spremenljivka, ki jo morate ustvariti, je spremenljivka 'operation'. Nastavite ga na 0: var operation = 0;

6. korak: Funkcija številskih gumbov

Funkcija številskih gumbov
Funkcija številskih gumbov

Ko določite ustrezne spremenljivke, lahko nadaljujete s kopiranjem in lepljenjem te kode v svojo funkcijo "številke":

če performanceMath == res {

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

numberOnScreen = Dvojno (label.text!)!

performanceMath = napačno

}

drugače {

label.text = label.text! + Niz (pošiljatelj.tag-1)

numberOnScreen = Dvojno (label.text!)!

}

Ta koda v bistvu prikaže določene številke na nalepki, ko pritisnete ustrezen gumb. Še vedno pa moramo biti sposobni uporabiti vse druge gumbe in narediti kalkulator funkcionalen. To bomo storili v naslednjih nekaj korakih.

7. korak: Vključitev operacijskih gumbov

Integriranje gumbov za upravljanje
Integriranje gumbov za upravljanje
Integriranje gumbov za upravljanje
Integriranje gumbov za upravljanje

Odprite inšpektor za atribute in spremenite oznako za vse različne gumbe. Gumb za brisanje mora imeti oznako 11, gumb za deljenje mora imeti oznako 12, gumb za množenje mora imeti oznako 13, gumb za odštevanje mora imeti oznako 14, gumb za seštevanje mora imeti oznako 15, gumb enakega bi moral imeti oznako 16. Nato pritisnite control, kliknite gumb za brisanje in ga povlecite na krmilnik pogleda. Na zaslonu se mora pojaviti pojavno okno. Povezavo spremenite v »dejanje«, vrsto v »UIButton«, dogodek v »Dotaknite se znotraj«, argumente v »Pošiljatelj« in njeno ime v »gumbi«. Ime lahko spremenite v poljubno, vendar to pomeni, da bi morali pri ponovnem klicu funkcije pozneje v programu ime znova spremeniti. Nato nadzirajte, kliknite in povlecite vsak drug gumb v funkcijo, ki smo jo pravkar ustvarili.

8. korak: Funkcija različnih gumbov

Funkcija različnih gumbov
Funkcija različnih gumbov

Ko povežete vse označene različne gumbe z ustrezno funkcijo, lahko začnete vstavljati kodo v funkcijo 'gumbi':

previousNumber = Dvojno (label.text!)!

če sender.tag == 12 {// Razdeli

label.text = "/";

}

če sender.tag == 13 {// Pomnoži

label.text = "x";

}

če sender.tag == 14 {// Odštej

label.text = "-";

}

če sender.tag == 15 {// Dodaj

label.text = "+";

}

operacija = pošiljatelj.oznaka

performanceMath = res;

}

drugače, če je pošiljatelj.tag == 16 {

če je operacija == 12 {// Razdeli

label.text = Niz (prejšnjeŠtevilo / številkaOzaslona)

}

else if operation == 13 {// Pomnoži

label.text = Niz (prejšnjeŠtevilo * številoOdSkrin)

}

else if operation == 14 {// Odštej

label.text = Niz (prejšnjeŠtevilo - številoOskrin)

}

else if operation == 15 {// Dodaj

label.text = Niz (prejšnjeŠtevilo + številoOzaslonov)

}

}

sicer če sender.tag == 11 {

label.text = ""

prejšnjeŠtevilo = 0;

numberOnScreen = 0;

operacija = 0;

}

V bistvu ta koda prikaže enega od različnih gumbov, ko ga pritisnete, in nadaljuje z izračunom končnega odgovora in ga prikaže na etiketi.

9. korak: Celotna koda

Celotna koda
Celotna koda

Če z mano niste želeli korak za korakom zgraditi kalkulatorja, lahko preprosto dodate elemente v svojo snemalno knjigo in kopirate in prilepite celotno kodo v krmilnik pogleda. Tukaj je koda:

uvoz UIKit

razred ViewController: UIViewController {

var numberOnScreen: Double = 0;

var previousNumber: Double = 0;

var performanceMath = false;

var operacija = 0;

@IBAction func številke (_ pošiljatelj: UIButton) {

če performanceMath == res {

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

numberOnScreen = Dvojno (label.text!)!

performanceMath = napačno

}

drugače {

label.text = label.text! + Niz (pošiljatelj.tag-1)

numberOnScreen = Dvojno (label.text!)!

}

}

@IBOutlet šibka oznaka var: UILabel!

@IBAction funkcijski gumbi (_ pošiljatelj: UIButton) {

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

previousNumber = Dvojno (label.text!)!

če sender.tag == 12 {// Razdeli

label.text = "/";

}

če sender.tag == 13 {// Pomnoži

label.text = "x";

}

če sender.tag == 14 {// Odštej

label.text = "-";

}

če sender.tag == 15 {// Dodaj

label.text = "+";

}

operacija = pošiljatelj.oznaka

performanceMath = res;

}

drugače, če je pošiljatelj.tag == 16 {

če je operacija == 12 {// Razdeli

label.text = Niz (prejšnjeŠtevilo / številkaOzaslona)

}

else if operation == 13 {// Pomnoži

label.text = Niz (prejšnjeŠtevilo * številoOdSkrin)

}

else if operation == 14 {// Odštej

label.text = Niz (prejšnjeŠtevilo - številoOskrin)

}

else if operation == 15 {// Dodaj

label.text = Niz (prejšnjeŠtevilo + številoOzaslonov)

}

}

sicer če sender.tag == 11 {

label.text = ""

prejšnjeŠtevilo = 0;

numberOnScreen = 0;

operacija = 0;

}

}

preglasiti funkc viewDidLoad () {

super.viewDidLoad ()

// Po nalaganju pogleda naredite dodatne nastavitve, običajno iz peresa.

}

preglasiti funkc didReceiveMemoryWarning () {

super.didReceiveMemoryWarning ()

// Odstranite vse vire, ki jih je mogoče ponovno ustvariti.

}

}

Priporočena: