Основы ООП на примере Gambas

Обложка статьи "Основы ООП на примере Gambas

⏱ 18:42

Видеоурок для средней школы: введение в ООП на примере создания программы "Калькулятор" в среде разработки Gambas.

Урок даёт Александр Анатольевич Скачков.

▶ Смотреть на YouTube

Конспект

О чём это видео

Оглавление конспекта
  1. Введение в тему урока
  2. История и суть объектно-ориентированного программирования
  3. Знакомство со средой Gambas
  4. Интерфейс среды разработки
  5. Этапы разработки проекта «Калькулятор»
  6. Компиляция и создание исполняемого файла
  7. Настройка формы и размещение компонентов
  8. Изменение свойств кнопки и подготовка к написанию кода
  9. Логика работы функции Val и написание кода
  10. Запуск приложения и форматирование интерфейса
  11. Сохранение и запуск проекта
  12. Проверка работоспособности
  13. Задание для практической работы

Введение в тему урока

Здравствуйте, уважаемые слушатели! Сегодня у нас будет необычный урок. Я его проведу дистанционно. Пожалуйста, включите компьютеры, а если они уже включены, закройте все работающие приложения. Я надеюсь, вам всё будет хорошо видно со своих рабочих мест.

В одном из интервью средств массовой информации руководитель Департамента образования города Москвы Исаак Калинин высказал пожелание: учителя должны записывать свои уроки на видео и выкладывать их в интернет. Это необходимо для дистанционного обучения учащихся, например, пропускающих уроки по болезням. Сегодняшним уроком я хочу представить различные способы записи урока.

Итак, начнём. Сегодня мы познакомимся с вами с современным средством программирования. В конце урока вы сумеете создать приложение, которое будет очень похоже на те приложения, которые вы используете в Windows. Тема урока — «Введение в объектно-ориентированное программирование».

История и суть объектно-ориентированного программирования

Перед этим я хотел бы вам показать, как выглядела раньше программа. Вот это вы видите — различные цифры, столбики, то, как организовывалась передача информации и последовательность действий. Женщины здесь переключают различные реле, различные штекеры. Таким образом была создана программа.

Данная тема «Введение в объектно-ориентированное визуальное программирование» содержится в учебнике, который мы с вами используем. Это параграф 4.3, страница 201. Те товарищи, которые захотят прочитать это более подробно, услышать научными словами, пожалуйста, читайте учебник.

Главное в объектно-ориентированном программировании, наверное, слова «объект» и ориентация относительно этого объекта. Представим себе дрессированную служебную собаку. Тоже можно сказать, что это объект. Этот объект обладает определёнными свойствами и методами. Мы можем её описать: порода, кличка, пол, размер, цвет, возраст. Всё это является свойствами объекта.

Точно так же и у нас будут различные объекты, у которых будут свои свойства. Я уже сказал, что собака у нас дрессирована, соответственно, имеет какую-то систему команд исполнителя. То есть по воздействию на объект собака будет выполнять какие-то действия. Мы можем эти воздействия оказывать голосом, словом или даже жестом — различными способами, которые вы можете посмотреть здесь.

Знакомство со средой Gambas

Мы будем с вами изучать объектно-ориентированное программирование на основе языка Gambas. Происхождение слова «Gambas» — английское, конечно, но в переводе на русский язык можно сказать, что это почти Basic, а Basic — это язык машинных кодов для начинающих. Он был создан в 1999 году и распространяется свободно. Вы можете спокойно зайти на сайты Gambas, которые поддерживаются и разрабатываются, скачать и установить его, и за это вам ничего не будет. Это не будет пиратскими действиями.

Иконка на рабочем столе выглядит как креветка, потому что слово «Gambas» по-испански означает «креветка». Вот почему у нас в иконках креветки. Для того чтобы запустить приложение и создавать новые программы, находим на рабочем столе иконку «Gambas», креветочку, и запускаем.

Мы видим первый заголовок — это создание нового проекта. Выбираем «Новый проект». Если мы создавали раньше, то надо было бы «Открыть», а сейчас выбираем «Новый проект». У нас проект будет графическим приложением, то есть будет содержать какую-то графику. Выбираем «Графическое приложение» и нажимаем кнопочку «Далее» (Next).

На следующем шаге предлагается выбрать расположение файлов будущего проекта. По умолчанию предлагается домашняя папка. Если вас это не устраивает, можете выбрать любую другую. Нажимаем на кнопку «Next — Далее». На третьей закладочке мы пишем имя проекта. Мы будем создавать калькулятор. Напишем английскими словами calc. Нажимаем ОК. Всё, проект успешно создан.

Интерфейс среды разработки

Так выглядят основные шаги создания и запуска проекта. Когда мы запускаем саму программу, мы видим интерфейс среды разработки. Сейчас здесь очень мало: стандартные заголовки — это меню, панель инструментов и дерево проекта.

На дереве проекта мы выберем форму f-main. У нас все кнопочки, все объекты, с которыми будем работать, будут находиться на панели f-main формы. Когда мы выбрали форму, у нас посередине экрана появилась эта форма. С правой стороны у нас появились свойства формы. Здесь мы можем узнать такие свойства, как имя, цвет, надписи, каким шрифтом это всё сделано. И ниже мы видим панель компонентов. Это те компоненты, с которыми мы будем работать, которые будем размещать на форме. На экране вы видите основные элементы интерфейса среды разработки.

Этапы разработки проекта «Калькулятор»

Цель нашего сегодняшнего урока — это создание проекта «Калькулятор». У нас на форме должны быть размещены три текстовых поля и шесть кнопочек: плюс, минус, умножить, разделить, корень и степень.

Какие этапы у нас для разработки проектов? Первый — это создание графического интерфейса. То есть мы на форме размещаем те объекты, с которыми будем работать. Второй — установка значений и свойств объектов графического интерфейса. Здесь мы можем поменять надписи на этих объектах, поменять размеры, цвет, иногда указать интервалы, в каких пределах должны изменяться цифры.

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

Далее у нас происходит сохранение проекта и компиляция проекта приложений. Дело в том, что когда мы сохраним просто проект, мы не сможем его запускать отдельно от среды программирования. Для того чтобы мы могли не использовать систему программирования...

Компиляция и создание исполняемого файла

То есть что должно происходить при определенных событиях. В частности, у нас здесь будут кнопочки: что должно происходить по нажатию на определенные кнопочки. Далее у нас происходит сохранение проекта и компиляция проектов приложений.

Дело в том, что когда мы сохраним просто проект, мы не сможем его запускать отдельно от среды программирования. Для того чтобы мы могли не использовать систему программирования, этот проект нужно перевести в язык машинных кодов — в те самые нолики и единички, которые вы видели в начале. И тогда у нас получится один файлик с расширением .exe. Все приложения, которые вы видите у себя в Windows, — вы, наверное, обращали внимание, — у них все .exe, то есть они откомпилированы.

Настройка формы и размещение компонентов

Попробуем изменить надпись на форме на «Калькулятор». Вы все, наверное, видели: когда вы запускаете окошко, у вас в верхнем правом углу написано название этого приложения. У нас приложение будет называться «Калькулятор». Для этого проверяем, что у нас сейчас активная форма — она выделена такими квадратиками вокруг. Находим в свойствах (это верхний правый угол) свойство «Text» и там русскими буквами пишем «Калькулятор». Одновременно с этим у нас слово «Калькулятор» появляется в нужном нам месте на форме.

Далее нам необходимо разместить на форме три текстовых окна и пока только одну кнопочку. Для размещения текстового окна обращаемся к панели компонентов и ищем компонент «TextBox». Это текстовое окно, на них написано маленькими буквами А, Б, С. Чтобы разместить этот компонент на форме, мы можем просто сделать двойной клик на этом компоненте, а можем просто нарисовать его, как вы обычно рисуете прямоугольнички различных форм.

Так делаем три текстовых окна. Размещаем их в одну строчку последовательно, как у меня здесь на картинке. Далее размещаем кнопочку, она называется Button. Кнопочку Button вы тоже можете найти, на ней написано на панели компонентов OK. Надеюсь, у вас всё хорошо получилось.

Изменение свойств кнопки и подготовка к написанию кода

Попробуем изменить надпись на кнопочке Button — мы будем делать кнопочку «плюсик». Для этого проверяем, что у нас активная кнопочка, она выделена квадратиками. Находим свойство Text. Там написано Text1 — это у нас первая кнопочка, — и меняем этот текст на символ «плюс». Двойной щелчок по этой кнопочке, и мы переходим к созданию программного кода.

Хотелось напомнить вам, как выглядят основные компоненты на панели и как изменить свойства текста на кнопке. Перед созданием кода события прошу внимательно меня послушать. Непосредственно перед написанием кода программы хотелось бы сделать некоторые комментарии.

Итак, мы имеем на форме три текстовых окна: TextBox1, TextBox2 и TextBox3. Мы хотим записывать цифру в текстовое поле 1, складывать ее с цифрой из текстового поля 2, и результат должен у нас выйти в тексте поля 3.

Логика работы функции Val и написание кода

Как будет выглядеть код программы? Я пишу: TextBox3.Text = .... То есть текст в тексте поля 3 будет равен сумме текста из окна 1 плюс текст из окна 2. Если мы в тексте поля 1 напишем цифру 4, а в тексте поля 2 напишем цифру 5, то в ответе мы получим число 45. Компьютер видит, что это текст, и просто складывает символ «4» и символ «5».

Для того чтобы превратить символ «4» в число 4, применяется функция Val, то есть «value» с английского. Я должен после знака «равно» написать Val, открыть скобку, написать TextBox1.Text, и вот эту строчку: TextBox3.Text = Val(TextBox1.Text) + Val(TextBox2.Text) необходимо будет набрать в коде процедуры.

Переходим непосредственно к написанию кода программы. Обратите внимание, что код будет набираться в процедуре Public Sub ButtonClick, что означает «выполнять действия по нажатию кнопочки». Начинаем набирать TextBox3. Нам подсказка появляется внизу: точка, Text, равно, Val, скобочки открываются, TextBox1, точка, Text, закрываем скобочки, плюс. То же самое делаем и для второго текстового поля.

Запуск приложения и форматирование интерфейса

Для выхода из режима создания кода процедуры в режим работы с формой применяем закладку FMainForm. Для возвращения обратно — закладка FMainClass. Код первого события мы создали уже. Нажимаем для запуска F5 или кнопочку на панели инструментов — такой треугольничек. Рядом «Пауза» и рядом «Стоп».

В TextBox1 вводим любое число, например, 5. В TextBox2 вводим другое число, например, 4. И нажимаем кнопочку «Плюс». В TextBox3 у нас появляется число 9. Калькулятор работает.

Улучшим вид нашего калькулятора. Удалим надписи с текстовых полей и выровняем их размеры. Для этого сделаем активным текстовое поле 1. Обращаемся в панель свойств, находим свойство текста и удаляем его содержание. Изменяем размер этого поля: находим на панели свойств высоту и изменяем её на 30, находим ширину и указываем 60. Те же действия проделываем с остальными двумя текстовыми полями.

Делаем активным второе текстовое поле и удаляем TextBox2 в свойстве «Text». Находим высоту, изменяем на 30, изменяем ширину на 60. Далее делаем активным третье текстовое поле, удаляем TextBox3 из свойства «Text», изменяем высоту на 30 и ширину на 60. Напоминаю основные моменты создания кода программы: с помощью кнопки на панели и клавиши F5 можно запустить приложение.

Сохранение и запуск проекта

Изменяем высоту на 30 и изменяем ширину на 60. Напоминаю основные моменты создания кода программы: с помощью кнопки на панели и клавиши F5 можно запустить приложение.

Сохраним проект в виде запускаемого файла. Этот файл будет включать проект и запускаться при наличии на компьютере Gambas. Для сохранения проекта выбираем последовательные пункты верхнего меню: «Проект», затем «Собрать запускающее». Нам предложено выбрать место расположения файла. По умолчанию это папка проекта. Нам предлагается имя проекта, нажимаем кнопку ОК. Файл создан, проект сохранен.

Проверка работоспособности

Проверим работоспособность этого файла. Заходим в папку проекта, выбираем файл с расширением .gambas, делаем двойной клик и запускаем приложение-калькулятор. Вводим в первое окно число 5, во второе — 6, нажимаем кнопку «Плюс» и видим полученный результат. Приложение работает, закрываем приложение.

Если вы посчитаете, что программировать для вас тяжело, рекомендую вам зайти на мой сайт s1739.ru2 и почитать некоторые новости, которые я взял с информационного сайта. Также на этом сайте размещена эта презентация.

Задание для практической работы

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

Обращаю ваше внимание, что процедура пишется именно на событие нажатия кнопочки. Например, у нас кнопочка «Плюс» — это Button1, и мы пишем процедуру именно в Button1: начинается с Public Sub и заканчивается End. Для кнопочки «Минус» у нас будет кнопочка 2, значит, находим Public Sub Button_2 и пишем туда процедуру для минуса. И так далее.

Когда будете писать степень, напоминаю вам, что обозначение на языке программирования — такая галочка, которую можно получить, нажав одновременно кнопки Shift + 6. Корень мы выводим тоже через степени: единичка, деленная на n. Удачи! Спасибо!