Small Basic #3 Shapes

Зачем нужны шейпы

В отличии от GraphicsWindow, где фигуры рисуются на холсте (аналог сцены в Scratch), к объектам Shapes можно обращаться, их можно перемещать и удалять (аналог спрайтов в Scratch).

Try it out!

Рассмотрим задачу: расположить эллипс точно посреди окна.
1. Для начала создадим объект hero в виде синего эллипса шириной и высотой в 50 пикселей:
GraphicsWindow.BackgroundColor = "White"
GraphicsWindow.Width = 800
GraphicsWindow.Height = 640
GraphicsWindow.Title = "Small Basic Rocks!"

GraphicsWindow.BrushColor = "Blue"
GraphicsWindow.PenColor = "Blue"
hero = Shapes.AddEllipse(50,50)

2. Переместим этот объект в точку середины окна:
GraphicsWindow.BackgroundColor = "White"
GraphicsWindow.Width = 800
GraphicsWindow.Height = 640
GraphicsWindow.Title = "Small Basic Rocks!"

GraphicsWindow.BrushColor = "Blue"

GraphicsWindow.PenColor = "Blue"
hero = Shapes.AddEllipse(50,50)

Shapes.Move(hero,800/2,640/2)
Но представим, что ширина или высота окна изменится. Тогда нам придётся вручную искать эти цифры в коде и изменять на новые значения. В помощь придут переменные:
grWidth = 800
grHeight = 640

GraphicsWindow.BackgroundColor = "White"

GraphicsWindow.Width = grWidth
GraphicsWindow.Height = grHeight
GraphicsWindow.Title = "Small Basic Rocks!"

GraphicsWindow.BrushColor = "Blue"

GraphicsWindow.PenColor = "Blue"
hero = Shapes.AddEllipse(50,50)

Shapes.Move(hero,grWidth/2,grHeight/2)


3. Обратите внимание, что эллипс находится не ровно в центре окна – он начинает отрисовываться от левого верхнего угла прямоугольника, в который он вписан:

Для переноса его в центр окна, необходимо сдвинуть его влево и вверх на половину его диаметра:
Отобразим это в коде:
grWidth = 800
grHeight = 640

GraphicsWindow.BackgroundColor = "White"

GraphicsWindow.Width = grWidth
GraphicsWindow.Height = grHeight
GraphicsWindow.Title = "Small Basic Rocks!"

GraphicsWindow.BrushColor = "Blue"

GraphicsWindow.PenColor = "Blue"
hero = Shapes.AddEllipse(50,50)

Shapes.Move(hero,grWidth/2-50/2,grHeight/2-50/2)

Попробуйте изменить ширину и высоту окна и посмотрите, что наш код работает для разных значений.

В конспект

Добавление фигур

shape1 = Shapes.AddEllipse(elWidth, elHeight)
shape2 = Shapes.AddRectangle(rectWidth, rectHeight)

Передвижение

Shapes.Move(shapeName,x,y)

Вращение на угол (angle)

Shapes.Rotate(shapeName,angle)

Масштабирование

Shapes.Zoom(shapeName,scaleX,scaleY)

Плавное передвижение

Shapes.Animate(shapeName, x, y, duration)

Задачи

Задача 3.1*. Дополните приведённый выше код чтобы можно было вначале программы задавать диаметр эллипса (наряду с шириной и высотой графического окна).

Задача 3.2**. Используя Shapes, создайте игровую локацию, на которой расположены:
3 парты (desk1, desk2, desk3)
3 противника (enemy1, enemy2, enemy3)
игрока (player)
Ширина клетки на изображении равна 50 пикселям (сетку рисовать не нужно)


Задача 3.3**. Создайте изображение кота, используя эллипсы, треугольники и линию. Используя метод Shapes.Animate(), сделайте анимацию движения зрачков котика (пример на видео):


Задача 3.4**. Создайте программу, в которой надпись бесконечно генерируется:
в случайном месте
имея случайный размер (Shape.Zoom() или GraphicsWindow.FontSize)
случайного цвета
повёрнутого на случайный угол (Shape.Rotate())

Дополнительные задачи

Доп. задача 3.1*. Создайте шейп прямоугольника, который бесконечно прячется и появляется в случайном месте с интервалом в 100 мс

Доп. задача 3.2**. Создайте квадратное графическое окно, заполните его по диагонали чёрными квадратами заданной ширины.


Доп. задача 3.3**. Создайте квадратное графическое окно, заполните обе его диагонали квадратами случайного цвета и заданной ширины.

Доп. задача 3.4**.Создайте квадратное графическое окно, заполните его одну диагональ квадратами случайного цвета и случайной длины и ширины.



Комментарии