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

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

U ovom kratkom vodiču pokazat ću vam kako stvoriti jednostavan kalkulator koristeći Swift u Xcode -u. 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 prikaza. Međutim, ako to učinite, svakako spojite sve svoje elemente na storyboard -u sa svojim kontrolerom prikaza.

Korak 1: Kreiranje projekta

Prvi korak u izradi našeg kalkulatora je zapravo kreiranje projekta u Xcode -u. To možete učiniti klikom na "Kreiraj novi Xcode projekt" i imenujte ga kako god želite. Ja sam svoj nazvao "Kalkulator". Sljedeći korak je odabir "Single View Application" za vrstu aplikacije. Ostale podatke zadržite kao zadanu vrijednost.

Korak 2: Izgled Storyboard -a

Korak 2 stvaranja našeg kalkulatora zahtijeva od vas 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 dugmeta na storyboard -u i promjenom njegovih dimenzija na 89 x 89. Promijenite boju pozadine u živu na inspektoru atributa i boju fonta u volfram. Zatim prilagodite font Helvetica Light 30. Nastavite kopirati i zalijepiti dugme dok ne dobijete ukupno 20. Podesite izgled ovih dugmadi tako da imate pet redova i četiri kolone.

Korak 3: Dizajn scenarija i estetika

Izbrišite drugo dugme u donjem redu i proširite prvo dugme kako biste zauzeli ovaj prostor. Promijenite vrijednost čuvara mjesta ovog gumba na nulu. Nastavite s promjenom brojčanih vrijednosti i simbola svakog gumba sve dok ne postane praktično identičan slici prikazanoj gore. Na inspektoru atributa tamnije siva boja je srebrna, narandžasta boja je mandarina, a boja fonta se mijenja u snijeg na narančastim gumbima. Zatim kliknite na kontroler prikaza i promijenite boju pozadine u crnu. Dodajte oznaku iznad dugmadi i prilagodite njenu veličinu kako god se osjećate ugodno. Poravnajte tekst udesno 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 svako pojedinačno numeričko dugme. 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 prikaza. Skočni prozor bi se trebao pojaviti na ekranu. Promijenite vezu na 'action', tip na 'UIButton', događaj na 'Touch Up Inside', argumente na 'Sender', a naziv na 'numbers'. Možete promijeniti ime u što god želite, ali to znači da ćete morati ponovo promijeniti ime pri pozivanju funkcije kasnije u programu. Zatim kontrolirajte, kliknite i povucite svako numeričko dugme 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 upotrebu na posljednjem koraku ovog uputstva.

Korak 5: Uspostavljanje varijabli

Da bi naši numerički gumbi postali funkcionalni, morat ćemo povezati njihovu vrijednost s oznakom u našoj funkciji 'brojevi'. To možete učiniti tako što ćete prvo stvoriti varijablu 'numberOnScreen' i učiniti je tipa double i jednaka 0: var numberOnScreen: Double = 0; I ne zaboravite, ako je kôd ovdje malo nejasan, ostavio sam vam cijeli kôd na posljednjem koraku koji ćete koristiti po svom ukusu. Zatim uspostavite drugu varijablu 'performanceMath' tipa bool i učinite je lažnom: var performansMath = false; Takođe, kreirajte drugu promenljivu pod nazivom 'previousNumber' tipa double i postavite je na 0: var previousNumber: Double = 0; Zadnja varijabla koju morate stvoriti je varijabla 'operation'. Postavite ga na 0: var operation = 0;

Korak 6: Funkcija numeričkih dugmadi

Nakon što ste postavili 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 = netačno

}

else {

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

numberOnScreen = Dvostruki (label.text!)!

}

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

Korak 7: Integriranje radnih dugmadi

Otvorite inspektor atributa i promijenite oznaku za sve ostale dugmad. Dugme za brisanje treba imati oznaku 11, dugme za dijeljenje treba imati oznaku 12, dugme za množenje treba imati oznaku 13, dugme za oduzimanje treba imati oznaku 14, dugme za sabiranje treba imati oznaku 15, i dugme jednako treba imati oznaku 16. Zatim pritisnite kontrolu, kliknite na dugme za brisanje i povucite ga na kontroler prikaza. Skočni prozor bi se trebao pojaviti na ekranu. Promijenite vezu na 'action', tip na 'UIButton', događaj na 'Touch Up Inside', argumente na 'Sender', a naziv na 'dugmad'. Možete promijeniti ime u što god želite, ali to znači da ćete morati ponovo promijeniti ime pri pozivanju funkcije kasnije u programu. Zatim kontrolirajte, kliknite i povucite svako drugo dugme u funkciju koju smo upravo stvorili.

Korak 8: Funkcija raznih dugmadi

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

previousNumber = Double (label.text!)!

if sender.tag == 12 {// Podijeli

label.text = "/";

}

if sender.tag == 13 {// Množi

label.text = "x";

}

if sender.tag == 14 {// Oduzmi

label.text = "-";

}

if sender.tag == 15 {// Dodaj

label.text = "+";

}

operation = sender.tag

performanceMath = tačno;

}

inače ako je sender.tag == 16 {

if operation == 12 {// Podijeli

label.text = string (prethodni broj / broj na ekranu)

}

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 (prethodni broj + broj na ekranu)

}

}

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

label.text = ""

prethodniBroj = 0;

numberOnScreen = 0;

rad = 0;

}

U suštini, ovaj dio koda prikazuje jedno od raznih dugmadi kada se pritisne i nastavlja s izračunavanjem konačnog odgovora i prikazuje ga na etiketi.

Korak 9: Potpuni kod

Ako niste htjeli sa mnom proći i izgraditi kalkulator korak po korak, jednostavno možete dodati elemente u svoju storyboard i 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šiljalac: UIButton) {

ako izvodiMath == true {

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

numberOnScreen = Dvostruki (label.text!)!

performanceMath = netačno

}

else {

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

numberOnScreen = Dvostruki (label.text!)!

}

}

@IBOutlet slab var label: UILabel!

@IBAction funkcijske tipke (_ pošiljatelj: UIButton) {

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

previousNumber = Double (label.text!)!

if sender.tag == 12 {// Podijeli

label.text = "/";

}

if sender.tag == 13 {// Množi

label.text = "x";

}

if sender.tag == 14 {// Oduzmi

label.text = "-";

}

if sender.tag == 15 {// Dodaj

label.text = "+";

}

operation = sender.tag

performanceMath = tačno;

}

inače ako je sender.tag == 16 {

if operation == 12 {// Podijeli

label.text = string (prethodni broj / broj na ekranu)

}

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šiljalac.tag == 11 {

label.text = ""

prethodniBroj = 0;

numberOnScreen = 0;

rad = 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.

}

}