Графика и анимация в Паскаль АВС
план-конспект урока
Данная разработка предназначена для учащихся 7-9 классов, изучающих программирование на языке Паскаль.Уроки позволят освоить элементы графики и анимации в ПаскальАВС. Процесс создания графики вызывает у учащихся особый интерес. Подобные уроки формируют у учащихся пространственное воображение, умение работать с координатной плоскостью, развиваются навыки программирования, а также способствуют развитию воображения и логического мышления, формированию чувства композиции и художественно-графических умений, навыков конструирования и проектирования, приобщению к творческому процессу и развитию терпения и трудолюбия.
Скачать:
Вложение | Размер |
---|---|
Графика_Точка_Линия_Ломанная линия | 1.4 МБ |
Графика_Прямоугольник_Треугольник | 428.26 КБ |
Анимация | 171.46 КБ |
Предварительный просмотр:
Предварительный просмотр:
Урок 2. Рисование фигур. Окраска фигур.
Цель: закрепление и систематизация знаний и умений учащихся при работе с графикой в Паскаль АВС.
Задачи урока:
обучающие - повторить и систематизировать навыки работы по теме «Графика в среде Паскаль», стимулировать интерес учащихся к созданию нестандартных заданий; формирование чувства композиции и художественно-графических умений, навыков конструирования и проектирования;
развивающие - развитие приемов умственной деятельности, формирование и развитие функционального мышления учащихся, развитие познавательных потребностей учащихся, создание условий для приобретения опыта работы учащихся в среде ИКТ;
воспитательные - развитие познавательного интереса учащихся, основ коммуникативного общения, уверенности в собственных силах.
Тип урока: закрепления знаний.
Формы работы: фронтальная, индивидуальная.
Методы работы: частично-поисковый, репродуктивный.
Оборудование урока: ПК, мультимедийный проектор
Требования к результатам усвоения учебного материала.
Ученики должны знать:- язык программирования PascalАВС
- особенности работы в графическом режиме GraphАВС;
- стандартные процедуры и функции модуля GraphАВС;
- графические операторы языка программирования
Ученики должны уметь:
- строить элементарные изображения;
- работать в графическом режиме;
- правильно применять стандартные процедуры и функции модуля GraphАВС;
- применять базовые алгоритмические структуры при программировании
решения задач;
-производить необходимые действия с программой;
Прямоугольник в Паскале рисуется:
Rectangle(x1,y1,x2,y2) — рисует прямоугольник, заданный координатами противоположных вершин (x1,y1) и (x2,y2).
Фигуры с заливкой:
Треугольник рисуется процедурами:
Line(x1,y1,x2,y2);
LineTo(x,y);
Окружность можно нарисовать с помощью процедуры:
Circle(x,y,r) — рисует окружность с центром в точке (x,y) и радиусом r.
Дуга окружности
Arc(x,y,r,a1,a2) — Рисует дугу окружности с центром в точке (x,y) и радиусом r, заключенной между двумя лучами, образующими углы a1 и a2 с осью OX (a1 и a2 – вещественные, задаются в градусах и отсчитываются против часовой стрелки).
Задание1: «Лягушка» | Задание2: «Корона» |
ФУНКЦИЯ RANDOM ДЛЯ ИСПОЛЬЗОВАНИЯ ОКРАСКИ
SetPenColor(rgb(random(256), random(256), random(256))); — выбирает случайное число из 256-цветной палитры для красного, зеленого и синего.
Задание 3: Нарисовать горизонтальный ряд окружностей радиусом 10 на расстоянии 100 от верхнего края экрана и с такими горизонтальными координатами 50, 80, 110, 140, … , 290. * раскрасить круги случайным цветом | Задание 4: «Круги на воде». |
Задание 5: |
Практическая работа
Пример графической программы, рисующей изображение дома:
Program Domik; uses Graphabc; //подключение модуля GraphABC begin SetWindowWidth(800); //ширина окна программы SetWindowHeight(600); //высота окна программы SetPenWidth(3); //толщина пера SetFontSize(18); //размер шрифта SetFontColor(clRed); //цвет шрифта SetFontStyle(fsBold); //жирный стиль шрифта TextOut(100,100,'Домик'); //текст Rectangle(200, 300, 600,600); //дом Circle(400,225, 40); //круг SetBrushColor(clAqua); //цвет заливки окна FillRect(300, 400,500,500); //процедура заливки окна rectangle(300,400,500,500); //окно Line(400,400,400,500); // окно Line(300,450,500,450); //окно Line(200,300,400,150); //крыша Line(400,150,600,300); //крыша Line(480,210,480,160); //труба Line(480,160,520,160); //труба Line(520,160,520,240); //труба end. |
Рисунок в PascalABC
Программа, рисующая фигурку:
Program Figurka; uses GraphABC; begin SetWindowSize(500, 500); //задаем размер графического окна SetPenWidth(3); //устанавливаем стиль пера SetBrushColor(clFuchsia); //устанавливаем цвет кисти Circle(225,160,50); //рисуем окружность Line(225,160,225,180); //рисуем линии Line( 210,190,240,190); Line( 225,210,225,250); Line( 100,100,200,260); Line( 200,260,400,260); Line( 210,350,200,480); Line(240,350,250,480); Rectangle(200,230,250,350); //рисуем прямоугольник SetBrushColor(clLime); FillRect(0, 480,500,500); //рисуем закрашенный прямоугольник SetBrushColor(clWhite); Circle(205,150,10); Circle(245,150,10); end. | ||
Задание 1. Определите координаты и составьте программу, выводящую на экран рисунок дома и дерева. |
Задание 2. Используя оператор цикла и введя переменную для пересчета координат по оси x, постройте «поселок», состоящий из 5 домов. Внесите соответствующие дополнения и изменения в предыдущую программу.
Весь наш «поселок» выстроился вдоль горизонтальной оси экрана — оси X. Построение рисунка начинается с левого верхнего угла стены первого дома — точки с координатами (100, 50). Координата Y не изменяется. Чтобы начать рисовать второй домик, нужно координату X увеличить на 150 (50 точек — ширина первого дома и 100 точек — расстояние между домиками).
Выберем в качестве параметра цикла целочисленную переменную X.
Для всех элементов нашего рисунка абсолютное значение координаты X заменим на относительное. Например, для стены дома процедура для рисования запишется следующим образом:
FillRect(x,50,x+50,100);
Сформулируем условие выполнения циклических действий для нашей задачи.
Какие координаты имеет левый верхний угол пятого дома? Конечное значение выбранного нами параметра цикла x = 700. Тогда условие выполнения цикла записывается так: x<=700.
Словесное описание алгоритма коротко можно записать так:
Переменной цикла x присвоить начальное значение 100. Пока x<=700 выполнять серию действий «Нарисуй дом и дерево», после каждого фрагмента рисунка увеличивать значение переменной цикла на 150.
Самостоятельно составить программу.
Предварительный просмотр:
Урок 3. Анимация в Паскале
Цель: Изучить построение анимации в Паскаль
Образовательные задачи: Познакомить с понятием «Анимация»,
Закрепить знания детей об алгоритме построения анимации.
Учащиеся должны:
- Понимать: Структуру построения программного кода.
- Знать: Порядок и алгоритм анимированния объекта.
- Уметь: Анимировать графические объекты.
- Исследовать: Возможность сокращения длины алгоритма.
Задачи воспитания : Воспитать трудолюбие, самостоятельность, культуру речи, и общения.
Задачи развития: Развивать мышление, память, речь и другие психические процессы.
Тип урока: Формирование новых знаний и их закрепление.
Оборудование: Компьютеры, интерактивная доска, проектор, презентация.
Методы обучения: Иллюстративно-обьяснительный
Оборудование урока: ПК, мультимедийный проектор,язык программирования Паскаль АВС.
Как на языке программирования Паскаль АВС создать простейшую анимацию - иллюзию движения?
Анимация в программировании заключается в том, что сначала рисуется фигура цветным инструментом, затем с тем же координатами рисуется та же фигура белым цветом. После чего происходит сдвиг фигуры и действия повторяются.
В этом уроке будет показано, как можно создать анимированное изображение с помощью модуля GraphABC.
Пример: Воспроизвести движение круга по горизонтали.
1 2 3 4 5 6 7 8 9 10 11 12 | uses GraphABC; var x:integer; begin x:=40; repeat SetPenColor(clWhite); Circle(x,100,10); {Рисуем белую окружность} SetPenColor(clBlack); Circle(x,100,10); {Рисуем черную окружность} x:=x+1 {Перемещаемся немного направо} until x>600; end. |
Теперь рассмотрим пример: создать движение нескольких (примитивных) фигур по заданной траектории.
Без чего мы обойтись не сможем, не сможем мы обойтись без нескольких инструментов:
Процедура LockDrawing;
Рисование средствами PascalABC происходит очень медленно. Пока оно идет, картинка на экране успевает много раз обновиться. Отсюда мерцание. То есть, мы видим не окончательную картинку, а процесс ее рисования. Окончательную картинку в общем-то не видим — как только она построилась, мы ее тут же стираем и начинаем новый цикл рисования. Для борьбы с этим эффектом придумали двойную буферизацию. Идея в том, чтобы сначала построить картинку в памяти (не выводя на экран), а затем отобразить новый кадр на экране целиком, без промежуточных вариантов, где не хватает половины лучиков. Для этого в начале программы вызываем процедуру LockDrawing.
Процедура ClearWindow (color);
После каждой прохода по циклу очищает графическое окно указанным цветом, который передается в качестве параметра.
После этого все команды рисования будут создавать картинку в памяти (в так называемом вторичном буфере). Непосредственно на экране ничего рисоваться не будет. После того, как очередной кадр анимации полностью отрисован (то есть перед ClearWindow), нужно вызвать процедуру Redraw;
Эта процедура вызовет перерисовку всей картины.
Нарисуем сначала четыре окружности.
program animation; uses GraphABC; begin SetWindowSize(400, 400); //Размер окна //Отрисовка четырех окружностей. Circle (100, 100, 20); Circle (300, 100, 20); Circle (100, 300, 20); Circle (300, 300, 20); end. | Получим результат: |
Второй стадией, будет отрисовка пятой окружности и с помощью вышеуказанных процедур и цикла заставим его двигаться по заданной траектории.
program animation; uses GraphABC; var i : integer; begin SetWindowSize(400,400); LockDrawing; //Движение от первой точки до второй for i:=100 to 300 do begin SetBrushColor(clWhite); Circle (100, 100, 20); Circle (300, 100, 20); Circle (100, 300, 20); Circle (300, 300, 20); SetBrushColor(clBlack); Circle (i, 100, 20); RedRaw; ClearWindow(clWhite); end; //Движение от второй точки до третьей for i:=100 to 300 do begin SetBrushColor(clWhite); Circle (100, 100, 20); Circle (300, 100, 20); Circle (100, 300, 20); Circle (300, 300, 20); SetBrushColor(clBlue); Circle (300, i, 20); RedRaw; ClearWindow(clWhite); end; | //Движение от третьей точки до четвертой for i:=300 downto 100 do begin SetBrushColor(clWhite); Circle (100, 100, 20); Circle (300, 100, 20); Circle (100, 300, 20); Circle (300, 300, 20); SetBrushColor(clRed); Circle (i, 300, 20); RedRaw; ClearWindow(clWhite); end; //Движение от четвертой точки до первой for i:=300 downto 100 do begin SetBrushColor(clWhite); Circle (100, 100, 20); Circle (300, 100, 20); Circle (100, 300, 20); Circle (300, 300, 20); SetBrushColor(clGreen); Circle (100, i, 20); RedRaw; ClearWindow(clWhite); end; end. |
Практическая работа
Задание 6: Выполнить анимацию движения квадрата по следующей траектории: | |
Задача №7 Создать проезжающий грузовик |
По теме: методические разработки, презентации и конспекты
Презентация "Эффекты анимации"
Презентацию можно использовать для демонстрации эффектов анимации, используемых в MS Power Point....
Эффекты анимации
Описывает технологию создания анимации в программе Macromedia Flash...
Основы языка программирования .Паскаль
Разработка урока предусматривающая работу в Паскале...
Введение в Паскаль
Материал предназначен для студентов 1 курса....
План урока по учебному предмету «Основы анимации» ИСПОЛЬЗОВАНИЕ ТЕХНОЛОГИИ БЕСПРОВОДНОЙ СВЯЗИ НА УРОКАХ АНИМАЦИИ
С появлением новых технологий и открытий в науке занятия анимацией перестают быть уделом только избранных. Появляются новые анимационные программы, позволяющие создавать фильмы при помощи смартфонов, ...
Графика и анимация в Паскаль АВС
Данная разработка предназначена для учащихся 7-9 классов, изучающих программирование на языке Паскаль.Уроки позволят освоить элементы графики и анимации в ПаскальАВС. Процесс создания графики вызывает...
Памятка Треугольник Паскаля
Материал для проведения расчетов по математике на тему Треугольник Паскаля...