Урок "Складання та виконання алгоритмів з графічним відображенням даних"

Тема уроку: Складання та виконання алгоритмів з графічним відображенням даних.

Мета уроку:

• Закріпити знання, вдосконалити уміння і навички складання та виконання алгоритмів з графічним відображенням даних;
• створити програму з використанням алгоритмів для побудови графічних зображень;
• розвивати естетичний смак до художнього оформлення;
• формувати творчу особистість.

Тип уроку: Урок застосування знань, умінь та навичок. 

Хід уроку

І. Організаційний момент

Вітання з учнями.

Налаштування учнів на роботу на уроці.

2.  Перевірка домашнього завдання.
3.  Актуалізація опорних знань учнів

Вправа «Знайди правильну відповідь»

1. Петрик провів горизонтальну лінію червоного кольору.

Оберіть правильний фрагмент коду:

A)

Pen myPen1 = new Pen(Color.Red, 2);

            gr.DrawLine(myPen1, 50, 100, 300, 100);

B)

Pen myPen1 = new Pen(Color.Gold, 2);

            gr.DrawLine(myPen1, 50, 100, 300, 100);

C)

Pen myPen1 = new Pen(Color.Red, 2);

            gr.DrawLine(myPen1, 50, 300, 100, 100);

2. Далі Петрик провів ще дві лінії:

gr.DrawLine(myPen1, 300, 100, 300, 200);

gr.DrawLine(myPen1, 300, 200, 50, 200);

і побачив, для побудови прямокутника не вистачає ще однієї сторони.

Оберіть правильний варіант відрізка:

1. gr.DrawLine(myPen1, 50, 200, 50, 300);
2. gr.DrawLine(myPen1, 200, 50, 100, 50);
3. gr.DrawLine(myPen1, 50, 200, 50, 100);

3. Петрик продовжив експериментувати та вирішив занотувати ширину прямокутника.

Оберіть правильну відповідь.

1. 200;
2. 250;
3. 100

4. А тепер Петрик занотує висоту прямокутника.

Оберіть правильну відповідь.

1. 100;
2. 200;
3. 50

5. Петрик побудував прямокутник і подумав, що це довго та нецікаво, адже це можна зробити значно простіше.

Оберіть правильну відповідь, щоб вийшов точно такий прямокутник та ще й на тому ж місці, який він побудував за допомогою чотирьох відрізків.

  Оберіть правильну відповідь:

1. gr.DrawRectangle (myPen1, 300, 100, 250, 100);
2. gr.DrawRectangle (myPen1, 50, 200, 100, 250);
3. gr.DrawRectangle (myPen1, 50, 100, 250, 100);

6. Дивне завдання отримав Петрик: побудувати еліпс, обмежений побудованим раніше прямокутником.

Оберіть правильну відповідь:

1. gr. DrawEllipse (myPen1, 50, 100, 250, 100);
2. gr. DrawEllipse (myPen1, 50, 200, 100, 250);
3. gr. DrawEllipse (myPen1, 50, 50, 250, 100);

ІІІ. Мотивація навчальної діяльності

Кожна людина має мрію. Впевнена, що в кожного з вас вона теж є. Щоб мрія здійснилася треба багато та старанно працювати. Вирушимо у подорож до мрії на кораблі.

IV. Повідомлення теми та мети уроку.

Діти, тема нашого сьогоднішнього уроку «Складання та виконання алгоритмів з графічним відображенням даних»

Давайте повторимо правила поведінки та безпеки в комп’ютерному класі.

Увага! Під час роботи за комп’ютером дотримуйтеся правил безпеки і санітарно-гігієнічних норм.  

Зараз перейдемо до виконання практичної роботи.

V. Практична робота.

Завдання1. Скласти програму, яка будує зображення корабля за поданим зразком:

Завдання2. Доповнити зображення хвилями.

Завдання3. Доповнити зображення фоном та чайками.

Хід виконання:

1. Створити на робочому столі власну папку.
2. Запустити середовище програмування Visual Studio 2015.
3. Створити проект WindowsForms та зберегти у власну папку.
4. Розмістити на формі один елемент Button.
5. Створити подію Click для кнопки.
6. Задати код для кнопки «Малюй!»

  private void button1_Click(object sender, EventArgs e)

  {

            Graphics graph;//листок(аркуш)

            Pen p1, p2; //ручки

            SolidBrush b1, b2, b3, b4, b5, b6, b7; //заливка

            //ініціалізація

            graph = CreateGraphics();

            Pen myPen1 = new Pen(Color.Red, 3);

            b1 = new SolidBrush(Color.Yellow);

            b2 = new SolidBrush(Color.Green);

            Pen myPen2 = new Pen(Color.Green, 3);

            Pen myPen3 = new Pen(Color.Aquamarine, 1);

            b3 = new SolidBrush(Color.Aquamarine);

            // фон нижньої частини малюнка

            graph.DrawRectangle(myPen3, 0, 250, this.Width, this.Height);

            graph.FillRectangle(b3, 0, 250, this.Width, this.Height);

            Pen myPen4 = new Pen(Color.DeepSkyBlue, 1);

            b4 = new SolidBrush(Color.DeepSkyBlue);

            // фон верхної частини малюнка

            graph.DrawRectangle(myPen4, 0, 0, this.Width, 250);

            graph.FillRectangle(b4, 0, 0, this.Width, 250);

 

            Point[] myPoints1 =//координати правого вітрила

            {

  new Point(340, 50),

  new Point(340,300),

  new Point(500, 300),

  new Point(340, 50),

  };

 

            Point[] myPoints2 =//координати лівого вітрила

           {

  new Point(330, 80),

  new Point(330,300),

  new Point(200, 300),

  new Point(330, 80),

           };

 

            Point[] myPoints3 =//координати прапорця

           {

  new Point(330, 45),

  new Point(270, 45),

  new Point(300, 60),

  new Point(270, 75),

  new Point(330, 75),

  new Point(330, 45),

 };

            Point[] myPoints4 =//координати корпусу корабля

           {

  new Point(600, 310),

  new Point(100,310),

  new Point(180, 410),

  new Point(520, 410),

  new Point(600, 310),

 };

            //координати сонця

            graph.DrawEllipse(Pens.Red, 180, 330, 30, 30);

            graph.FillEllipse(b1, 180, 330, 30, 30);

 

            //побудова лівого вітрила

            graph.DrawPolygon(myPen1, myPoints1);

            graph.FillPolygon(b1, myPoints1);

            //побудова лівого вітрила

            b5 = new SolidBrush(Color.BlueViolet);

            graph.DrawPolygon(myPen1, myPoints2);

            graph.FillPolygon(b5, myPoints2);

            //побудова прапорця

            b6 = new SolidBrush(Color.Orange);

            graph.DrawPolygon(myPen1, myPoints3);

            graph.FillPolygon(b6, myPoints3);

            //побудова корпусу

            b7 = new SolidBrush(Color.Goldenrod);

            graph.DrawPolygon(myPen1, myPoints4);

            graph.FillPolygon(b7, myPoints4);

            //побудова ілюмінаторів

            graph.DrawEllipse(Pens.Blue, 180, 330, 40, 40);

            graph.FillEllipse(b2, 180, 330, 40, 40);

            graph.DrawEllipse(Pens.Blue, 330, 330, 40, 40);

            graph.FillEllipse(b2, 330, 330, 40, 40);

            graph.DrawEllipse(Pens.Blue, 480, 330, 40, 40);

            graph.FillEllipse(b2, 480, 330, 40, 40);

 

            graph.DrawEllipse(myPen1,540, 40, 60, 60);

            graph.FillEllipse(b1, 540, 40, 60, 60);

 

            Pen bluePen = new Pen(Color.Blue, 3);

 

            int x1 = 0;

            int y1 = 510;

            int x2 = -50;

            int y2 = 460;

            int x3 = 0;

            int y3 = 410;

            int width = 100;

            int height = 100;

 

 

            int startAngle = 0; //початковий кут

            int sweepAngle = -180; //кут повороту

 

            // Вивести хвилі

          for (int i=0;i<7; i++)

            { graph.DrawArc(bluePen, x1, y1, width, height, startAngle, sweepAngle);

                x1 += width;

                graph.DrawArc(bluePen, x2, y2, width, height, startAngle, sweepAngle);

                x2 += width;

                graph.DrawArc(bluePen, x3, y3, width, height, startAngle, sweepAngle);

                x3 += width;

            }

 

          // малюємо чайку

            graph.DrawArc(bluePen, 100, 60, width, height/2, startAngle, -65);

            graph.DrawArc(bluePen, 200, 60, width, height/2, 180, 35);

            // малюємо ще одну чайку

            graph.DrawArc(bluePen, 400, 100, width, height / 2, startAngle, -65);

            graph.DrawArc(bluePen, 500, 100, width, height / 2, 180, 35);                 }

7. Запустити проект на виконання. Очікуваний результат:

 

 

VІІ. Рефлексія.

VІІІ. Підведення підсумків. Оцінювання.

IX. Домашнє завдання.

Завдання додому. Скласти програму для побудови даного зображення.