Как сделать калькулятор в Xcode с помощью Swift: 9 шагов

2024 Автор: John Day | [email protected]. Последнее изменение: 2024-01-30 11:54

В этом кратком руководстве я покажу вам, как создать простой калькулятор с использованием Swift в Xcode. Это приложение почти идентично оригинальному калькулятору для iOS. Вы можете либо следовать инструкциям пошагово и построить калькулятор вместе со мной, либо вы можете просто перейти к последнему шагу, скопировать и вставить код в контроллер представления. Однако, если вы это сделаете, обязательно подключите все элементы раскадровки к контроллеру представления.

Шаг 1: Создание проекта

Первым шагом в создании нашего калькулятора является создание проекта в Xcode. Вы можете сделать это, нажав «Создать новый проект Xcode» и присвоив ему любое имя. Я назвал свой «Калькулятор». Следующим шагом является выбор «Приложение с одним представлением» для типа приложения. Оставьте всю остальную информацию как значение по умолчанию.

Шаг 2: Макет раскадровки

Шаг 2 создания нашего калькулятора требует, чтобы вы разработали базовый макет в раскадровке. Прежде чем начать, я рекомендую сменить симулятор на iPhone 7 Plus. Начните с перетаскивания кнопки на раскадровку и изменения ее размеров на 89 x 89. Измените цвет фона на ртуть в инспекторе атрибутов и цвет шрифта на вольфрам. Затем настройте шрифт на Helvetica Light 30. Продолжайте копировать и вставлять кнопку, пока у вас не будет всего 20. Отрегулируйте расположение этих кнопок так, чтобы у вас было пять строк и четыре столбца.

Шаг 3. Дизайн и эстетика раскадровки

Удалите вторую кнопку в нижнем ряду и разверните первую кнопку, чтобы занять это место. Измените значение заполнителя этой кнопки на ноль. Продолжайте изменять числовые значения и символы каждой кнопки, пока они не будут практически идентичны изображению, показанному выше. В инспекторе атрибутов темно-серый цвет - серебристый, оранжевый - мандариновый, а цвет шрифта на оранжевых кнопках изменен на снег. Затем щелкните контроллер представления и измените цвет его фона на черный. Добавьте метку над кнопками и отрегулируйте ее размер так, как вам удобно. Выровняйте текст по правому краю и измените шрифт метки на Helvetica light 70. Если хотите, вы можете добавить ограничения ко всем элементам, чтобы приложение выглядело одинаково для всех устройств.

Шаг 4: соединение и интеграция элементов

Откройте инспектор атрибутов и измените тег для каждой цифровой кнопки. Тег должен быть на 1 больше фактического числового значения. Например, кнопка # 0 должна иметь значение тега 1, кнопка # 1 должно иметь значение тега 2, кнопка # 2 должно иметь значение тега 3 и так далее. Затем нажмите control, нажмите кнопку # 0 и перетащите ее на контроллер представления. На экране должно появиться всплывающее окно. Измените соединение на «действие», тип на «UIButton», событие на «Touch Up Inside», аргументы на «Отправитель» и его имя на «числа». Вы можете изменить имя на любое другое, но это означает, что вам придется снова изменить имя при вызове функции позже в программе. Затем нажмите и перетащите каждую цифровую кнопку в функцию, которую мы только что создали. Теперь управляйте, щелкните и перетащите метку в программу, но НЕ в функцию. Это означает, что вы просто переносите метку в функцию как отдельную переменную. Помните, что если вы когда-нибудь запутаетесь в коде, я оставил весь свой код для вас на последнем шаге этой инструкции.

Шаг 5: Создание переменных

Чтобы наши цифровые кнопки работали, нам нужно будет связать их значение с меткой в нашей функции «числа». Вы можете сделать это, сначала создав переменную numberOnScreen и присвоив ей тип double и равный 0: var numberOnScreen: Double = 0; И не забывайте, если код здесь немного неясен, я оставил вам полный код на последнем шаге, чтобы вы могли использовать его по своему вкусу. Затем установите еще одну переменную performanceMath типа bool и сделайте ее ложной: var PerformMath = false; Кроме того, создайте другую переменную с именем previousNumber типа double и установите ее равной 0: var previousNumber: Double = 0; Последняя переменная, которую вам нужно создать, - это переменная «операция». Установите его равным 0: var operation = 0;

Шаг 6: Функция цифровых кнопок

После того, как вы установили соответствующие переменные, вы можете скопировать и вставить этот код в свою функцию «числа»:

if performanceMath == true {

label.text = Строка (sender.tag-1)

numberOnScreen = Двойной (label.text!)!

PerformanceMath = false

}

еще {

label.text = label.text! + Строка (sender.tag-1)

numberOnScreen = Двойной (label.text!)!

}

По сути, этот фрагмент кода отображает определенные числа на этикетке при нажатии соответствующей кнопки. Однако нам все еще нужно иметь возможность использовать все остальные кнопки и сделать калькулятор работоспособным. Мы сделаем это в следующих нескольких шагах.

Шаг 7: объединение кнопок управления

Откройте инспектор атрибутов и измените теги для всех дополнительных кнопок. Кнопка очистки должна иметь тег 11, кнопка деления должна иметь тег 12, кнопка умножения должна иметь тег 13, кнопка вычитания должна иметь тег 14, кнопка добавления должна иметь тег 15, и кнопка равенства должна иметь тег 16. Затем нажмите кнопку управления, щелкните кнопку очистки и перетащите ее на контроллер представления. На экране должно появиться всплывающее окно. Измените соединение на «действие», тип на «UIButton», событие на «Touch Up Inside», аргументы на «Отправитель» и его имя на «кнопки». Вы можете изменить имя на любое другое, но это означает, что вам придется снова изменить имя при вызове функции позже в программе. Затем управляйте, щелкните и перетащите каждую дополнительную кнопку в функцию, которую мы только что создали.

Шаг 8: Функции разных кнопок

После того, как вы подключили все помеченные разные кнопки к их соответствующей функции, вы можете начать вставлять код в функцию 'кнопок':

previousNumber = Двойное (label.text!)!

if sender.tag == 12 {// Разделить

label.text = "/";

}

if sender.tag == 13 {// Умножить

label.text = "х";

}

if sender.tag == 14 {// Вычесть

label.text = "-";

}

if sender.tag == 15 {// Добавить

label.text = "+";

}

operation = sender.tag

PerformanceMath = true;

}

else if sender.tag == 16 {

if operation == 12 {// Разделить

label.text = Строка (предыдущее число / число на экране)

}

else if operation == 13 {// Умножение

label.text = String (previousNumber * numberOnScreen)

}

else if operation == 14 {// Вычесть

label.text = Строка (previousNumber - numberOnScreen)

}

else if operation == 15 {// Добавить

label.text = Строка (предыдущее число + число на экране)

}

}

else if sender.tag == 11 {

label.text = ""

previousNumber = 0;

numberOnScreen = 0;

операция = 0;

}

По сути, этот фрагмент кода отображает одну из дополнительных кнопок при ее нажатии и переходит к вычислению окончательного ответа и отображает его на этикетке.

Шаг 9: Полный код

Если вы не хотели проходить и строить калькулятор шаг за шагом со мной, вы можете просто добавить элементы в свою раскадровку, скопировать и вставить полный код в контроллер представления. Вот код:

импортировать UIKit

class ViewController: UIViewController {

var numberOnScreen: Double = 0;

var previousNumber: Double = 0;

var PerformMath = false;

var operation = 0;

Номера функций @IBAction (_ отправитель: UIButton) {

if performanceMath == true {

label.text = Строка (sender.tag-1)

numberOnScreen = Двойной (label.text!)!

PerformanceMath = false

}

еще {

label.text = label.text! + Строка (sender.tag-1)

numberOnScreen = Двойной (label.text!)!

}

}

@IBOutlet weak var label: UILabel!

Функциональные кнопки @IBAction (_ отправитель: UIButton) {

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

previousNumber = Двойное (label.text!)!

if sender.tag == 12 {// Разделить

label.text = "/";

}

if sender.tag == 13 {// Умножить

label.text = "х";

}

if sender.tag == 14 {// Вычесть

label.text = "-";

}

if sender.tag == 15 {// Добавить

label.text = "+";

}

operation = sender.tag

PerformanceMath = true;

}

else if sender.tag == 16 {

if operation == 12 {// Разделить

label.text = Строка (предыдущее число / число на экране)

}

else if operation == 13 {// Умножение

label.text = String (previousNumber * numberOnScreen)

}

else if operation == 14 {// Вычесть

label.text = Строка (previousNumber - numberOnScreen)

}

else if operation == 15 {// Добавить

label.text = Строка (предыдущее число + число на экране)

}

}

else if sender.tag == 11 {

label.text = ""

previousNumber = 0;

numberOnScreen = 0;

операция = 0;

}

}

переопределить функцию viewDidLoad () {

super.viewDidLoad ()

// Выполните какие-либо дополнительные настройки после загрузки представления, обычно из пера.

}

override func didReceiveMemoryWarning () {

super.didReceiveMemoryWarning ()

// Удаляем все ресурсы, которые можно воссоздать.

}

}