Интернет-журнал 'Домашняя лаборатория', 2007 №1 - Цыбанова

План урока:

1) Создание проекта программы

2) Визуальное проектирование диалоговой панели

3) Связывание элементов управления с событиями

4) Резюме, Упражнение и ответ к упражнению.

Теперь рассмотрим все пункты по порядку.

• Вначале запустим Visual C++. Зайдем в меню FILE —> NEW…, выберем там Project. Ваша панель должна выглядеть теперь так:

• Выберем там MFC AppWizard(exe), это значит вы хотите создать запускаемый файл.

• В Project Name задайте имя программы Draw. И щелкните ОК.

• В раскрывшемся окне (SТЕР1) выберете Dialog Based. Это означает, что ваша программа будет основана на диалоге. Щелкните Next.

• В STEP2 задайте в Please enter title of your dialog имя программы The Draw Program.

Остальное оставьте без изменения и нажмите NEXT.

• В STEP3 Оставьте все без изменения и щелкните NEXT. Здесь вы указали, что ваша программа будет иметь библиотеку с динамической компоновкой (DLL), а не статической.

• В STEP4 Оставьте все без изменения. Посмотрите, чтобы в Class Name было выбрано CTestApp и щелкните FINISH.

Вы закончили создание проекта программы!

Все каркасные файлы для вашей программы написал Visual C++, с помощью мастера настроек MFC AppWizard.

MFC — это вещь очень полезная, с помощью нее можно быстро создавать программы, так как все дежурные файлы он пишет сам, что сильно облегчает работу программиста, ведь не писать стандартный набор текста каждый раз!

А теперь мы спроектируем диалоговую панель.

Проектирование диалоговой панели

Сейчас мы визуально спроектируем диалоговую панель. Для этого вначале выберете закладку "Resourse View" и раскройте пункт Draw Resource, как показано на рис. 1.5.

Выполните следующие действия

• Щелкните два раза по надписи IDD_DRAW_DIALOG. Справа появится окно проектирования диалоговой панели.

• С помощью панели Controls расставьте элементы, управления как показано на рис. 2.0 и согласно таблице 2.0.

Теперь рассмотрим все пункты по порядку.

• В объекте Dialog Box вы задаете следующие данные:

Caption — название диалогового окна.

Font — здесь вы установили шрифт — System и его размер 10

• Static Text — это элемент текста, он вставляется как обычный элемент управления, но не выполняет никаких функций, так как служит для показа текста, который вы зададите в Captions. Так же мы задали некоторые графические установки для статистического текста — это Client Edge и Static Edge. Поздравляю, вы закончили визуальное проектирование диалоговой панели!

Связывание событий с элементами управления

Связывание кода с событием BN_CLICKED кнопки Exit

При нажатии на кнопку Exit программа Draw.Exe завершится.

• Чтобы связать код с событием BN_CLICKED кнопки EXIT, выполните следующие действия:

• Выберете ClassWizard в меню View

• Выберете закладку Message Maps в панели ClassWizard

• Используйте диалоговую панель ClassWizard для выбора следующего события:

Class Name: CDrawDIg

Object ID: IDC_EXIT_BUTTON

Messages: BN_CLICKED

• Щелкните на кнопку Add Fucntion и в раскрывшемся окне нажмите кнопку ОК.

• Сейчас ваша панель MFC ClassWizard должна будет выглядеть так:

• Нажмите кнопку Edit Code и напишите следующий код в функции OnExitButton():

void CDrawDlg::OnExitButton()

{

// TODO: Add your control notification handler code here

////////Мой код начинается здесь///////////

OnOK();

////////Мой код заканчивается здесь///////////

}

• Функция ОnОК(), которую вы ввели завершает программу, при нажатии на кнопку Exit.

Связывание кода с событием WM_MOUSEMOVE диалоговой панели

Сейчас мы свяжем код с событием WM_MOUSEMOVE, которое будет автоматически выполняться при передвижении мыши.

• Чтобы связать код с событием WM_MOUSEMOVE диалоговой панели, выполните следующие действия:

• Выберете ClassWizard в меню View

• Выберете закладку Message Maps в панели ClassWizard

• Используйте диалоговую панель ClassWizard для выбора следующего события:

Class Name: CDrawDIg

Object ID: CDrawDIg

Messages: WM_MOUSEMOVE

• Щелкните на кнопку Add Fucntion.

Нажмите кнопку Edit Code и напишите следующий код в функции OnMouseMove():

void CDrawDlg::OnMouseMove(UINT nFlags, CPoint point)

{

// TODO: Add your message handler code here and/or call default

////////Мой код начинается здесь///////////

if((nFlags 8l MK_LBUTTON)==MK_LBUTTON)

{

CCIientDC dc(this);

dc.SetPixel(point.x, point.y, RGB(0,0,0));

}

//конец структуры IF

////////Мой код заканчивается здесь///////////

///…

• Код который вы ввели содержит единственный оператор IF:

• Оператор IF содержит в себе функции, которые будут выполняться, если условие оператора IF верно. Условие таково, если левая кнопка мыши нажата и произошло перемещение, то функции внутри оператора IF выполняются.

• Функция OnMouseMove выполняется при любом передвижении мыши, ее параметр nFlags показывает была ли нажата какая-нибудь клавиша клавиатуры(типа ALT или Shift) и кнопка мыши. Операция & проверяет прижата ли левая кнопка мыши при ее перемещении. Если это так, то выполняется код ниже оператора IF.

• Код в блоке оператора IF CCIientDC dc(this); создает объект контексного устройства, с помощью него вы сможете рисовать, его можно назвать воображаемым экраном в памяти компьютера. Научно говоря, dc(this) — это экземпляр класса CCIientDC с параметром конструктора this, с помощью экземпляра класса вы можете обращаться к функциям этого класса.

• Следующий оператор, который вы напечатали рисует точку в заданном месте (место щелчка мыши), используя параметры point.x и point.y, которые ему передает функция OnMouseMove, и заданного цвета, с помощью функции RGB();.

Сейчас у нас установлен черный цвет, чтобы установить красный, синий или зеленый, надо заменить параметры функции RGB() соответственно на 255, 0, 0, 0, 255, 0, 0, 0,255.

Рисование изображения точка за точкой

Чтобы увидеть в действии свой код, выполните следующие действия:

• Скомпонуйте и скомпилируйте программу.

• Запустите ее.

• Удерживая нажатой левую кнопку мыши, претащите ее в сторону.

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

• При выполнении функции OnMouseMove параметр point передает положение курсора во время последней проверки его положения.

Расширение возможностей программы DRAW

Сейчас вы расширите возможности программы Draw. Вы сделаете так, чтобы при передвижении мыши, рисовалась сплошная линия.

• Модифицируем программу следующим образом.

• Чтобы соединить точки линией функция OnMouseMove должна знать предыдущие координаты мыши, для этого нам нужно объявить две переменные m_PrevX и m_PrevY, для хранения координат по X и Y.

• Выведем на экран файл DrawDIg.h, для этого откроем Project Workspace, щелкнем на