Высокоуровневые методы информатики и программирования Лекция 2 4 Рисование в форме

1. Высокоуровневые методы информатики и программированияЛекция 24Рисование в форме

2. План работы • Класс Graphics • Инструменты рисования • Перо • Кисть • Шрифт • Рисование фигур • Работа с изображениями

3. Рисование в окне

4. Дисплей • Устройство для отображения световых точек на поверхности экрана • Поверхность экрана содержит одну прямоугольную матрицу элементарных точек – пикселей. • Размер каждого пикселя зависит от режима работы дисплея. • Каждая точка описывается набором данных 1-4 байта A 19" LG flat-panel LCD monitor.

5. Пиксель (pixel) • Минимальный элемент изображения на дисплее (от слов picture и element). • Пиксели упорядочены в двухмерную таблицу и имеют координаты X (номер столбца)и Y (номер строки). • С каждым пикселем связан набор данных 1- 24 бит, которые задают цвет точки (bits per pixel, bpp) • 1 bpp, 21 = 2 цвета (монохромный) • 2 bpp, 22 = 4 цвета • 3 bpp, 23 = 8 цветов • ... • 8 bpp, 28 = 256 цветов • 16 bpp, 216 = 65,536 цветов ("Highcolor" ) • 24 bpp, 224 ≈ 16.8 млн. цветов ("Truecolor") • Пиксель имеет физические размеры. Обычно пиксели измеряются в • dots per inch (dpi) или • pixels per inch (ppi) (для дисплея это одно и тоже).

6. Система координат (по умолчанию)

8. Selected standard display resolutions include: Разрешение дисплея • Разрешение дисплея это количество различных пикселей по каждому измерению, которые могут отображаться. • Дисплей может работать в различных режимах с разными разрешениями. • К стандартным разрешениям дисплея относятся:

9. Структура окна Windows button системные кнопки вызов системного меню строка заголовка Мое первое окно title bar X строка меню Файл Справка menu bar X (0,0) (Left, Top) элемент управления Y Height клиентская область (Right, Bottom) Width client area cursor border курсор граница Дочернее окно status bar Bведено 8 объектов строка состояния

10. Основной класс рисовния System.Windows.Drawing.Graphics • Соответствует контексту устройства операционной системы (hdc - handle of context device) • Используется для рисования на поверхности окна • Использует Graphic Device Interface + (GDI+)

11. Класс аргументов для события рисования в окне При обработке события Paint вторым параметром передается объект классаPaintEventArgs Объект PaintEventArgs содержит дополнительные данные Graphics – ссылка на объект Graphics ClipRectangle – испорченная прямоугольная область

12. Пространство имен System.Drawing Используется библиотека GDI+ (gdiplus.dll) Пространства именбиблиотеки

13. Пространства имен рисования System.Drawing – содержит большинство классов, структур, перечислений и делегатов, связанных с рисованием. System.Drawing.Drawing2D – включает классы, поддерживающие более продвинутое 2D и векторное рисование, включая сглаживание (anti-aliasing), геометрические преобразования (transformations) и графические пути (paths) System.Drawing.Imaging – включает различные классы, которые помогают работать с изображениями (bitmap, GIF file и т.п.) System.Drawing.Printing – включает классы для вывода на принтер или предварительного просмотра результатов вывода на принтер; System.Drawing.Design – включает некоторые стандартные диалоги (dialogboxes), таблицы свойств (propertysheets) и другие элементы пользовательского интерфейса с расширенным интерфейсом пользователя во время пректирования. System.Drawing.Text – содержит классы для выполнения наиболее совершенных действий с шрифтами (fonts) и семействами шрифтов (fontfamilies).

14. Библиотека API функций для рисования GDI32.DLL Библиотека GDI это набор функций для вывода на внешние устройства. Они предоставляют уровень абстракции, скрывающий различие между разными видео картами или принтерами. Программист просто вызывал нужную функцию Windows API для выполнения требуемой работы и GDI определял, как выполнить ее для конкретной видео карты. Если пользователь имел несколько устройств отображения, например, дисплеи и принтеры, то GDI позволяет показать на экране, как будет выглядеть результат вывода на принтер. Для вывода на принтер вместо дисплея достаточно только указать Операционной Системе, что устройством вывода является принтер и затем использовать те же функции API, которые использовались и для дисплея. Библиотека GDI предоставляет достаточно высоко-уровневый API для разработчиков, но все равно этот API основывается на наборе C – подобных функций.

15. Библиотеки типов рисованияGDI+ Библиотека GDI+ входит в состав FCL и является посредником между приложением и библиотекой GDI, предоставляя более интуитивно понятную, основанную на наследовании модель классов, структур, интерфейсов и перечислений. Хотя GDI+ в основном является оберткой вокруг GDI, Microsoft также реализовал в GDI+ новые особенности и улучшения производительности некоторых функций GDI. Библиотека GDI+ является частью библиотеки классов .NET и включает в себя большое количества типов. Все эти типы изучить сложно, но важно понять базовые принципы используемые в рисовании, чтобы можно было найти и использовать нужные классы, когда они потребуются. Описание всех классов и методов, доступных в GDI+ содержится в MSDN документации.

16. Основной класс рисования Graphics Рисование на поверхности формы (ЭУ) можно выполнить только с помощью объекта класса Graphics. Объект класса Graphics позволяет выполнять рисование на заданной поверхности (в окне формы, вывод на принтер или плоттере). Реализует интерфейс IDeviceContext, который включает методы для получения и освобождения существующего указателя на контекст устройства операционной системы (Windows device context, hdc - handle of context device) Использует интерфейс (набор функций) Graphic Device Interface + (GDI+) Пространство имен:System.Drawing (Сборка: System.Drawing.dll). Класс Graphics включает 72 метода и 18 свойств.

17. Основные методы класса Graphics void Clear (Color clr) -закраска окна DrawString(…) – рисование текста DrawLine(…) – рисование линий DrawRectangle(…) – рисование прямоугольников DrawEllipse(…) – рисование эллипсов DrawCurve(…) – рисование кривых DrawPoligon(…) – рисование многоугольников DrawPie(…) – рисование секторов круга …

18. Получение объекта Graphics Объект класса Graphics нельзя создать самому Graphics gfx = new Graphics(); Можнополучитьссылку на объект Graphicsиспользуя объект формы (или экземпляр производный от Control)с помощью метода CreateGraphics(): Graphics gfx = frm.CreateGraphics();// получение объекта … gfx.Dispose(); // уничтожение объекта В обработчик события Paint объект Graphics передается с помощью параметра PaintEventArgs в виде свойства Graphics

19. Событие Paint OC рисует все элементы окна, кроме клиентской области Когда ОС определяет, что нужно перерисовать поверхность клиентской области, то она посылает приложению, которое владеет данным окном сообщение WM_PAINT. После получения сообщения WM_PAINT класс Control инициирует событие Paint. При обработке этого события программа должна заново нарисовать содержание окна, или отдельную его область. Программа может сама вызвать создание события WM_PAINTиспользуя метод класса Control : Invalidate() или Invalidate(Rectangle rec)

20. Выполнение рисования • Рисовать можно в любом методе класса на поверхности любого окна на которое есть ссылка (например frm). • Используя ссылку frm нужно получить объект Graphics для данной формы: • Graphics gfx = frm.CreateGraphics();// получение объекта • Используя данный объект можно выполнять рисование. • Следует помнить, что если пользовательская область окна портится (Invalidated), то для ее восстановления ОС посылает сообщение WM_PAINT (событие Paint). • Обработчик события Paintдолжен заново нарисовать пользовательскую область. • Если требуется в окне что-то, что должно сохраняться при порче окна, то оно должно рисоваться в обработчике события Paint.

21. Система координат

22. Система координат (по умолчанию)

23. Система координат и единиц измерения • Системакоординатдлязаданияположения и размеров ЭУ, основываетсянакоординатахустройства и основнойединицейизмеренияпририсованииявляетсяпиксель (pixel) – наименьшийлогическийэлементдвумерногоцифровогоизображения в растровойграфике. • Растровое компьютерное изображение состоит из пикселей, расположенных по строкам и столбцам. Точки экрана описываются парами координат (x, y), где координата x увеличивается слева на право, а координата y увеличивается сверху вниз. • Размещение начала координат зависит от того, задаются ли экранные координаты (координаты экрана) или клиентские координаты (координаты клиентской области окна родителя). • Экранные координаты задают позицию окна на экране дисплея и их началом является верхний – левый угол экрана. Полное положение окна задается структурой Rectangle, содержащей экранные координаты двух точек, определяющих верхний – левый и правый – нижний углы окна. • Клиентские координаты задают положение точки в клиентской области окна. Их начальной точкой является верхний – левый угол клиентской области формы или ЭУ.

24. Классы для описания геометрических объектов Для работы с координатами и размерами ЭУ используются определенные в библиотеке FCL структуры Point, PointF, (поля X и Y) Size, SizeF (поля Height и Width) Rectangle (поля X , Y, Height и Width). СтруктурыPoint и Size позволяют задать прямоугольную область – структуруRectangle. Конструктору прямоугольника можно передать в качестве аргументов две структуры – точку, задающую координаты левого верхнего угла прямоугольника, и размер – высоту и ширину прямоугольника. Класс Point – точка (x,y) (PointF) Point pt = new Point (100,75); Класс Size – размер (длина ширина) (SizeF) Size sz = new Size (60,100); Класс Rectangle – прямоугольник (RectangleF) верхний угол, длина, ширина Rectanglerec = newRectangle(newPoint(50,70),newSize(40,40)); координаты левого верхнего и правого нижнего угла Rectanglerec = newRectangle(x, y, width, height);

25. Изменение системы координат Перенос центра системы gfx.TranslateTransform(x, y); Поворот системы кооординат gfx.RotateTransform(угол в градусах); Изменение единиц измерения gfx.PageUnit = GraphicsUnit.Millimeter; Задание масштаба gfx.PageScale = 2F;// увеличить в 2 раза gfx.PageScale = 0.5F;// уменьшить в 2 раза

26. Перечисление единиц измеренияGraphicsUnit GraphicsUnit.Pixel – пиксели (по умолчанию) GraphicsUnit.Point– поинты (1/72 дюйма) GraphicsUnit.Inch– дюйм (2.54 см) GraphicsUnit.Document– 1/300 дюйма GraphicsUnit.Millimeter– миллиметр

27. Классы инструментов рисования

28. Классы инструментов рисования Color – цвет пикселя. Pen – перо, описывает шаблон линии. Brush – кисть, описывает шаблон заполнителя замкнутых фигур. Font – шаблон шрифтадля вывода символов.

29. КлассColor (цвет) • Статический класс имеет 140 различных статических цветов • Статический методсоздания нового цвета – комбинация (red, green, blue) Color.FromArgb (int red, int green, int blue); Красный цвет: red = 0 - 255; Зеленый цвет: green = 0 – 255; Синий цвет: blue = 0 – 255; Color.FromArgb (int a, int red, int green, int blue); а - прозрачность

30. Класс Pen (перо) • Статический класс Pens – перья всех стандартных цветов. • Можно создать свое перо Pen pen = new Pen(color); Pen (Color color); Pen (Colorcolor, float width); Основные свойствакласса Pen: • DashStyleдля задания стиля линии - Solid, Dot, Dash, DashDot, DashDotDot, custom (System.Drawing.Drawing2D.DashStyle) • Color - цвет • Width - ширина

31. Примеры стилей пера - DashStyle

32. Кисть Brush (кисть) • Статический классBrushes – кисти всех стандартных цветов Можно создавать свои кисти • Класс SolidBrush – одноцветная кисть • Класс HatchBrush – с геометрическим, регулярным рисунком • Класс TextureBrush – кисть с произвольным заданным рисунком • Класс LinearGradientBrush– с градиентной заливкой

33. Класс HatchBrush • publicHatchBrush(HatchStylehStyle, Colorforecolor) • publicHatchBrush(HatchStylehstyle, Colorforecolor, Colorbackcolor) • Перечисление HatchStyle: • HatchStyle.DarkVertical • HatchStyle.DottedDiamond

34. Класс LinearGradientBrush • Vertical, • Horizontal, • Focus Point, • Tiling

35. Класс Font (шрифт) • Шрифт – способ рисования символов. • Типы шрифтов • Растровые • Векторные • Контурные – TrueType • При выводе текста нужно указывать используемый шрифт. • В ОС устанавливаются семейства (шаблоны) шрифтов. На их основе создаются конкретные шрифты.

36. Перечисление всего семейства шрифтов установленных в системе • Класс InstalledFontCollection содержит в коллекции Families описание всех установленных в ОС шрифтов: using System.Drawing.Text; using System.Diagnostics; . . . // создаем экземпляр класса InstalledFontCollection FontFamily[] fontFamilies; InstalledFontCollectioniFC = newInstalledFontCollection(); // просматриваем коллекцию и выводим в окно Output названия семейств шрифтов foreach(varfam in iFC.Families) Debug.WriteLine(fam.Name);

37. Создание шрифта • Конструкторы класса Font (string strFamily, float size) По умолчанию единица измерения размера шрифта – Point = 1/72 дюйма (2,54 см.) Font (string strFamily, float size, FontStylefs) Перечисление FontStyle: Regular (0); Bold (1); Italic (2) Underline (4); Strikeout (8) • Пример: Font font = new Font (“Times New Roman”, 24;) Font font1 = new Font ("Courier New", 12, FontStyle.Bold | FontStyle.Italic;) • Можно создать новый фонт на основе имеющегося Font (Font fnt, FontStylefs) Font fnt = new Font(“Courier New”, 14); Font font1 = new Font (fnt, FontStyle.Bold | FontStyle.Italic;)

38. Методы рисования Рисование текста Рисование линий Рисование фигур

39. Рисование текста Рисование текста относительно верхнего левого угла Рисование текста в заданном прямоугольнике (x, y) XXXXXXXXXXXXXXXXXXX Near-Near Near - Far Center-Center Far - Near Fart - Far

40. Рисование строки текста DrawString(string str, Font fn, Brush br, float x , float y) DrawString(string str, Font fn, Brush br, PointFptf) DrawString(string str, Font fn, Brush br, RectangleFptf) DrawString(string str, Font fn, Brush br, RectangleFptf, StringFormatsf) где: • str - выводимая строка текста (константа или объект класса string) • fnt – используемый фонт (объект класса Font) • br – используемая кисть (объект класса Brush) • xи y – координаты вывода строки

41. Класс StringFormat Класс для задания положения строки в прямоугольной области StringFormat sf = new StringFormat(); Основные свойства: Положение по горизонтали sf.Alignment = StringAlignment.Near (слева), Center (по центру), Far (справа) Положение вертикали sf.LineAlignment = StringAlignment.Near (сверху), Center (по центру), Far (снизу)

42. Измерение размера текста Для определения размеры выводимого текста используется метод класса Graphics: MeasureString(str, Font) Например: Sizef s = gfx.MeasureString(str, Font);

43. Рисование текста под углом • Устанавливаем начало координат в точку (x, y). gfx.TranslateTransform(x, y); • Поворот системы кооординат gfx.RotateTransform(угол в градусах)

44. Рисование линий • DrawLine(Pen pn, Point pt1, Point pt2); • DrawLine(Pen pn, int x, int y, int x1, int y1); • DrawLines(Pen pn, Point [] pt);

45. Рисование фигур DrawRectangle(…) – рисование прямоугольника DrawEllipse(…) – рисование эллепса DrawCurve(…) – рисование кривой DrawPoligon(…) – рисование многоугольника DrawPie(…) – рисование сектора круга

46. Закраска фигур FillRectangle(…) FillEllipse(…) FillPoligon(…) FillPie(…)

47. Работа с изображениями

48. Пространство именSystem.Drawing.Imaging Основные классы Image – абстрактный базовый класс для Bitmap. Имеет набор методов для чтения и записи изображений из файлов Bitmap - основной класс для создания изображения в оперативной памяти. Поддерживаемые графические форматы: Bitmaps (BMP), Graphics Interchange Format (GIF), Joint Photographic Experts Group (JPEG), Portable Network Graphics (PNG), Tag Image File Format (TIFF).

49. Операции с изображениями • Чтение из файла stringfname = "c:\\globe.gif"; Bitmapbmp = newBitmap(fname); // CasttoconvertImage bmp = (Bitmap)Bitmap.FromFile(fname); • Запись в файл bmp.Save("c:\\globe.jpg", System.Drawing.Imaging.ImageFormat.Jpeg); • Рисование (gfx – объект Graphics) Bitmapbmp = newBitmap("C:\\globe.gif"); // Drawatcoordinates 0,0 gfx.DrawImage(bmp,0,0);

50. Bitmap содержит данные и атрибуты пикселей составляющих графическое изображение. • Существуют разные форматы для хранения bitmap в файлах. • GDI+ поддерживает такие форматы, как: BMP, GIF, EXIG, JPG, PNG и TIFF.