Графические операторы и процедуры

Открытый урок по информатике                                                                 8 класс

Учитель Бекбасарова Ж.А.

Тема урока :  Графические операторы и процедуры

Цель урока :   1.Познакомить учащихся с координатной плоскостью экрана, используемой    для построения рисунков в графическом режиме на языке  Образовательная: расширить понятие графики, понимание возможностей ABC PASCAL в создании графических объектов;

Развивающая: научиться создавать графические объекты в ABC PASCAL; освоить основные графические процедуры и функции; развивать приёмы умственной деятельности, развивать познавательность, приобретение опыта; формировать системно - информационный подход к анализу информации окружающего мира;

Воспитательная: воспитать информационную культуру учащихся, внимательность, аккуратность, дисциплинированность, усидчивость; развивать познавательный интерес; основы коммуникативных отношений.

Тип урока: комбинированный урок – урок объяснения нового материала и закрепления

 Методы, планируемые к использованию на уроке: 
Словесный метод беседа;
Задачный метод.
Дидактические средства:
Презентация, выполненная в программе PowerPoint; карточки с описанием некоторых процедур и функций (приложение 1); компьютер.

Ход урока
(перед уроком учитель разгладывает на парты ученикам карточки с описанием некоторых процедур и функций)

                      Ход урока:

1. Орг момент Проверка учащихся, подготовка к уроку

2. Правила безопасного поведения на уроке Нельзя самостоятельно, без разрешения учителя, включать и выключать компьютеры. Нельзя дотрагиваться до задней части компьютера и проводов. Нельзя работать грязными и мокрыми руками и в мокрой одежде. Нельзя нажимать клавиши ручкой или карандашом, показывать на экране их пишушей частью или пальцами рук. Нельзя ходить по классу, подниматься со своего места без разрешения учителя. В случае неисправности компьютера или появлении дыма – покинуть рабочее место и сообщить учитель. 3. Актуализация знаний. С какой записи начинается программа в ABC Pascal? Program <имя программы> Какой командой заканчивается программа? End.  С какой команды начинается раздел описания, в котором записываются данные? Var Какие типы данных вы знаете? Integer (целые числа) Real(десятичные дроби) Команда ввода данных? Write (‘ ‘) Команда для запоминания компьютером введённых значений данных? Readln ( ) или Read(‘ ‘) Команда начала программы? Begin Команда для вывода полученных данных, результата Write(‘ ’) или Writeln(‘ ’) Как запустить Pascal ABC? Пуск – Все программы - Pascal ABC Какой знак ставиться в конце программы после команды End? 4. Новая тема - В современном мире встречается очень много графических элементов. Что же такое графика? (ученики высказывают свои мнения). - Мы будем сегодня рассматривать графику на языке программирования, который мы изучаем – это в Pascal. Прежде, чем приступить к созданию графических программ в Pascal, необходимо ознакомиться с богатейшими графическими возможностями этого языка, сосредоточенными в стандартных модулях  (библиотеках) GRAPH и CRT(название CRT происходит от Catdode-Ray Tube — электронно-лучевая трубка). Эти модули содержат описания стандартных констант, процедур и функций, графическом режиме. При работе в графическом режиме весь экран разбивается на отдельные точки —"пикселы". Положение пиксела также задается двумя координатами — X и Y. Координата X увеличивается слева направо, а координата Y — сверху вниз.  Подключение модулей CRT и GRAPH к программе осуществляется с помощью ключевого слова Uses (англ.uses — использует) Uses Crt, Graph.  Теперь рассмотрим некоторые графические процедуры и функции. У вас на столе лежат такие же таблички с процедурами. - Скажите, для того, чтобы нарисовать круг, какую необходимо использовать процедуру? (ученики отвечают) - Нарисуйте в программе круг. Для того, чтобы графические объекты выглядели более красиво и привлекали внимание, используют цвета и штриховку У вас на карточках тоже показано как оформляются в программе цвета и штриховка. - Сейчас вы будете выполнять простейшие графические объекты. Но для начала я хочу показать, какие еще объекты можно создавать с помощью языка программирования Pascal Демонстрация любой готовой программы. Как строится изображение на экране? Что такое пиксель? Как вы понимаете разрешение экрана? Графический экран дисплея состоит из точек, которые можно засвечивать определенным цветом или гасить, в результате чего на экране создается некоторое изображение.Точки называют пикселями. Количество точек на экране может быть различным. Это зависит от качества монитора. Графическим редактором называется специальный редактор, позволяющий выводить на экран графические образы, изображенные в виде множества точек. Рассмотрим экран, который имеет 640 точек в горизонтальном направлени и 480 точек в вертикальном направлении. Начало отсчета точек находится в левом верхнем углу экрана. Каждая точка характеризуется двумя точками (х,у). Модуль является независимой программой. Чтобы подключить модуль к программе, достаточно указать его имя :Uses  имя модуля. Для использования процедур и функции библиотеки в модуле Graph , в разделе описания программы нужно написать ключевые слова Uses Graph ABC, если при вычерчивании графика нужно использовать процедуры библиотеки CRT, используется строка Uses Graph ABC CRT. Графические процедуры и функции  Setpixel (x,y:integer, color)- оператор построения точки, где x,y- координаты точки, color- определяет цвет точки. Line (x1,y1,x2,y2: integer) – процедура построения прямой, где x1,y1-  начальная точка, x2,y2 – конечная точка SetPenColor (color:integer)- color- название нового цвета или номер нового установленного цвета. Circle (x,y,r:integer) рисует окружность с центром в точке (х,у)и радиусом r Ellipse(x1,y1,x2,y2:integer)- рисует эллипс, заданный своим описанным прямоугольником с координатами противоположных вершин (x1,y1)  и (x2,y2) Rectangle( x1,y1,x2,y2:integer) –рисует прямоугольник, заданный координатами противоположных вершин (x1,y1)  и (x2,y2) RoundRect(x1,y1,x2,y2,w,h:integer)- рисует прямоугольник со скругленными краями; (x1,y1)  и (x2,y2) задают пару противоположных вершин, а w и h –ширину и высоту эллипса, используемого для скругления краев. TextOut(x,y:integer;s:string) – выводит строку s в позицию (x,y) (точка (х,у) задает верхний левый угол прямоугольника, который будет содержать текст из строки s) FloodFill(x,y,color:integer) –заливает область одного цвета цветом color, начиная с точки (х,у) FillRect(x1,y1,x2,y2:integer) – заливает прямоугольник, заданный координатами противоположных вершин (x1,y1)  и (x2,y2), цветом текущей кисти SetFontColor (color:integer) – цвет текста границы. Ø    5. Практическая работа Задание1. Составить программу, применяя процедуры Line  и SetPixel нарисуйте домик. program domik; uses GraphABC; begin SetPenColor(clred); line(200,150,400,150); line(400,150,400,350); line(400,350,200,350); line(200,350,200,150); line(200,150,300,50); line(300,50,400,150); SetPixel(250,200,2); SetPixel(350,200,2); SetPixel(250,300,2); SetPixel(350,300,2); SetPixel(300,100,2); end. 6.Итог урока: Сегодня мы познакомились с некоторыми графическими функциями и процедурами, попытались построить простейший графический объект. 7.Домашнее задание (творческое): Составить программу, изображающую вашего любимого героя.  Приложение 1 Описание некоторых графических процедур и функций Arc(X, Y: Integer; U1, U2, R: Word)   Строит дугу окружности X, Y — координаты центра дуги, U1 — угол до начальной точки дуги, отсчитываемый против часовой стрелки от горизонтальной оси, направленной слева направо, U2 — угол до конечной точки дуги, отсчитываемый так же, как U1, R — радиус дуги.  Bar(X1, Y1, X2, Y2: Integer)   Закрашенный прямоугольник. Circle(X, Y: Integer; R: Word)   Рисует текущим цветом окружность радиуса R c центром в точке (X,Y).  Ellipse(X, Y: Integer; U1, U2, XR, YR: Word)   Рисует дугу эллипса текущим цветом; X, Y — координаты центра эллипса; U1, U2 — углы до начальной и конечной точек дуги эллипса (см. процедуру Arc); XR, YR — горизонтальная и вертикальная полуоси эллипса.  FillEllipse(X, Y: Integer; XR, YR: Word)   Рисует заштрихованный эллипс, используя X,Y как центр и XR,YR как горизонтальную и вертикальную полуоси эллипса.  FillPoly(N: Word; Var PolyPoints)   Рисует и штрихует многоугольник, содержащий N вершин с координатами в PolyPoints.  Line(X1, Y1, X2, Y2: Integer)   Рисует линию от точки X1, Y1 до точки X2,Y2.  LineTo(X, Y: Integer)   Рисует линию от текущего указателя к точке X,Y.  PieSlice(X, Y: Integer; U1, U2, Radius: Word)   Строит сектор круга, закрашенный текущей штриховкой и цветом заполнения. X, Y — координаты центра сектора круга; U1 и U2 — начальный и конечный углы сектора, отсчитываемые против часовой стрелки от горизонтальной оси, направленной вправо; Radius — радиус сектора.  PutPixel(X, Y: Integer; Color: Word)   Выводит точку цветом Color с координатами X, Y.  Rectangle(X1, Y1, X2, Y2)   Рисует контур прямоугольника, используя текущий цвет и тип линии. X1, Y1 — координаты левого верхнего угла прямоугольника, X2, Y2 — координаты правого нижнего угла прямоугольника.  Sector(X, Y: Integer; U1, U2, XR, YR: Word)   Рисует и штрихует сектор эллипса радиусами XR, YR с центром в X, Y от начального угла U1 к конечному углу U2.  SetBkColor(Соlor: Word)   Устанавливает цвет фона.  SetFillStyle(Pattern, Color: Word)   Устанавливает образец штриховки и цвет.  SetLineStyle(LineStile, Pattern, Thickness: Word)   Устанавливает толщину и стиль линии.  SetViewPort(X1, Y1, X2, Y2: Integer; ClipOn: Boolean)   Устанавливает прямоугольное окно на графическом экране. Параметр ClipOn определяет "отсечку" элементов изображения, не умещающихся в окне. Константы цвета Black = 0; {Черный}   Blue = 1;   {Синий}   Green = 2; {Зеленый}   Cyan = 3; {Голубой}   Red = 4; {Красный}   Magenta = 5;  {Фиолетовый}   Brown = 6;   {Коричневый}   LightGray = 7; {Светлосерый}  DarkGray = 8;   {Темносерый}   LightBlue = 9; {Яркосиний}   LightGreen = 10;  {Яркозеленый}   LightCyan = 11;   {Яркоголубой}   LightRed = 12; {Розовый}   LightMagenta = 13; {Малиновый}   Yellow = 14;   {Желтый}   White = 15; {Белый} Константы шаблона штриховки EmptyFill = 0;   SolidFill = 1;   LineFill = 2;   LtSlashFill = 3;   SlashFill = 4;   BkSlashFill = 5;   LtBkSlashFill = 6;   HatchFill = 7;   XHatchFill = 8;   InterleaveFill = 9;   WideDotFill = 10;   CloseDotFill = 11;   UserFill = 12.  {Заполнение цветом фона}   {Сплошная штриховка}   {Горизонтальная штриховка}   {/// штриховка}   {/// штриховка толстыми линиями}   {\\ штриховка толстыми линиями}   {\\ штриховка}   {Заполнение прямой клеткой}   {Заполнение косой клеткой}   {Заполнение частой сеткой}   {Заполнение редкими точками}   {Заполнение частыми точками}   {Тип задается пользователем}