Министерство образования и науки Российской Федерации Федеральное государственное автономное образовательное учреждение высшего образования «Российский государственный профессионально-педагогический университет» Кафедра информационных систем и технологий Отчёт Дисциплина: Алгоритмические языки и системы программирования Работу выполнил Студент: Калошин Александр Игоревич группа ЗИТм-103 Проверил: Екатеринбург 2020 ЛАБОРАТОРНАЯ РАБОТА № 1 БАЗОВЫЕ ВОЗМОЖНОСТИ ЯЗЫКА ПРОГРАММИРОВАНИЯ PROCESSING Самостоятельная работа Написать программу, которая выводит в консоль олимпийские кольца. Цвет колец, фон экрана, размер и др. параметры выбираются самостоятельно. Код: void setup() { size(640, 360); } Результат: void draw() { background(255); noFill(); strokeWeight(10); stroke(0,128,255); circle(225-20,150,100); stroke(205,164,52); circle(275-10,200,100); stroke(0,0,0); circle(325,150,100); stroke(0,128,0); circle(375+10,200,100); stroke(255,0,0); circle(425+20,150,100); } 2 ЛАБОРАТОРНАЯ РАБОТА № 2 ОСНОВНЫЕ ГЕОМЕТРИЧЕСКИЕ ФУНКЦИИ Задание 1. Измените код (Листинг 1), нарисовав отрезок из точки с координатами 50, 50 в точку с координатами 250, 250. Подсказка: изменить требуется только 11-ю строку. Код: void setup() { size(300,300); background(0); smooth(); noLoop(); } Результат: void draw() { strokeWeight(30); stroke(100); line(50,50, 250, 250); } Задание 2. Измените код (Листинг 1), нарисовав второй отрезок, чтобы получилась картина как на Рисунке 3. Подсказка: требуется добавить одну строку кода после текущей 11-й строки. Код: void setup() { size(300,300); background(0); smooth(); noLoop(); } Результат: void draw() { strokeWeight(30); stroke(100); line(50,50, 250, 250); line(50,250, 250, 50); } 3 Задание 3. В 3-й строке кода Листинга 1 необходимо поменять значение аргумента метода background() на 150, запустить скетч, затем поменять значение на 255 и снова запустить скетч. Вы должны увидеть, как меняется цвет фона вашего холста. Код: void setup() { size(300,300); background(150); smooth(); noLoop(); } Результат: void draw() { strokeWeight(30); stroke(100); line(50,50, 250, 250); line(50,250, 250, 50); } void setup() { size(300,300); background(250); smooth(); noLoop(); } void draw() { strokeWeight(30); stroke(100); line(50,50, 250, 250); line(50,250, 250, 50); } Задание 5. Измените значение переменной ellipseSize в 3-йстроке кода Листинга 4 на 200. Вы должны увидеть, как круги увеличатся в размерах, сохранив пропорциональную картину. Далее программно измените размер окна приложения. Код: Результат: 4 int windowWidth = 500; int windowHeight = 500; int ellipseSize = 200; void setup() { size(500 , 500); // при использование windowWidth и windowHeight констант выдает ошибку smooth(); background(255); fill(50, 80); stroke(100); strokeWeight(3); noLoop(); } void draw() { ellipse(windowWidth/2, windowHeight/2 ellipseSize/2, ellipseSize , ellipseSize); ellipse(windowWidth/2 - ellipseSize/2, windowHeight/2, ellipseSize , ellipseSize); ellipse(windowWidth/2 + ellipseSize/2, windowHeight/2, ellipseSize , ellipseSize); ellipse(windowWidth/2, windowHeight/2 + ellipseSize/2, ellipseSize , ellipseSize); } Задание 6. Измените код Листинга 6 таким образом, что бы в результате его выполнения получилось изображение как на Рисунке 8. Код: void setup() { size(500, 500); noLoop(); } Результат: void draw() { smooth(); background(100); stroke(255); strokeWeight(10); point(200, 200); strokeWeight(30); point(300, 200); strokeWeight(50); point(200, 300); strokeWeight(80); point(300, 300); stroke(0); 5 strokeWeight(3); point(200, 200); point(300, 200); point(200, 300); point(300, 300); } Самостоятельная работа Программируем геометрические фигуры, персонаж (человек, приведение, снеговик, космический корабль, машину или свой вариант) Код: void setup() { size(500, 500); } Результат: void draw() { background(255); noFill(); strokeWeight(10); stroke(0,0,0); point(180, 100); point(220, 100); line(190,125, 210, 125); circle(200,110,75); ellipse(200, 215, 95, 125); line(240,180, 310, 150); line(160,180, 110, 130); line(225,270, 230, 350); line(175,270, 170, 350); } ЛАБОРАТОРНАЯ РАБОТА № 3 Задание для самостоятельной работы (представить в отчете). Измените код Листинга 12 таким образом, чтобы отрисовывались не отрезки, а окружности. Прозрачность при этом должна увеличиваться книзу. Код: Результат: 6 void setup() { size(500, 500); smooth(); noLoop(); } void draw() { background(50); noStroke(); fill(94, 206, 40, 250); circle(200, 100, 150); fill(94, 206, 40, 150); circle(200, 200, 150); fill(94, 206, 40, 100); circle(200, 300, 150); fill(94, 206, 40, 50); circle(200, 400, 150); } Задание 2. Измените код Листинга 13 так, чтобы отрисовывалось три линии. Третью линию, параллельную первым двум, необходимо расположить со сдвигом вправо на 50 пикселей, как на Рисунке 16. Код: void setup() { size(500, 500); smooth(); background(255); strokeWeight(30); noLoop(); } Результат: void draw() { stroke(20); line(50, 200, 150, 300); line(100, 200, 200, 300); line(150, 200, 250, 300); } Задание 4. Измените код строки 12 Листинга 18 следующим образом: stroke(20, 100), что бы на холсте было отрисовано 7 крестов, как на Рисунке 19. Код: Результат: 7 int i; void setup() { size(500, 500); smooth(); background(255); strokeWeight(30); noLoop(); } void draw() { stroke(20, 100); for(int i=1; i<8; i++) { line(50*i, 200, 150 + (i-1)*50, 300); line(50*i + 100, 200, 50 + (i-1)*50, 300); } } Задание 5. Измените 13-ю строку кода в Листинге 18: вместо i = i +1 напишите i = i +2, чтобы получить изображение, как на Рисунке 20. Код: int i; void setup() { size(500, 500); smooth(); background(255); strokeWeight(30); noLoop(); } Результат: void draw() { stroke(20, 100); for(int i=1; i<8; i+=2) { line(50*i, 200, 150 + (i-1)*50, 300); line(50*i + 100, 200, 50 + (i-1)*50, 300); } } Задание 6. Напишите в строку между 12-й и 13-й строками Листинга 19 следующий вызов метода: stroke(160–20 * i);, чтобы на холсте было отрисовано изображение, как на Рисунке 22. Код: Результат: 8 int i; void setup() { size(500, 500); smooth(); background(255); strokeWeight(30); noLoop(); } void draw() { stroke(20, 100); for(int i=1; i<8; i+=1) { stroke(20*i); line(50*i, 200, 150 + (i-1)*50, 300); stroke(160 - 20 * i); line(50*i + 100, 200, 50 + (i-1)*50, 300); } } Задание 7 (самостоятельное). Напишите недостающие 12-ю и 14-ю строки кода Листинга 20, чтобы на холсте было отрисовано изображение, как на Рисунке 24. Код: void setup() { size(500, 500); smooth(); background(255); strokeWeight(30); noLoop(); stroke(0,50); } Результат: void draw() { for ( int i=1;i<8;i=i+1) { for ( int k=1;k<4;k=k+1) { stroke(20*i); line(i*50, 100*k, 150 + (i-1)*50, 100 + 100*k); stroke(160 - 20 * i); line(i*50 + 100, 100*k, 50 + (i-1)*50, 100 + 100*k); } } } 9 Задание 8 (самостоятельное). Измените код Листинга 22, так, чтобы прямоугольники отрисовывались на холсте в виде сетки, как на Рисунке 26 Код: void setup() { size(500, 500); smooth(); background(255); noStroke(); noLoop(); } Результат: void draw() { for (int i=0;i<10;i++) { for (int k=0;k<5;k++) { fill(i*20); rect(i*40+50, k * 80 + 50, 35, 35); rect(410-i*40, k * 80 + 90, 35, 35); } } } ЛАБОРАТОРНАЯ РАБОТА № 4 Движение и анимация Задание 1 для самостоятельной работы. Измените 10-ю и 11-ю строки кода Листинга 26 так, чтобы на холсте было отрисовано изображение, как на Рисунке 30. Крестик должен двигаться по диагонали от левого верхнего угла в правый нижний угол. Код: void setup () { size(300, 300); smooth(); strokeWeight(30); background(0); } Результат: void draw () { stroke(frameCount); line(0+frameCount,0+frameCount , 100+frameCount,100+frameCount); line(0+frameCount,100+frameCount , 100+frameCount,0+frameCount); } 10 Задание 2 для самостоятельной работы. Текст программы представить в отчете. Справа прокомментировать каждую строку. Код: void setup() { size(500, 500); smooth(); } float counter; void draw() { noStroke(); fill(10, 50); rect(-1,-1,width+1,height+1); float ny = sin(counter)*100+200; float nx = counter*10; stroke(250); strokeWeight(20); line(nx, ny, nx, ny); counter = counter + 0.1; if(nx > width) { counter = 0; } } // Комментарий: Функция setup() определяет первоначальные. Настройки окна такие как размер, цвет и тд, задается в один раз в начале программы Создает окно размером 500x500. Рисует всю геометрию с гладкими (сглаженными) краями. Инициирует переменную counter. Функция draw() непрерывно выполняет строки кода, содержащиеся в ее блоке, пока программа не остановится или не будет вызвана noLoop (). Отключает рисование контура. Задает цвет объекта. Создает прямоугольник. Задает значение переменной ny. Задает значение переменной nx. Задает цвет, используемый для рисования линий и границ вокруг фигур. Задает цвет, используемый для рисования линий и границ вокруг фигур. Создает линию. Увеличиваем переменную counter на 0.1. Задает условие если nx>width. Присваивает значение counter равное 0. Задание 3 для самостоятельной работы. Измените код Листинга 27 так, чтобы прямоугольник отрисовывался на холсте не во всю ширину, а только на половину ширины холста, как на Рисунке 32. Тогда вы увидите шлейф на левой части холста, а на правой будет оставаться полный след от движения объекта. Код: Результат: 11 void setup() { size(500, 500); smooth(); } float counter; void draw() { noStroke(); fill(10, 50); rect(-1,-1,width/2+1,height+1); float ny = sin(counter)*100+200; float nx = counter*10; stroke(250); strokeWeight(20); line(nx, ny, nx, ny); counter = counter + 0.1; if(nx > width) { counter = 0; } } Самостоятельная работа Рисунок пейзаж «Ночь-день» - переключение по кнопкам (прямоугольник). Код: Button day_button;// кнопка для переключения Результат: 12 boolean day = false; void setup() { size (500, 500); smooth(); background(255); // создание начальной кнопки background(255); day_button = new Button ("Начать", 30, 450, 100, 25); } void draw() { day_button.Draw(); } // измененеие при нажатие кнопки мыши void mousePressed() { if (day) { if (day_button.MouseIsOver()) { day = false; // вывод в консоль println("Наступила ночь"); // рисуем кнопку day_button = new Button ("Ночь", 30, 450, 100, 25); // рисуем пейзаж Night(); } } else { if (day_button.MouseIsOver()) { day = true; // вывод в консоль println("Наступил день"); // рисуем кнопку day_button = new Button ("День", 30, 450, 100, 25); // рисуем пейзаж Day(); } } } void Day() { 13 background(#81D4F4); noStroke(); fill(#62d44d); rect(0, 350, 500, 150); fill(153,153,255); triangle(70, 150, 350, 350, -100, 350); fill(51,51,255); triangle(220, 170, 450, 350, 50, 350); fill(0,0,255); triangle(370, 170, 550, 350, 150, 350); fill(255,179,0); circle(60, 60, 80); } void Night() { background(#01579B); noStroke(); fill(#24a319); rect(0, 350, 500, 150); fill(0,0,102); triangle(70, 150, 350, 350, -100, 350); fill(0,0,204); triangle(220, 170, 450, 350, 50, 350); fill(0,0,255); triangle(370, 170, 550, 350, 150, 350); fill(#bdd0e4); circle(450, 50, 50); } ///////////////////////////////////////////////////////////////////////////// // класс кнопки class Button { String label; // Имя кнопки float x; // верхний левый угол х позиция float y; // верхний левый угол у позиции float w; // ширина кнопки float h; // высота кнопки // конструктор кнопки Button(String labelB, float xpos, float ypos, float widthB, float heightB) { label = labelB; x = xpos; y = ypos; w = widthB; h = heightB; } // рисование кнопки 14 void Draw() { fill(218); stroke(141); rect(x, y, w, h, 10); textAlign(CENTER, CENTER); fill(0); text(label, x + (w / 2), y + (h / 2)); } // определение кнопки в пространстве boolean MouseIsOver() { if (mouseX > x && mouseX < (x + w) && mouseY > y && mouseY < (y + h)) { return true; } return false; } } 15