Jak vytvořit kalkulačku v Xcode pomocí Swift: 9 kroků

2024 Autor: John Day | [email protected]. Naposledy změněno: 2024-01-30 08:24

V tomto rychlém tutoriálu vám ukážu, jak vytvořit jednoduchou kalkulačku pomocí Swiftu v Xcode. Tato aplikace je vytvořena tak, aby vypadala téměř identicky s původní aplikací kalkulačky pro iOS. Buď můžete postupovat podle pokynů krok za krokem a sestavit kalkulačku se mnou, nebo můžete jednoduše přejít na poslední krok a zkopírovat a vložit kód do ovladače zobrazení. Pokud to však uděláte, propojte všechny své prvky na scénáři s ovladačem zobrazení.

Krok 1: Vytvoření projektu

Prvním krokem při vytváření naší kalkulačky je skutečné vytvoření projektu v Xcode. To lze provést kliknutím na „Vytvořit nový projekt Xcode“a pojmenováním libovolného názvu. Sám jsem pojmenoval „Kalkulačka“. Dalším krokem je vybrat pro typ aplikace „Single View Application“. Ponechte všechny ostatní informace jako výchozí hodnotu.

Krok 2: Rozložení scénáře

Krok 2 vytvoření naší kalkulačky vyžaduje, abyste ve scénáři navrhli základní rozložení. Než s tím začnete, doporučuji změnit zařízení simulátoru na iPhone 7 Plus. Začněte přetažením tlačítka na scénář a změnou jeho rozměrů na 89 x 89. Změňte jeho barvu pozadí na rtuť v inspektoru atributů a barvu písma na wolfram. Dále upravte písmo na Helvetica Light 30. Pokračujte v kopírování a vkládání tlačítka, dokud nebudete mít celkem 20. Upravte rozložení těchto tlačítek tak, abyste měli pět řádků a čtyři sloupce.

Krok 3: Design a estetika scénáře

Odstraňte druhé tlačítko ve spodním řádku a rozbalte první tlačítko, abyste převzali toto místo. Změňte hodnotu zástupného symbolu tohoto tlačítka na nulu. Pokračujte ve změně číselných hodnot a symbolů každého tlačítka, dokud nebude prakticky shodný s obrázkem uvedeným výše. Na inspektoru atributů je tmavší šedá barva stříbrná, oranžová barva mandarinka a barva písma se na oranžových tlačítkách změní na sněhovou. Dále klikněte na ovladač zobrazení a změňte jeho barvu pozadí na černou. Přidejte štítek nad tlačítka a upravte jeho velikost tak, abyste se cítili dobře. Zarovnejte text doprava a změňte písmo štítku na Helvetica light 70. Pokud chcete, můžete ke všem prvkům přidat omezení, aby aplikace vypadala stejně pro všechna zařízení.

Krok 4: Připojení a integrace prvků

Otevřete inspektor atributů a změňte značku pro každé tlačítko s číslem. Značka by měla být o 1 větší než skutečná číselná hodnota. Tlačítko #0 by například mělo mít hodnotu tagu 1, tlačítko #1 by mělo mít hodnotu tagu 2, tlačítko #2 by mělo mít hodnotu tagu 3 atd. Dále stiskněte ovládací prvek, klikněte na tlačítko #0 a přetáhněte jej na ovladač zobrazení. Na obrazovce by se mělo objevit vyskakovací okno. Změňte připojení na „akce“, typ na „UIButton“, událost na „Touch Up Inside“, argumenty na „Odesílatel“a jeho název na „čísla“. Název můžete změnit na cokoli chcete, ale to znamená, že při pozdějším vyvolání funkce v programu budete muset jméno znovu změnit. Dále ovládejte, klikněte a přetáhněte každé číselné tlačítko do funkce, kterou jsme právě vytvořili. Nyní kontrolujte, klikněte a přetáhněte štítek do programu, ale NE do funkce. To znamená, že štítek jednoduše přenesete do funkce jako samostatnou proměnnou. Pamatujte si, že pokud jste někdy zmatení ohledně kódu, nechal jsem vám celý svůj kód, který můžete použít v posledním kroku tohoto Instructable.

Krok 5: Stanovení proměnných

Aby byla naše numerická tlačítka funkční, budeme muset jejich hodnotu spojit se štítkem v naší funkci „čísla“. Můžete to udělat tak, že nejprve vytvoříte proměnnou 'numberOnScreen' a uděláte z ní typ double a rovná se 0: var numberOnScreen: Double = 0; A nezapomeňte, pokud je kód zde trochu nejasný, nechal jsem vám celý kód na posledním kroku, který můžete použít podle svých představ. Dále vytvořte další proměnnou 'performingMath' typu bool a udělejte ji false: var performingMath = false; Také vytvořte další proměnnou s názvem 'previousNumber' typu double a nastavte ji na 0: var previousNumber: Double = 0; Poslední proměnnou, kterou musíte vytvořit, je proměnná „operace“. Nastavte jej na 0: var operation = 0;

Krok 6: Funkce číselných tlačítek

Jakmile vytvoříte příslušné proměnné, můžete pokračovat ve kopírování a vložení tohoto kódu do funkce „čísla“:

if performingMath == true {

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

numberOnScreen = Double (label.text!)!

performingMath = false

}

jinak {

label.text = label.text! + Řetězec (sender.tag-1)

numberOnScreen = Double (label.text!)!

}

V podstatě tento kus kódu zobrazí na štítku po stisknutí příslušného tlačítka určitá čísla. Stále však musíme umět používat všechna ostatní tlačítka a kalkulačku zprovoznit. Uděláme to v následujících několika krocích.

Krok 7: Integrace ovládacích tlačítek

Otevřete inspektor atributů a změňte značku pro všechna různá tlačítka. Tlačítko pro vymazání by mělo mít tag 11, tlačítko pro dělení by mělo mít tag 12, tlačítko pro násobení by mělo mít tag 13, tlačítko pro odčítání by mělo mít tag 14, tlačítko pro přidání by mělo mít tag 15, a tlačítko rovná se má značku 16. Dále stiskněte ovládací prvek, klikněte na tlačítko Vymazat a přetáhněte jej na ovladač zobrazení. Na obrazovce by se mělo objevit vyskakovací okno. Změňte připojení na „akce“, typ na „UIButton“, událost na „Touch Up Inside“, argumenty na „Odesílatel“a jeho název na „tlačítka“. Název můžete změnit na cokoli chcete, ale to znamená, že při pozdějším vyvolání funkce v programu budete muset jméno znovu změnit. Dále ovládejte, klikejte a přetáhněte jednotlivá různá tlačítka do funkce, kterou jsme právě vytvořili.

Krok 8: Funkce různých tlačítek

Poté, co připojíte všechna označená různá tlačítka k jejich příslušné funkci, můžete začít vkládat kód do funkce „tlačítka“:

previousNumber = Double (label.text!)!

if sender.tag == 12 {// Rozdělit

label.text = "/";

}

if sender.tag == 13 {// Násobit

label.text = "x";

}

if sender.tag == 14 {// Odečíst

label.text = "-";

}

if sender.tag == 15 {// Přidat

label.text = "+";

}

operace = sender.tag

performingMath = true;

}

jinak if sender.tag == 16 {

if operation == 12 {// Rozdělit

label.text = String (previousNumber / numberOnScreen)

}

else if operation == 13 {// Násobení

label.text = String (previousNumber * numberOnScreen)

}

else if operation == 14 {// Odečíst

label.text = String (previousNumber - numberOnScreen)

}

else if operation == 15 {// Přidat

label.text = String (previousNumber + numberOnScreen)

}

}

jinak if sender.tag == 11 {

label.text = ""

previousNumber = 0;

numberOnScreen = 0;

operace = 0;

}

Tento kus kódu v podstatě zobrazuje jedno z různých tlačítek, když je stisknuto, pokračuje ve výpočtu konečné odpovědi a zobrazí ho na štítku.

Krok 9: Úplný kód

Pokud jste nechtěli projít a sestavit kalkulačku krok za krokem se mnou, pak můžete jednoduše přidat prvky do svého scénáře a zkopírovat a vložit celý kód do ovladače zobrazení. Zde je kód:

importovat UIKit

třída ViewController: UIViewController {

číslo varuOnScreen: Double = 0;

var previousNumber: Double = 0;

var performingMath = false;

var operace = 0;

@IBAction func numbers (_ sender: UIButton) {

if performingMath == true {

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

numberOnScreen = Double (label.text!)!

performingMath = false

}

jinak {

label.text = label.text! + Řetězec (sender.tag-1)

numberOnScreen = Double (label.text!)!

}

}

@IBOutlet slabý var štítek: UILabel!

@IBAction func buttons (_ sender: UIButton) {

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

previousNumber = Double (label.text!)!

if sender.tag == 12 {// Rozdělit

label.text = "/";

}

if sender.tag == 13 {// Násobit

label.text = "x";

}

if sender.tag == 14 {// Odečíst

label.text = "-";

}

if sender.tag == 15 {// Přidat

label.text = "+";

}

operace = sender.tag

performingMath = true;

}

jinak if sender.tag == 16 {

if operation == 12 {// Rozdělit

label.text = String (previousNumber / numberOnScreen)

}

else if operation == 13 {// Násobení

label.text = String (previousNumber * numberOnScreen)

}

else if operation == 14 {// Odečíst

label.text = String (previousNumber - numberOnScreen)

}

else if operation == 15 {// Přidat

label.text = String (previousNumber + numberOnScreen)

}

}

jinak if sender.tag == 11 {

label.text = ""

previousNumber = 0;

numberOnScreen = 0;

operace = 0;

}

}

přepsat func viewDidLoad () {

super.viewDidLoad ()

// Po načtení zobrazení proveďte další nastavení, obvykle z hrotu.

}

přepsat funkci didReceiveMemoryWarning () {

super.didReceiveMemoryWarning ()

// Zlikvidujte všechny prostředky, které lze znovu vytvořit.

}

}