Тема: елементи мови подійно-орієнтованого програмування в cередовищі програмування Lazarus.
Мета:
Обладнання: ПК із встановленими ОС і середовищем програмування Lazarus.
Структура уроку
Хід уроку
1. Організаційний момент
Вітання з класом. Перевірка присутності і готовності учнів до уроку. Перевірка виконання домашнього завдання.
Мотивація навчання: буде розглянуто основні компоненти, які дозволяють створювати програми з графічним інтерфейсом.
2. Актуалізація опорних знань
Name — назва для використання у програмному коді. Як усталено має значення Form1.
Caption — текст заголовка вікна форми.
Color — колір тла. Вибирають зі списку чи у вікні діалогу.
Font — шрифт для текстових написів на формі.
BorderStyle — можливість змінювати розмір вікна програми. Як усталено має значення bsSizeable, що дозволяє змінювати ширину й висоту вікна. При значенні bsSingle вікно можна згортати, розгортати, закривати, переміщувати, але «розтягувати» не можна.
Cursor — дозволяє вибрати у вікні діалогу зовнішній вигляд вказівника, коли він перебуває у вікні.
Hint — текст підказки, який з’являється при наведенні вказівника миші на вікно форми. Для створення такої підказки спочатку потрібно всановити значення True.
Position — визначає розташування вікна програми на екрані монітора на початку виконання програми. Як усталено має значення poDesignet — відкриття вікна на місці останнього розташування форма. Якщо встановити значення poDesktopCenter, вікно програми буде відкрито в центрі екрана.
Height і Width — висота й ширини вікна у пікселях. Ці властивості можна змінювати за допомогою «розтягування» меж форми під час наочного програмування.
Значення властивостей можна змінювати при настанні події. Наприклад, при натисканні клавіші чи кнопки.
Подія — зміна властивостей об'єкта, взаємодія між об'єктами, утворення нового об'єкта або знищення наявного об'єкта.
В Object Pascal кожній можливій події надано певну назву. Перелік назв усіх можливих подій для виділеного об'єкта можна прочитати на вкладенні Події вікна Інспектор об'єктів.
Основні події для форми:
Процедура опрацювання події — частина коду програми, у якій описано відповідь програми на настання події.
Наприклад, після вибору у вікні Інспектора об'єктів події OnMouseEnter — потрапляння вказівника миші на об'єкт (форму) — у вікні Редактора тексту буде внесено заготовку для відповідної процедури опрацювання подій.
Внесення такого коду:
Form1.Height:=Form1.Height+50;
Form1.Width :=Form1.Width +50;
призведе до збільшення висоти й ширини форми при кожному потраплянні вказівника миші на форму під час виконання проекту.
Розглянемо інший приклад обробника подій: при закритті форми (подія OnClose) створити інформаційне вікно (вікно повідомлення) з текстом «Ви закрили вікно форми». Для цього
потрібно вибрати подію OnClose на вкладенні Події у вікні Інспектора об’єктів. Після натискання на кнопку «…» у тілі процедури обробника подій викликати процедуру:
ShowMessage ('Ви закрили вікно форми');
Cередовище програмування Lazarus містить великe кількість вбудованих процедур і функцій. Деякі з них є методами об’єктів, за допомогою яких можна виконувати дії з об’єктами. Для різних об’єктів передбачені різні методи, їх кількість і призначення залежать від конкретного об’єкта.
Метод — це фрагмент програмного коду, вбудованого в об’єкт. Метод має назву й містить набір вказівок, які буде виконано, якщо викликати метод для об’єкта. Запис вказівки для виклику методу складається з назв об’єкта та методу, розділених крапкою:
Назва об’єкта.Назва методу;
Назву методу, як і назву властивості, можна ввести з клавіатури або обрати зі списку, який відкривається, якщо в коді програми записати назву об’єкта і поставити крапку. У такому списку буде відображено всі ті методи, які можна викликати для обраного об’єкта.
Для форми найчастіше використовують такі методи:
Деякі методи можна викликати для різних об’єктів, а інші — лише для об’єктів певного типу. Наприклад, методи Show і Hide можна викликати для форми, напису, кнопки та інших об’єктів, а метод Close — лише для форми.
Кнопка Button на вкладенні Standart — важливий елемент інтерфейсу з широкими функціональними можливостями.
Enabled — доступність кнопки. Як усталено має значення True — кнопка доступна та виконує прописані команди;
ShowHint — виведення контекстної підказки. Після надання значення True можна задати текст підказки;
Visible — видимість кнопки. При значенні False кнопку не буде відображено на формі.
TabOrder — порядковий номер виділення компонентів. Визначає, в якому порядку компоненти отримають фокус введення даних при натисканні клавіші Tab. Нумерація починається з 0.
Кнопку найчастіше використовують для того, щоб під час виконання програми після натискання на неї виконати деяку послідовність вказівок. Тому з кнопкою найчастіше пов’язують подію OnClick і створють обробник саме цієї події.
Кнопка із зображенням BitBtn на вкладенні Additional — аналог Button. Цей компонент має свої особливі властивості:
Kind — тип кнопки. Є кілька визначених типів кнопки з готовою піктограмою і текстом, а також вже сформованою процедурою, зокрема:
Layout — місце розташування зображення на кнопці. Може мати такі значення:
Glyph — власне зображення на випадок, якщо не влаштовують запропоновані. При редагуванні буде відкрито вікно діалогу, в якому потрібно вказати шлях до зображення (див. малюнок нижче).
Текстове поле введення чи виведення даних Edit зі вкладення Standard має такі основні властивості:
Text — текст, який буде відображено у полі на початку виконання програми;
CharCase — регістр виведених символів, який може мати такі значення:
ReadOnly — дозвіл чи заборона введення інформації у поле;
MaxLength — максимальна довжина тексту (вимірюють у кількості символів);
HideSelection — чи буде зніматися виділення з тексту при втраті компонентом фокуса;
PasswordChar — символ, який буде відображено у полі замість введених символів — використовують, наприклад, для приховування пароля.
Основні події Edit:
onChange — будь-яка зміна відображуваного тексту.
onClick — натиснення на компонент.
Всі інші властивості та події аналогічні властивостям форми. При опрацюванні даних, введених у поле Edit, потрібно враховувати, що вони мають рядковий тип String.
Поле Label з вкладення Standard призначено для розміщення на формі текстового напису рядкового типу String.
Всі події аналогічні компоненту Edit.
Підписане поле введення LabeledEdit з вкладення Additional має такі самі властивості, що й поле Edit.
Компонент Memo з вкладення Standard призначено для введення багаторядкового тексту.
Деякі його властивості подібні до властивостей поля Edit. Але є і відмінні:
Lines — масив рядків. Дозволяє звертатися як до всього тексту, так і до його окремих рядках. Це складена властивість, яка має свої властивості, методи і події.
ScrollBars — смуги прокручування. Може набувати таких значень:
Крім перелічених вище властивостей, Memo має свої методи:
CopyToClipboard — копіювання тексту у буфер обміну;
CutToClipboard — вирізання виділеного тексту й поміщення його в буфер обміну;
PasteFromClipboard — вставляння в компонент тексту з буфера обміну у позицію, де розташовано курсор;
SelectAll — виділення всього тексту;
Undo — відміна останньої зміни у тексті.
Списки вибору ListBox і ComboBox з вкладення Standard використовують для вибору користувачем одного або декількох рядків.
ListBox — це список, схожий на Memo,
а ComboBox — список, що розгортається.
Специфічні властивості ListBox:
Columns — кількість стовпчиків у списку;
MultiSelect — дозвіл виділяти більше одного елемента списка;
ExtendedSelect — розширене виділення — дозвіл чи заборона виділяти діапазон з утриманням клавіші Shift. У будь-якому випадку, користувач може виділяти вибіркові рядки, клацаючи по ним по черзі і утримуючи при цьому Ctrl. Працює за умови MultiSelect = True;
Sorted — упорядкування списку. Якщо значення властивості True, список упорядковують за алфавітом.
Специфічні властивості ComboBox:
ArrowKeysTraverseList — при значенні True дозволяє переміщатися за списком кнопками зі стрілками.
AutoComplete — при значенні True дозволяє вибирати елементи зі списку, фільтруючи їх за введеними з клавіатури початковими символами.
AutoCompleteText — перемикачі автозавершення введення, які перелічують через кому у квадратних дужках:
cbactEnabled — включення опції AutoComplete;
cbactEndOfLineComplete — виконує AutoComplete лише за умови перебування вказівника в кінці рядка;
cbactRetainPrefixCase — зберігає ті самі символи, які ввів користувач;
cbactSearchAscending — при значенні True пошук відповідних рядків буде проведено в висхідному порядку (зростання), при значенні False — в низхідному порядку (спадання).
Мітка CheckBox (Прапорець) з вкладення Standard призначена для того, щоб користувач міг вказати своє рішення типу так / ні або так / ні / не впевнений.
Це рішення впливає на значення властивості State. Платформа може містити кілька таких компонентів. Стан кожного з них ніяк не залежить від стану інших.
Деякі прапорці можуть перебувати у частково встановленому стані. Така можливість потрібна, коли потрібно повідомити користувачеві про неповну відповідність. Для активування такої можливості використовують властивість AllowGrayed. Якщо для властивості AllowGrayed встановлено значення True, то прапорець при послідовних клацання на ньому буде по черзі перебувати у таких станах:
скинутий;
встановлений частково;
встановлений.
Стан компонента визначається відповідним значенням властивості State:
cbUnchecked;
cbGrayed;
cbChecked.
Значення властивості State можна змінювати як під час проектування за допомогою інспектора об’єктів, так і в програмі. Щоб реагувати на зміну стану прапорця, треба створити обробник події OnClick.
Група перемикачів RadioGroup з вкладення Standard — це панель з радіокнопками, з яких може бути включена тільки одна. Інакше кажучи, при включенні якоїсь кнопки всі інші вимикаються.
Основні властивості група перемикачів RadioGroup:
Зображення Image з вкладення Additional відображає на формі зображення і забезпечує роботу з ним.
4. Інструктаж з ТБ
5. Набуття практичних навичок
Повідомляти вчителя після виконання кожного із завдань 1, 2, 3.
Завдання 1. Створити у середовищі Lazarus інтерфейс вікна програми перевірки знань з хімії.
Вказівки до виконання
Завантажити середовище Lazarus і дочекатися появи порожньої форми.
У вікні Інспектор об’єктів змінити властивості форми:
Вибрати компонент PageControl з вкладення Common Controls
та розтягнути його на формі.
Властивості Align компонента PageControl надати значення alClient, що дозволить розгорнути отримані вкладки на всю величину форми.
За допомогою контекстного меню створеного об'єкта додати послідовно дві нові сторінки-вкаладення.
Назви (властивість Caption) щойно створених вкладень TabShet1 та TabShet2 змінити на Тренування і Тестування.
На вкладенні з назвою Тренування розмістити текстовий напис за допомогою поля Label з вкладення Standard. Змінити напис (значення властивості Caption) на такий:
«1. Кислотні оксиди реагують:».
Властивості WordWrap надати значення True, щоб напис можна було розташувати у кілька рядків.
Вибрати компонент CheckBox з вкладення Standard і розмістити 4 таких перемикача (датчики варіантів відповіді на питання) під написом Label. У всіх варіантах відповіді властивості Checked надати значення False, щоб на початку роботи програми ці компоненти не містили виставлених міток (прапорців).
Примітка. Cтан (вибраний чи не вибраний) компонента CheckBox не залежить від стану інших компонентів. Тому саме цей компонент доцільно вибрати для питання множинного вибору (декілька правильних відповідей).
Змінити підписи (значення властивості Caption) щойно створених компонентів на такі: «Реагують з лугами», «Реагують з кислотами», «Не реагують з лугами», «Не реагують з кислотами».
Cтворити текст другого питання за допомогою компонента Label з вкладення Standard і надати його властивості Caption таке значення:
«2. Маса нітритної кислоти 94 г відповідає такій кількості речовини».
Для створення варіантів відповіді використати компоненти RadioButton з вкладення Standard.
Змінити підписи (значення властивості Caption) щойно створених трьох коппонент на «100 моль», «20 моль», «2 моль» і перевірити, що значення властивості Checked дорівнює False.
Cтворити текст наступного питання за допомогою компонента Label з вкладення Standard і надати його властивості Caption таке значення:
«3. 3,5 моль оксиду карбону (IV) за нормальних умов займають:».
Для запису відповіді створити поле для вводу даних, вибравши Edit зі вкладення Standard. У властивості Text надати значення порожнього рядка, щоб при відкритті програми це поле було порожнім.
За допомогою компонента Label з вкладення Standard створити праворуч від створеного поля введення підпис одиниць вимірювання: «літрів».
Cтворити текст наступного питання за допомогою компонента Label з вкладення Standard і надати його властивості Caption таке значення:
«4. На малюнку зображена молекула кислоти:».
Використатии групу перемикачів RadioGroup з вкладення Standard.
Властивості Caption групу перемикачів надати значення порожнього рядка. Для створення варіантів відповіді вибрати властивість Items. У вікні діалогу ввести варіанти відповіді: сульфатна, сульфідна, сульфітна.
Для відображення малюнка на формі розмістити компонент Image з вкладення Additional.
Для завантаження зображення молекули
використати властивість Picture.
Вибрати значення True або False для властивостей Proportional, Stretch, Center залежно від того, як відображається графічний файл в об’єкті Image.
Розмістити поле для багаторядкового тексту Memo з вкладення Standard для виведення результату виконання завдань тесту. У властивості Lines видалити текст Memo1.
Додати кнопку Button з вкладення Standart. Надати її властивості Caption таке значення: «Перевірити».
Відправити проект на виконання натиснувши кнопку. Пересвідчитися, що поле Memo не відображено при запуску програми.
Зовнішній вигляд першого вкладення готовий. Правильно виконане завдання виглядає таким чином:
Завдання 2. Запрограмувати кнопку з написом: «Перевірити».
Вказівки до виконання
Виділити кнопку. На вкладенні Події вікна Інспектора об’єктів створити подію OnClick.
У редакторі коду запрограмувати реакцію на подію: при натисненні на кнопку відображення компонента Memo на формі і збільшення розмірів форми. Це дозволить вивести 4 рядки з інформацією про правильність вибраних варіантів і перекриє можливість повторного тестування.
Form1.Height:=600;
Memo1.visible:=true;
Memo1.Height:=Memo1.Height+50;
Додати реакцію на вибір компонентів CheckBox. Відповідь зараховувати як правильну лише при вибраних CheckBox1 та CheckBox4 і невибраних решті. При цій умові в Memo додати рядок з текстом про правильну відповідь:
If (checkBox1.State=cbChecked) and (checkBox4.State=cbChecked)
and (checkBox2.State=cbUnChecked) and (checkBox3.State=cbUnChecked)
Then Memo1.lines.Add('Завдання 1: Правильно')
Else Memo1.lines.Add('Завдання 1: Henравильно');
Внести вказівку визначення, чи вибрано правильний варіант RadioButton3 для питання 2:
If RadioButton3.Checked=True
Then Memo1.lines.Add('Завдання 2: Правильно')
Else Memo1.lines.Add('Завдання 2: Henравильно');
Внести вказівку визначення, чи введено правильний варіант 78.4 для питання 3:
If Edit1.Text='78.4'
Then Memo1.lines.Add('Завдання 3: Правильно')
Else Memo1.lines.Add('Завдання 3: Henравильно');
Внести вказівку визначення, чи вибрано правильний варіант відповіді для питання 4:
If RadioGroup1.ItemIndex=0
Then Memo1.lines.Add('Завдання 4: Правильно')
Else Memo1.lines.Add('Завдання 4: Henравильно');
Завдання 3. Створити інтерфейс вкладення Тестування.
Вказівки до виконання
На вкладенні Тестування розташувати список вибору ListBox з вкладення Standard для вибору класів, які можуть проходити тестування. Використавши властивість Items, створити список 8-А та 8-Б.
Для створеного списку вибору властивості Colums надати значення 2. Це дозволить розмістити список у два стовпчики.
На вкладенні Тестування розташувати список вибору ComboBox з вкладення Standard для вибору прізвища учня.
Властивостям AvtoComplete, AutoDropDown, Sorted створеного список вибору ComboBox надати значення True. Це дозволить розгортати список, попередньо розмістивши елементи в алфавітному порядку, та пропонувати варіант підстановки за першими літерами. Зауважимо: елементи списку (учнів класу) мають залежати від вибраного класу — елемента ListBox
Для створеного списку вибору ListBox створити процедуру опрацювання події опOnClick.
і ввести такі вказівки:
comboBox1.Clear; if ListBox1.itemindex=0 then begin comboBox1.items.Add ('Аваченко Т.'); comboBox1.items.Add ('Буряк Н.'); comboBox1.items.Add ('Воронько Л.'); comboBox1.items.Add ('Нестеренко В.'); comboBox1.items.Add ('Омельянов І.'); comboBox1.items.Add ('Потапенко А.'); comboBox1.items.Add ('Перебийніс Ю.'); end; if ListBox1.itemindex=1 then begin comboBox1.items.Add ('Бідкін П.'); comboBox1.items.Add ('Сидорчук А.'); comboBox1.items.Add ('Ткаченко С.'); comboBox1.items.Add ('Ярина Л.'); comboBox1.items.Add ('Литовчик М.'); comboBox1.items.Add ('Настирний О.'); comboBox1.items.Add ('Бойко А.'); end;
Розмістити 4 текстові написи Label з вкладення Standard для тексту завдань. За допомогою властивості Caption ввести тексти завдань.
Розмістити на тому самому вкладенні 3 компоненти RadioButton з вкладення Standard для вибору варіанта відповіді на перше питання (RadioButton4, RadioButton5, RadioButton6) та 3 компоненти Image з вкладення Additional праворуч від них для подання формул хімічних сполук такими зображеннями: , , .
Під формулюванням другого завдання розташувати групу перемикачів RadioGroup з вкладення Standard для варіантів відповідей. Властивість Caption залишити порожньою, а у властивості Items ввести варіанти відповідей:
Під формулюванням третього завдання розташувати:
Для четвертого завдання з упорядкування відповідей використати компоненти ListBox і Memo зі вкладення Standard.
У вікні діалогу властивості Items щойно створеного компонента ListBox внести відповіді:
У вікні діалогу властивості властивості Lines щойно створеного компонента Memo видалити текст напису Memo2, полишивши поле порожнім.
Між останніми двома створеними об'єктами розташувати дві невеликі кнопкки Button з вкладення Standard.
Для (верхньої) кнопки, призначеної для переміщення у поле Memo відповіді:
Для (нижньої) кнопки, призначеної для очищення поля Memo:
Для виведення результатів додати компонент Memo та кнопку Button з вкладення Standard.
Для останньої створеної кнопки:
властивості Caption надати значення «Перевірити»;
створити обробник події onClick, в який внести опис двох локальних змінних з типом integer:
i:=ComboBox1.ItemIndex; If (i>-1) Then Begin end else ShowMessage ('Не вибрано учня');
Якщо учня вибрано зі списку, то рядок і зі списку Items заносять у компонент Memo, призначений для виведення результатів тестування:
Memo3.Lines.Add(ComboBox1.Items[i]);
Змінній rez потрібно надати початкове значення:
rez:=1;
Далі в обробник подій вписати вказівки оцінювання завдань 1, 2, 3 і 4.
If RadioButton4.Checked=True Then rez:=rez+1; If RadioGroup1.ItemIndex=1 Тhen rez:=rez+2; If Edit2.Text='98' Then rez:=rez+3; If (Memo2.Lines[0]=('Оксид калію')) and (Memo2.Lines[1]=('Оксид міді')) and (Memo2.Lines[2]=('Оксид заліза')) and (Memo2.Lines[3]=('Оксид кремнію')) Then rez:=rez+4;
Далі в обробник подій вписати вказівки запису отриманого результату у другий рядок компонента Memo3, збільшення висоти останнього та перетворення його на видимимого:
Memo3.Visible:=True; Memo3.Height:=Height+60; Memo3.Lines.Add('Ваша оцінка'+IntToStr(rez));
Далі в обробник подій вписати вказівки збереження результату у текстовий файл D:\Test.txt:
Memo3.Lines.SaveToFile('D:\Test.txt');
Закустити проект на виконання та перевірити роботу кнопки з написом «Перевірити».
Проект зберегти в теку з назвою Ваше прізвище у місці, вказаному вчителем.
6. Підбиття підсумків уроку
Виставлення оцінок.
7. Домашнє завдання
У разі потреби доробити завдання. Удосконалити проект, передбачивши можливість завантажувати списки класів та учнів у них з текстових файлів, та після кожного наступного проходження тестування результат дописувати до наявного файлу із закриттям його.
Текст упорядкувала Кисловська Тетяна Миколаївна, учитель середньої загальноосвітньої школи № 182 Дніпровського району міста Києва, під час виконання випускної роботи на курсах підвищення кваліфікації з 29.10.2012 по 28.12.2012.