Работа с графикой

С этим уроком также смотрят

Данный курс, расскажет вам о Microsoft Small Basic, - современной среде разработки, ориентированной на начинающих. Microsoft Small Basic, несмотря на то, что он "маленький", вполне приличная и, что важно, доступная для начинающих среда разработки.

Данный видеокурс расскажет не только как скачать, установить и освоить интерфейс, но и, что наиболее важно начинающим, расскажет о языке программирования Basic, и поможет создать первые приложения, например эмулятор смеси записной книжки и телефона - "Звонилка".



Microsoft®, Windows® and Visual Basic®® are registred trademarks of the Microsoft® group of companies.

Обновлен: 16 апреля 2012

Small Basic,
Разработка ПО

Loading the player...
Текст урока
Графика и рисование в Small Basic
 

Итак, основные навыки для написания эмулятора телефона мы получили, самое время вернуться к нашей давно нарисованной оболочке. Давайте посмотрим, как работать с графическими элементами в Small basic.

Программа Small Basic формирует графику на поверхности графического окна (Graphics Window). Для того чтобы графическое окно появилось на экране и внутри него был нарисован, например, прямоугольник, в программу надо поместить инструкцию вызова метода, рисующего прямоугольник. Так в результате выполнения инструкции

GraphicsWindow.DrawRectangle(10,10,50,30)

будет нарисован прямоугольник шириной в 50 и высотой в 30 пикселей, левый верхний угол которого будет находиться в точке с координатами (10, 10).

Операторы рисования графических примитивов внутри графического окна, рассматривают его поверхность как холст, состоящий из отдельных точек — пикселов. Положение пиксела характеризуется его горизонтальной (x) и вертикальной (y) координатами. Координаты отсчитываются от левого верхнего угла и возрастают слева направо (x) и сверху вниз (y). Точка, находящаяся в левом верхнем углу поверхности, имеет координаты (0, 0).

Свойства графического окна GraphicsWindow определяют вид графических примитивов, рисуемых на графической поверхности соответствующими методами. Так, например, свойство PenColor (Цвет пера) задает цвет линий и границ фигур, а свойство BrushColor (Цвет кисти) — цвет закраски областей.

СвойствоОписание
PenColorЗадает цвет линий и границ геометрических фигур

PenWidthЗадает толщину линий и границ геометрических фигур, рисуемых пером

BrushColorЗадает цвет закраски внутренних областей геометрических фигур

FontNameЗадает шрифт, используемый для вывода текста на графическую поверхность

FontSizeЗадает размер шрифта, используемого для вывода текста на графическую поверхность

FontItalicУстанавливает, что шрифт, используемый для вывода текста на графическую поверхность, должен быть курсивный (italic)

FontBoldУстанавливает, что шрифт, используемый для вывода текста на графическую поверхность, должен быть полужирным (bold)

WidthШирина окна

HeightВысота окна

CanResizeУстанавливает вид границы окна. Если свойству присвоить значение False, то граница станет тонкой, поэтому у пользователя не будет возможности изменить размер окна

Цвет линий и областей задается путем изменения соответственно значений свойств PenWidth и PenColor. В качестве значения свойства, определяющего цвет, следует использовать название цвета, например, "Red", "DarkRed", "Green", "YellowGreen", "Gold", "SkyBlue". Всего в Small Basic определены 142 цвета.

КонстантаЦвет
"Red"Красный
"DarkRed"Темно-красный
"Pink"Розовый
"LightPink"Светло-розовый
"DeepPink"Темно-розовый
"Orange"Оранжевый
"DarkOrange"Темно-оранжевый
"OrangeRed"Оранжево-красный
"Yellow"Желтый
"LightYellow"Светло-желтый
"Gold"Золотой
"Fuchsia"Фуксия
"Magenta"Маджента
"DarkViolet"Темно-фиолетовый
"Purple"Фиолетовый
"GreenYellow"Зелено-желтый
"Lime"Лайм
"SpringGreen"Весенняя зелень
"SeaGreen"Морская зелень
"ForestGreen"Зеленый лес
"DarkGreen"Темно-зеленый
"YellowGreen"Желто-зеленый
"Olive"Оливковый
"Aqua"Морская волна
"SteelBlue"Синяя сталь
"SkyBlue"Небесно-синий
"Blue"Синий
"DarkBlue"Темно-синий
"Chocolate"Шоколадный
"Brown"Коричневый
"White"Белый
"Snow"Снег
"LightGray"Светло-серый
"Silver"Серебро
"Gray"Серый
"Black"Черный

Так как фон для нашего «телефона» является графическим файлом, давайте рассмотрим, как отобразить его в графическом окне.

Отображение иллюстрации в графическом окне обеспечивают методы DrawImage и DrawResizedImage. Они позволяют вывести в графическое окно иллюстрацию формата JPG, GIF, PNG, BMP, ICO. Различие методов состоит в том, что DrawImage выводит иллюстрацию "как есть", а DrawResizedImage позволяет выполнить ее масштабирование.

Инструкция вызова метода DrawImage в общем случае выглядит так:

GraphicsWindow.DrawImage(img, x, y)

Параметр img, в качестве которого обычно указывается полное имя файла, задает иллюстрацию, параметры x и y — координаты правого верхнего угла области отображения.

Давайте отобразим наш интерфейс в графическом окне. Для этого в свойствах файла посмотрим ширину и длину картинки в пикселях.

”Листинг

В результате у нас получится следующее:

Инструкциями GraphicWindow.Left и Top мы задаем положение графического окна относительно правого верхнего угла экрана. Свойства Width и Height регулируют ширину и высоту этого окна соответственно. Filename – это переменная, в которой находится адрес картинки, загружаемой в графическое окно.

Комментарии (0)

Оглавление
1. Введение 1:10 0 6165
2. Скачивание и установка дистрибутива 1:01 0 4188
3. Интерфейс 2:05 0 3031
4. Всплывающие подсказки 0:33 0 2368
5. Первая программа 4:08 0 7830
6. Отладка программы 0:52 0 2566
7. Создание алгоритма. Блок-схемы 4:48 0 7967
8. Алгоритмические структуры 2:25 0 3244
9. Интерфейс программы 0:46 0 2032
10. Типы данных, операторы, выражения 2:54 0 2074
11. Функции 1:57 0 1869
12. Работа с консолью 6:32 1 2009
13. Операторы условия, логики 1:17 2 1714
14. Циклы 2:30 0 2226
15. Программа «Записная книжка» - практическая работа с... 1:26 0 2654
16. Работа с графикой 2:46 0 3484
17. Программы «Калькулятор» и «Звонилка» 5:36 0 4180
18. Использование подпрограмм 3:09 0 2035
19. Работа с файлами 1:44 0 2472
Яндекс цитирования
Нажмите нравится, чтобы читать "TeachVideo.ru" в facebook