Тема: Програмування інтерфейсу користувача: діалогові вікна

 

Мета: навчитися користуватися майстром додатків Visual C + + і створювати програми на мові С + +, створювати діалогові вікна і вкладки

Завдання:

Створити діалогове вікно з вкладками (Вкладка 1, Вкладка 2, Вкладка 3). На вкладках розмістити елементи Edit, в які користувач буде вводити які-небудь значення, які передадуться на головну форму при запуску програми.

Хід роботи:

1. Починаємо роботу з того що створюємо новий проект заснований на діалогових вікнах (dialog based), як показано на рис. 6.1.

 

Рис. 6.1 - Створення нового проекту

 

Далі нам потрібно створити діалогові вікна, які будуть служити основою для наших вкладок. Для цього виконаємо команду insert-> resource (див. рис. 6.2).

 

 

Рис. 6.2 - Виконання команди insert-> resource

 

Вибираємо діалог середнього розміру і тиснемо new, як на рис. 6.3. Цю операцію виконати три рази, таким чином створити 3 діалогових вікна (див. мал. 6.4).

 

 

Рис. 6.3 - Створення діалогу середнього розміру

 

Рис. 6.4 - Створення трьох діалогових вікон

 

Далі ми можемо змінити заголовки наших майбутніх вкладок. Для цього виберемо перше діалогове вікно, натиснемо праву кнопку миші і відкриємо вікно вибору властивостей діалогового вікна (див. мал. 6.5, 6.6).

 

Рис. 6.5 - Вікно вибору властивостей діалогового вікна

 

 

Рис. 6.6 - Вікно налаштування властивостей діалогового вікна

 

Для кожного діалогу необхідно створити свій клас. Для цього клацнемо по першому діалоговому вікну правою кнопкою і виберемо class wizard, далі піде пропозиція створити новий клас (див. рис. 6.7).

 

Рис. 6.7 - Створення нового класу діалогового вікна

Тиснемо ок.

Ім'я класу prop1 для першого вікна prop2 і prop3 для другого і третього відповідно.

Базовий клас для всіх CPropertyPage (див. рис. 6.8).

 

 

Рис. 6.8 - Завдання імені класу діалогового вікна

 

Далі тиснемо ок. І повторюємо операцію для всіх трьох діалогових вікон.

 

Далі переключимося на наше перше вікно (головну форму), створене в проекті автоматично (див. рис. 6.9).

 

 

Рис. 6.9 - Головна форма

 

Тут ми створимо кнопку, по натисненню якої буде викликано вікно з вкладками.

Створюємо кнопку і подвійним клацанням створюємо обробник для неї, як показано на рис. 6.10.

 

Рис. 6.10 - Створення обробника події

 

У розпочатому файлі необхідно підключити створені нами класи, для цього у верху прописуємо наступний код (див. рис. 6.11):

 

#include "prop1.h"

#include "prop2.h"

#include "prop3.h"

 

 

Рис. 6.11 - Створення обробника події

 

Усередині обробника кнопок створюємо об'єкти створених нами раніше класів:

prop1 m_prop1;

prop2 m_prop2;

prop3 m_prop3;

Далі створимо об'єкт нашого віконця з вкладками.

CPropertySheet m_prop("окно с вкладками");

Додаємо вкладки до вікна з вкладками і запускаємо вікно

m_prop.AddPage(&m_prop1);

m_prop.AddPage(&m_prop2);

m_prop.AddPage(&m_prop3);

m_prop.DoModal();

 

У підсумку обробник повинен виглядати так, як показано на рис. 6.12:

 

 

Рис. 6.12 - Створення обробника події

 

Запустимо проект і при натисканні на кнопку «вкладки» ми побачимо:

 

 

Рис. 6.13 - Результат роботи програми

 

Далі розмістимо на вкладках і на головному вікні кілька елементів edit. І зв'яжемо з ними змінні як в минулих роботах (див. рис. 6.14, 6.15).

Рис. 6.14 - Розміщення на вкладках елементів Edit

 

 

Рис. 6.15 - Створення змінних

 

Схожим чином створимо змінні m_b і m_c на другий і третин вкладці.

На головному діалоговому вікні розмістимо три елементи edit і зв'яжемо їх із змінними m_a, m_b і m_c. Далі ми спробуємо передати значення введені нами у вкладках головного вікна.

Після того як ми заповнили поля у вкладках, і натиснули на ок, значення повинні перенестися на головне вікно. Фінальний код обробника кнопки «вкладки».

 

// TODO: Add your control notification handler code here

prop1 m_prop1;

prop2 m_prop2;

prop3 m_prop3;

CPropertySheet m_prop("окно с вкладками");

m_prop.AddPage(&m_prop1);

m_prop.AddPage(&m_prop2);

m_prop.AddPage(&m_prop3);

m_prop.DoModal();

if (m_prop.DoModal()==IDOK)

{

m_a=m_prop1.m_a;

m_b=m_prop2.m_b;

m_c=m_prop3.m_c;

UpdateData(false);

}

 

Тепер все має працювати.

 

КОНТРОЛЬНІ ЗАПИТАННЯ

1. Назвіть послідовність етапів створення діалогового вікна?

2. Назвіть послідовність етапів створення диалога за допомогою класу?

3. Назвіть послідовність етапів створення вкладок?

4. Как можно осуществлять передачу данных между вкладками?

 

Практична робота № 7