Kako napraviti kalkulator u Xcode -u pomoću Swifta: 9 koraka

2024 Autor: John Day | [email protected]. Zadnja promjena: 2024-01-30 09:37

U ovom kratkom vodiču pokazat ću vam kako stvoriti jednostavan kalkulator pomoću Swifta u Xcodeu. Ova je aplikacija napravljena tako da izgleda gotovo identično izvornoj aplikaciji za kalkulator za iOS. Možete slijediti upute korak-po-korak i sa mnom sastaviti kalkulator, ili jednostavno otići na posljednji korak i kopirati i zalijepiti kôd u kontroler pogleda. Međutim, ako to učinite, svakako spojite sve svoje elemente na storyboardu sa svojim kontrolerom prikaza.

Korak 1: Izrada projekta

Prvi korak u izradi našeg kalkulatora je stvaranje projekta u Xcode -u. To možete učiniti klikom na "Izradi novi Xcode projekt" i imenujte ga kako god želite. Svoj sam nazvao "Kalkulator". Sljedeći korak je odabir "Aplikacije s jednim prikazom" za vrstu aplikacije. Ostale podatke zadržite kao zadanu vrijednost.

Korak 2: Raspored scenarija

Korak 2 stvaranja našeg kalkulatora zahtijeva da osmislite osnovni izgled u storyboardu. Prije nego započnete ovo, preporučujem vam da promijenite uređaj za simulaciju na iPhone 7 Plus. Počnite povlačenjem gumba na storyboardu i promjenom njegovih dimenzija na 89 x 89. Promijenite boju pozadine u živu na atributu Inspector i boju fonta u volfram. Zatim prilagodite font Helvetica Light 30. Nastavite kopirati i zalijepiti gumb dok ne dobijete ukupno 20. Prilagodite izgled ovih gumba tako da imate pet redaka i četiri stupca.

Korak 3: Dizajn scenarija i estetika

Izbrišite drugi gumb u donjem retku i proširite prvi gumb kako biste zauzeli ovaj prostor. Promijenite vrijednost čuvara mjesta ovog gumba na nulu. Nastavite mijenjati vrijednosti i simbole svakog gumba sve dok ne bude praktički identičan gornjoj slici. Na inspektoru atributa tamnije siva boja je srebrna, narančasta je mandarina, a boja fonta se mijenja u snježnu na narančastim gumbima. Zatim kliknite na kontroler prikaza i promijenite boju pozadine u crnu. Dodajte oznaku iznad gumba i prilagodite njezinu veličinu kako god se osjećate ugodno. Poravnajte tekst s desne strane i promijenite font oznake na Helvetica light 70. Ako želite, možete dodati ograničenja svim elementima kako bi aplikacija izgledala isto za sve uređaje.

Korak 4: Povezivanje i integriranje elemenata

Otvorite inspektor atributa i promijenite oznaku za svaki gumb s brojem. Oznaka bi trebala biti 1 veća od stvarne brojčane vrijednosti. Na primjer, gumb #0 trebao bi imati vrijednost oznake 1, gumb #1 trebao bi imati vrijednost oznake 2, gumb #2 trebao bi imati vrijednost oznake 3 itd. Zatim pritisnite control, kliknite gumb #0 i povucite ga na kontroler pogleda. Na zaslonu bi se trebao pojaviti skočni prozor. Promijenite vezu u 'action', vrstu u 'UIButton', događaj u 'Touch Up Inside', argumente u 'Sender', a naziv u 'numbers'. Možete promijeniti ime u što god želite, ali to znači da ćete morati ponovno promijeniti ime pri pozivanju funkcije kasnije u programu. Zatim kontrolirajte, kliknite i povucite svaki brojčani gumb u funkciju koju smo upravo stvorili. Sada kontrolirajte, kliknite i povucite oznaku u program, ali NE u funkciju. To znači da jednostavno unesete oznaku u funkciju kao zasebnu varijablu. Upamtite, ako ste ikada zbunjeni oko koda, ostavio sam vam sav svoj kôd za korištenje na posljednjem koraku ovog Instructable -a.

Korak 5: Uspostavljanje varijabli

Kako bi naši brojčani gumbi bili funkcionalni, morat ćemo povezati njihovu vrijednost s oznakom u našoj funkciji 'brojevi'. To možete učiniti tako da prvo stvorite varijablu 'numberOnScreen' i učinite je dvostrukom i jednakom 0: var numberOnScreen: Double = 0; I ne zaboravite, ako je kôd ovdje malo nejasan, ostavio sam vam cijeli kôd na zadnjem koraku koji ćete koristiti prema svojim željama. Zatim uspostavite drugu varijablu 'performanceMath' tipa bool i učinite je lažnom: var performansMath = false; Također, stvorite drugu varijablu pod nazivom 'previousNumber' tipa double i postavite je jednakom 0: var previousNumber: Double = 0; Posljednja varijabla koju morate stvoriti je varijabla 'operation'. Postavite ga jednakim 0: var operation = 0;

Korak 6: Funkcija numeričkih gumba

Nakon što uspostavite odgovarajuće varijable, možete nastaviti kopirati i zalijepiti ovaj kôd u svoju funkciju 'numbers':

ako izvodiMath == true {

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

numberOnScreen = Dvostruki (label.text!)!

performanceMath = netočno

}

drugo {

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

numberOnScreen = Dvostruki (label.text!)!

}

U biti, ovaj dio koda prikazuje određene brojeve na naljepnici kada se pritisne odgovarajući gumb. Međutim, još uvijek moramo moći koristiti sve ostale gumbe i učiniti kalkulator funkcionalnim. To ćemo učiniti u sljedećih nekoliko koraka.

Korak 7: Integriranje radnih gumba

Otvorite inspektor atributa i promijenite oznaku za sve ostale gumbe. Gumb za brisanje trebao bi imati oznaku 11, gumb za podjelu trebao bi imati oznaku 12, gumb za množenje trebao bi imati oznaku 13, gumb za oduzimanje trebao bi imati oznaku 14, gumb za zbrajanje trebao bi imati oznaku 15, i gumb jednako treba imati oznaku 16. Zatim pritisnite control, kliknite gumb za brisanje i povucite ga na kontroler prikaza. Na zaslonu bi se trebao pojaviti skočni prozor. Promijenite vezu na 'action', vrstu na 'UIButton', događaj na 'Touch Up Inside', argumente na 'Sender', a naziv na 'button'. Možete promijeniti ime u što god želite, ali to znači da ćete morati ponovno promijeniti ime pri pozivanju funkcije kasnije u programu. Zatim kontrolirajte, kliknite i povucite svaki razni gumb u funkciju koju smo upravo stvorili.

Korak 8: Funkcija raznih gumba

Nakon što ste sve označene razne gumbe povezali s odgovarajućom funkcijom, možete početi umetati kôd u funkciju 'gumbi':

previousNumber = Double (label.text!)!

ako pošiljatelj.oznaka == 12 {// Podijeli

label.text = "/";

}

ako je pošiljatelj.oznaka == 13 {// Množi

label.text = "x";

}

if sender.tag == 14 {// Oduzmi

label.text = "-";

}

ako je pošiljatelj.oznaka == 15 {// Dodaj

label.text = "+";

}

operacija = pošiljatelj.oznaka

performanceMath = istina;

}

inače ako je pošiljatelj.tag == 16 {

ako je operacija == 12 {// Podijeli

label.text = String (prethodniNumber / numberOnScreen)

}

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

label.text = String (prethodniBroj * brojOskrin)

}

else if operation == 14 {// Oduzmi

label.text = String (prethodniNumber - numberOnScreen)

}

else if operation == 15 {// Dodaj

label.text = String (prethodniBroj + brojOskrin)

}

}

inače ako je pošiljatelj.tag == 11 {

label.text = ""

prethodniBroj = 0;

numberOnScreen = 0;

radnja = 0;

}

U biti, ovaj dio koda prikazuje jedan od raznih gumba kada se pritisne i nastavlja izračunati konačni odgovor i prikazuje ga na naljepnici.

Korak 9: Potpuni kôd

Ako niste htjeli sa mnom proći korak po korak i izraditi kalkulator, možete jednostavno dodati elemente u svoju storyboard te kopirati i zalijepiti cijeli kôd u kontroler prikaza. Evo koda:

uvoz UIKit

klasa ViewController: UIViewController {

var numberOnScreen: Double = 0;

var previousNumber: Double = 0;

var performanceMath = false;

var operacija = 0;

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

ako izvodiMath == true {

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

numberOnScreen = Dvostruki (label.text!)!

performanceMath = netočno

}

drugo {

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

numberOnScreen = Dvostruki (label.text!)!

}

}

@IBOutlet slab var label: UILabel!

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

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

previousNumber = Double (label.text!)!

ako pošiljatelj.oznaka == 12 {// Podijeli

label.text = "/";

}

ako je pošiljatelj.oznaka == 13 {// Množi

label.text = "x";

}

if sender.tag == 14 {// Oduzmi

label.text = "-";

}

ako je pošiljatelj.oznaka == 15 {// Dodaj

label.text = "+";

}

operacija = pošiljatelj.oznaka

performanceMath = istina;

}

inače ako je pošiljatelj.tag == 16 {

ako je operacija == 12 {// Podijeli

label.text = String (prethodniNumber / numberOnScreen)

}

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

label.text = String (prethodniBroj * brojOskrin)

}

else if operation == 14 {// Oduzmi

label.text = String (prethodniNumber - numberOnScreen)

}

else if operation == 15 {// Dodaj

label.text = String (prethodniBroj + brojOskrin)

}

}

inače ako je pošiljatelj.tag == 11 {

label.text = ""

prethodniBroj = 0;

numberOnScreen = 0;

radnja = 0;

}

}

nadjačati funkc viewDidLoad () {

super.viewDidLoad ()

// Nakon učitavanja prikaza izvršite dodatna podešavanja, obično s vrha.

}

nadjačati func didReceiveMemoryWarning () {

super.didReceiveMemoryWarning ()

// Odložite sve resurse koji se mogu ponovno stvoriti.

}

}