Основні питання, які виникають при розробці проєкту:
- як можна малювати кола на формі?
- як зробити, щоб при натисканні по колу він змінював колір?
- як перевіряти чи можна зробити натупний крок?
Засоби малювання на формі
Щоб відповісти на перше питання, спочатку потрібно взагалі розібратися що таке область малювання і як можна вивести на формі наприклад прямокутник або коло?
Це питання розглянуто у цій статті: http://it-game.sfera.org.ua/2022/04/gdi-dotnet.html
Проєкт DemoDrawEllipse - малюємо пола різного кольору
Проєкт на Visual Studio
1. У Visual Studio 2022 створіть новий проект на C#, тип проекту Windows Forms App, назва прооєкту DemoDrawEllipse.
2. Зменшіть розмір форми, встановіть заголовок форми Demo DrawEllipse.
3. Розташуйте на формі три елементи Label. Встановіть розміри елементів 50, 50, властивостям Text задайте значення 10, 20 та 30, щоб нам було простіше розрізняти елементи на формі.
4. Клацніть на елементі Label1, у вікні Properties перейдіть до вкладки Events (Події), знайдіть подію Paint. Двічі натисніть на рядку з подіїю Paint, відкриється редактор коду:
private void Label1_Paint(object sender, PaintEventArgs e)
{
}
У редакторі коду введіть наступний рядок:
e.Graphics.DrawEllipse(Pens.Red, 0, 0, 50, 50);
Ця команда виводить коло червоним пером у правому верхньому куті, розміри кола - 50 пікселей шириною та 50 пікселей висотою. Розміри кола як раз відповідають розмірам елемента Label.
5. Клацніть на елементі Label2, у вікні Properties перейдіть до вкладки Events (Події), знайдіть подію Paint. Двічі натисніть на рядку з подіїю Paint, у редакторі коду введіть наступний текст:
Brush myBrush;
myBrush = new SolidBrush(Color.Coral);
e.Graphics.FillEllipse(myBrush, 0, 0, 50, 50);
6. Запустіть програму на виконання. Вікно повинно мати такий вигляд:
Що ми бачимо на формі? Перше коло обрізане з правого та нижнього краю, це ми потім виправимо на нижньому колі. А на другому колі взагалі не видно цифр 20, ці цифри замалювалися колорьом. Щоб було видно цифри, потрібно замальовувати не суцільною кистю, а встановити прозорість. Давайте це зробимо.
7. Клацніть на елементі Label3, у вікні Properties перейдіть до вкладки Events (Події), знайдіть подію Paint. Двічі натисніть на рядку з подіїю Paint, у редакторі коду введіть наступний текст:
Brush semiTransBrush = new SolidBrush(Color.FromArgb(128, 0, 0, 255));
e.Graphics.FillEllipse(semiTransBrush, 0, 0, 50, 50);
8. Запустіть програму на виконання. Вікно повинно мати такий вигляд:
9. Клацніть на елементі Label4, у вікні Properties перейдіть до вкладки Events (Події), знайдіть подію Paint. Двічі натисніть на рядку з подіїю Paint, у редакторі коду введіть наступний текст:
e.Graphics.DrawEllipse(Pens.Red, 0, 0, 49, 49);
10. Запустіть програму на виконання. Вікно повинно мати такий вигляд:
Зараз все гаразд. Тепер ми знаємо як виводити прозорі кола, та кола з фоном іншого кольору.
Не забудьте зберегти проєкт.
Що далі?
Наступного разу ми створимо форму для нашого майбутнього проекту, тобто створимо новий проєкт та розташуємо на формі необхідні елементи - елементи Label, фонові зображення щоб відмітити початок та кінець лабіринту, добавимо текст для пояснення користувачю що йому потрібно робити в цій програмі.
