«Топливно-энергетический комплекс в составе национальной экономики»
жүктеу/скачать 1,28 Mb.
|
Курсовая работа на тему Создание калькулятора
- Бұл бет үшін навигация:
- 2.2 Работа с обработчиками
| 2.2 Создание калькулятора
Для создания приложения нам потребуется Xcode, который можно бесплатно загрузить из AppStore. Не стоит пугаться его рейтинга — несмотря на то, что первые пять отзывов ставят 1 звезду, это не означает, что вас ждет шок. Возможно и правда синтаксис и подсказки включаются не слишком быстро при редактировании — но в целом Xcode оставил у меня в разы более благоприятные впечатления, чем тот же Android Studio (хотя возможно я просто не умею его готовить). Если у вас вдруг есть желание попробовать разработку не в Xcode и вы предпочитаете продукцию компании JetBrains, то вы можете попробовать AppCode — он поддерживает функциональную совместимость с Xcode, работу со Swift и Objective C, и множество других приятных фич. Я лично его не пробовал, но если у вас есть подписка на весь софт от JetBrains — почему бы и не скачать и запустить. [10, С.58] Итак, вы установили Xcode. Теперь можно начать разработку. Запускаете новый проект и выбираете Single Page Application: Рисунок 1 – Установка Xcode После этого вам предложат ввести данные о вашем приложении. Если это ваш первый запуск Xcode, там вам придется ввести Apple Id. После этого вы должны заполнить данные о названии вашего проекта (в нашем случае просто Calculator) и название вашей фирмы и приложения. Здесь вы можете написать все что угодно, если не собираетесь в будущем публиковать это приложение. В качестве языка я выбрал Swift, в качестве User Interface — Storyboard. Тесты я пока выкинул, потому что тестировать здесь пока толком нечего. [10, С.60] Рисунок 2 – Данные о приложении После того, как мы создали наше приложение, вы можете зайти в файл в Calculator.xcodeproj и поправить какие-либо настройки, если сочтете это нужным. Я пока оставил все как есть, разрабатываю на последнюю версию IOS 13.6 для Iphone и Ipad. Ipad в принципе можете пока исключить — на нем наш интерфейс скорее всего будет смотреться не очень хорошо. Однако хочу вас предупредить, что если вдруг вы будете публиковаться — работники Apple на проверке тестируют и приложения для Iphone, чтобы они были хотя бы функциональны на Ipad. Но до этого вам еще придется потратить 99 долларов на ключи разработчика). После того, как вы создали приложение, можно сразу вызвать эмулятор для того, чтобы отслеживать, что получается. Для этого можете просто нажать сочетание клавиш CMD + R. Слева вверху вы можете выбирать устройства, на которых вы запускаете эмулятор, а также можете через кабель подключить ваше настоящее физическое устройство и тестировать сразу же на нем). [10, С.64] Существует много способов создания интерфейса и виджетов в нем, я воспользуюсь нейтральным вариантом — создам основной holder, размещу его на весь экран, а потом программно начну располагать свои виджеты. Поэтому сначала мы переходим в файл Main.storyboard и делаем основной View черным, для того, чтобы удобнее размещать наши элементы: Рисунок 3 – Создание интерфейса После этого мы добавим View, с которым в основном и будем работать. Для этого кликаем на плюсик справа сверху, через который можно добавлять виджеты, и добавляем новый виджет, наберем в поиске uiview: Рисунок 4 – Добавление View После этого мы перетаскиваем этот виджет на основной экран, и нам нужно расширить его на весь экран. Для этого нам нужно поработать с constaint. Для этого щелкаем по значку слева внизу, который немного похож на кораблик Дарта Вейдера и назначить 0 с каждой из сторон: [10, С.65] Рисунок 5 – Add New Constraints После этого ваш новый виджет расширится до размеров всего экрана. Дальше нужно также, как и в прошлый раз, поменять цвет нашего виджета, только теперь на Clear Color, чтобы он нам не мешался и мы могли размещать виджеты в нем. [10, С.68] Теперь можно переходить в файл ViewController.swift, в котором у нас и будет происходить все остальное программирование. Для начала нам нужно использовать специальный маркер @IBOutlet для того, чтобы иметь возможность связать Storyboard c нашим кодом. Для этого мы должны написать следующую строчку: Теперь мы можем связать код с виджетом. Для этого, по сути, нужно соединить наш holder c Holder. Для этого щелкаем правой кнопкой по viewController и перетягиваем holder на наш экран: Рисунок 6 – Связь с кодом с виджетом Наконец-то мы закончили связывание кода с Storyboard и можно заняться именно программированием. Далее мы добавим две переменные, первая из которых будет просто числом, в которое можно записывать первое значение, а вторая — результирующее значение. Третья переменная будет несколько более специфическая, потому что мы будем использовать optional объявление. Optional может содержать какое-либо значение или nil. Также опционалы гарантируют, что значения nil будут явно обработаны. Кроме того, мы добавим с самого начала перечисление математических операций, которые калькулятор поддерживает: var firstNumber = 0 var resultNumber = 0 var currentOperations: Operation? enum Operation { case add, subtract, multiply, divide } Далее нам предстоит создать Label, в который мы будем показывать цифры и результат вычислений. По умолчанию там будет стоять 0 и достаточно большой шрифт. Все остальное, я думаю, совершенно понятно: private var resultLabel: UILabel = { let label = UILabel() label.text = "0" label.textColor = .white label.textAlignment = .right label.font = UIFont(name: "Helvetica", size: 100) return label }() После этого, пропустив встроенный метод, который вызывает у нас отрисовку (я говорю про viewDidLoad), нам нужно вызвать метод, который будет вызывать функцию, которая будет отрисовывать все кнопки, на которых будут висеть функции-обработчики. [10, С.71] override func viewDidLayoutSubviews() { super.viewDidLayoutSubviews() setupNumberPad() //функция, которая и будет отрисовывать наши кнопки } После этого у нас и пойдет функция setupNumberPad. В начале я задам константу для размера нашего шрифта, для того чтобы потом, если что, можно сразу увеличить/уменьшить размер шрифта в приложении, потому что я работаю без макета. После этого я создам размер кнопки — его ширина будет равна четверти размера экрана нашего приложения. [10, С.73] private func setupNumberPad() { let FontSize:CGFloat = 25 // стандартный размер шрифта в дробных числах let buttonSize: CGFloat = view.frame.size.width / 4 // размер кнопки в 1/4 let zeroButton = UIButton(frame: CGRect(x: 0, y: holder.frame.size.height-buttonSize, width: buttonSize*3, height: buttonSize)) // в UIButton мы задаем позицию нашей кнопки zeroButton.setTitleColor(.black, for: .normal) // задаем цвет нашей кнопки zeroButton.backgroundColor = .white // кнопка будет белая zeroButton.setTitle("0", for: .normal) // ее контент конечно 0 zeroButton.titleLabel?.font = UIFont(name: "Helvetica", size: FontSize) // шрифт, family и размер текста zeroButton.tag = 1 // по тегу мы потом будем обрабатывать нажатие на кнопку holder.addSubview(zeroButton) // добавляем в наш holder кнопку zeroButton.addTarget(self, action: #selector(zeroTapped), for: .touchUpInside) // добавляем функцию обработчик и на каком событии 0 у нас занимает треть экрана для того, чтобы у нас справа могли в колонку пойти математические операнды. Дальше нам нужно каким-либо образом отрисовать все кнопки. Конечно, можно было бы их отрисовывать поодиночке, но это тогда получится долго и муторно. Т.к. у нас будет просто ряд цифр от 1 до 9, то вполне на поверхности лежит решение воспользоваться циклами. Я приведу первый цикл с комментариями, а т.к. два остальных по сути повторение, я приведу их просто под катом: for x in 0..<3 { let button_row_1 = UIButton(frame: CGRect(x: buttonSize * CGFloat(x), y: holder.frame.size.height-(buttonSize*2), width: buttonSize, height: buttonSize)) //будем использовать наш x и для положения по x button_row_1.setTitleColor(.black, for: .normal) //цвет button_row_1.backgroundColor = .white //задний цвет button_row_1.setTitle("\(x+1)", for: .normal) // задаем содержание holder.addSubview(button_row_1) // добавляем в наш вид button_row_1.tag = x+2 // т.к.тег 1 уже занят, добавляем по 2 button_row_1.addTarget(self, action: #selector(numberPressed(_:)), for: .touchUpInside) //добавляем обработчик } Остальной код наших цифр После этого нам нужно разместить нашу кнопку CE, на которую у нас будет осуществляться сброс данных, которые были введены. Мы разместим ее наверху, и ее функциональную нагрузку мы опишем немного позднее. Пока нам нужно только ее расположить и подключить обработчики: [10, С.77] let clearButton = UIButton(frame: CGRect(x: 0, y: holder.frame.size.height-(buttonSize*5), width: view.frame.size.width - buttonSize, height: buttonSize)) clearButton.setTitleColor(.black, for: .normal) clearButton.backgroundColor = .init(red: 0, green: 2, blue: 0.8, alpha: 1) // здесь я задаю цвета с помощью rgb clearButton.titleLabel?.font = UIFont(name: "Helvetica", size: FontSize-4) //хочу кнопку СЕ довольно большого размера clearButton.setTitle("CE", for: .normal) holder.addSubview(clearButton) // добавляем кнопку в наш holder clearButton.addTarget(self, action: #selector(clearResult), for: .touchUpInside) //добавляем функцию обработчик [10, С.79] Мы закончили с этой скучной повторяющейся частью, теперь готовы к другой штуке — нашим операндам, при помощи которых можно будет осуществлять математические операции. Начнем с того, что необходимые операнды мы поместим внутрь массива, откуда их будем забирать. Сами кнопки операндов мы расположим в колоночку и добавим функцию обработчик, который будет реагировать на нажатия наших операндов. Кнопки я сделаю приятного желого цвета, и размер немного покрупнее, чем у наших цифр. let operations = ["=","+", "-", "x", "÷"] //массив наших операндов for x in 0..<5 { let button_operand = UIButton(frame: CGRect(x: buttonSize * 3, y: holder.frame.size.height-(buttonSize * CGFloat(x+1)), width: buttonSize, height: buttonSize)) button_operand.setTitleColor(.black, for: .normal) button_operand.backgroundColor = .init(red: 2, green: 0.8, blue: 0, alpha: 1) //желтый цвет button_operand.setTitle(operations[x], for: .normal) holder.addSubview(button_operand) button_operand.tag = x+1 //добавляем тэги, чтобы потом можно было на них ориентироватьсят button_operand.titleLabel?.font = UIFont(name: "Helvetica", size: FontSize) button_operand.addTarget(self, action: #selector(operationPressed(_:)), for: .touchUpInside) } После этих глобальных операций нам осталось только расположить Label, в который мы будем записывать результат, и закрыть функцию: resultLabel.frame = CGRect(x: 20, y: clearButton.frame.origin.y - 110.0, width: view.frame.size.width - 40, height: 100) holder.addSubview(resultLabel) } // закрываю тут нашу функцию Теперь можно двигаться к обработчикам: Выводы по главе: Данная программа для создания калькулятора, не сильно отличается от других, только имеет свои определенные нюансы, которые были рассмотрены в этой главе. Можно так же обобщим, что почти все программы для создания калькулятора очень похожи. 2.2 Работа с обработчикамиЭто все была по сути только верстка, теперь нам предстоит вдохнуть логику в приложение. Для этого мы с вами воспользуемся методами из runtime Objective C, чтобы упростить наш код. [10, С.81] Итого, вот наши функции: @objc func clearResult() { resultLabel.text = "0" //на очищении даем значение 0 currentOperations = nil // обнуляем наши текущие операции firstNumber = 0 // первое число у нас становится 0 } @objc func zeroTapped() { // отдельная функция дл нуля if resultLabel.text != "0" { if let text = resultLabel.text { resultLabel.text = "\(text)\(0)" // используем интерполяцию } } } Дальше нам нужно добавить функцию обработчик на наши кнопки: @objc func numberPressed(_ sender: UIButton) { let tag = sender.tag - 1 if resultLabel.text == "0" { resultLabel.text = "\(tag)" } else if let text = resultLabel.text { //красиво используем опциональное связывание resultLabel.text = "\(text)\(tag)" } } Следующей у нас пойдем самая важная бизнес-логика нашего приложения. Мы воспользуемся конструкцией switch для того, чтобы управлять нашими математическими операциями: @objc func operationPressed(_ sender: UIButton) { let tag = sender.tag if let text = resultLabel.text, let value = Int(text), firstNumber == 0 { //тоже используем опциональное связывание firstNumber = value resultLabel.text = "0" } if tag == 1 { if let operation = currentOperations { var secondNumber = 0 if let text = resultLabel.text, let value = Int(text) { secondNumber = value } switch operation { case .add: firstNumber = firstNumber + secondNumber secondNumber = 0 //обнуляем второе число resultLabel.text = "\(firstNumber)" currentOperations = nil firstNumber = 0 //и первое после записи в Label тоже break case .subtract: firstNumber = firstNumber - secondNumber secondNumber = 0 resultLabel.text = "\(firstNumber)" currentOperations = nil firstNumber = 0 break case .multiply: firstNumber = firstNumber * secondNumber secondNumber = 0 resultLabel.text = "\(firstNumber)" currentOperations = nil firstNumber = 0 break case .divide: firstNumber = firstNumber / secondNumber secondNumber = 0 resultLabel.text = "\(firstNumber)" currentOperations = nil firstNumber = 0 break } } } else if tag == 2 { currentOperations = .add // назначаем операции по номер лейблов. Если будете перемещать кнопки, не забудьте поменять здесь } else if tag == 3 { currentOperations = .subtract } else if tag == 4 { currentOperations = .multiply } else if tag == 5 { currentOperations = .divide } } } На этом все! [10, С.84] Рисунок 7 – Калькулятор Выводы по главе: Работа с обработчиком – это завершающий этап создания калькулятора в этой программе. В этой части нужно быть очень внимательным при написании кода, так как малейшая ошибка и код будет понят программой не верно. жүктеу/скачать 1,28 Mb. Достарыңызбен бөлісу:
|