BGRABitmap/ru: what changed
Revision 2 to 3. Removed lines have a minus sign; added lines have a plus sign.
| Old | New | Line | |
|---|---|---|---|
| 1 | - | ||
| 2 | - | ||
| 3 | 1 | См.также: [[Developing with Graphics/ru|Developing with Graphics]] | |
| 4 | 2 | ||
| 5 | - | ||
| 6 | - | ||
| 7 | - | ||
| 8 | - | ||
| 9 | - | ||
| 10 | - | ||
| 11 | - | ||
| 12 | - | ||
| 13 | - | ||
| 14 | - | ||
| 15 | - | ||
| 16 | - | ||
| 17 | - | ||
| 18 | - | ||
| 19 | - | ||
| 20 | - | ||
| 21 | - | ||
| 22 | - | ||
| 23 | - | ||
| 24 | - | ||
| 25 | 3 | ### Описание | |
| 26 | 4 | ||
| 27 | - | ||
| 5 | + | **BGRABitmap** - это набор модулей, предназначенных для изменения и создания изображений с прозрачностью (альфа-канал). Прямой пиксельный доступ позволяет быстро обрабатывать изображения. Библиотека была протестирована на Windows, Ubuntu и Mac OS X (последняя версия не работает на Mac), с наборами виджетов win32, gtk1, gtk2 и carbon. | |
| 28 | 6 | ||
| 29 | - | ||
| 7 | + | Основным классом является [[TBGRABitmap class|TBGRABitmap]], который является производным от [[fcl-image|TFPCustomImage]]. Существует также [[TBGRAPtrBitmap class|TBGRAPtrBitmap]], позволяющий редактировать данные BGRA, которые уже распределены. Этот формат состоит из 4 байтов для каждого пикселя (синий, зеленый, красный и альфа в этом порядке). | |
| 30 | 8 | ||
| 31 | - | ||
| 9 | + | Изображение может быть отображено на обычном Canvas или на [[BGRABitmap and OpenGL|OpenGL surface]]. | |
| 32 | 10 | ||
| 33 | 11 | ### Дополнительные пакеты | |
| 34 | 12 | ||
| 35 | - | ||
| 13 | + | Некоторые пакеты используют BGRABitmap для обеспечения элементов управления приятной графикой: | |
| 36 | 14 | ||
| 37 | - | ||
| 38 | - | ||
| 39 | - | ||
| 40 | - | ||
| 41 | - | ||
| 15 | + | - BGLControls: предоставляет TBGLVirtualScreen для рисования на поверхности OpenGL. Этот пакет находится в архиве BGRABitmap. | |
| 16 | + | - [[BGRAControls]]: ярлыки с тенями, красивыми кнопками, фигурами и т.д. | |
| 17 | + | - [[uE Controls]]: датчики, светодиоды и т.д. | |
| 18 | + | - [[Material Design]]: Компоненты пользовательского интерфейса, основанные на принципах разработки материалов Google. | |
| 19 | + | - BGRAControlsFX[1](https://forum.lazarus.freepascal.org/index.php?topic=34534.0): элементы управления рендеринга на поверхности OpenGL. | |
| 42 | 20 | ||
| 43 | - | ||
| 21 | + | Некоторые примеры в папке с примерами используют BGRAControls и BGLControls. Вам может понадобиться установить их, чтобы открыть эти проекты в Lazarus. См. [[Install Packages]]. | |
| 44 | 22 | ||
| 45 | 23 | ### Использование BGRABitmap | |
| 46 | 24 | ||
| 47 | 25 | #### Руководства | |
| 48 | 26 | ||
| 49 | - | ||
| 50 | - | ||
| 51 | - | ||
| 52 | - | ||
| 53 | - | ||
| 27 | + | - [Как конвертировать приложение из TCanvas в BGRABitmap(англ.)](http://www.youtube.com/watch?v=HGYSLgtYx-U) | |
| 28 | + | - [[BGRABitmap tutorial TAChart|Using BGRABitmap to render a TAChart]] | |
| 29 | + | - [[BGRABitmap tutorial|A series of tutorials to learn step by step]] | |
| 30 | + | - Примеры на [GitHub](https://github.com/bgrabitmap). | |
| 31 | + | - [Цикл уроков по компоненту BGRABitmap](http://dropdoc.ru/Zyr2) от пользователя [sign](http://www.freepascal.ru/forum/memberlist.php?mode=viewprofile&u=9593) | |
| 54 | 32 | ||
| 55 | 33 | #### Обзор | |
| 56 | 34 | ||
| 57 | - | ||
| 35 | + | Функции имеют длинные имена, чтобы быть понятными. Почти все доступно в виде функции или с помощью свойства объекта [[TBGRABitmap class|TBGRABitmap]]. Например, вы можете использовать CanvasBGRA, чтобы иметь некоторые холсты, похожие на TCanvas (с прозрачностью и сглаживанием) и Canvas2D, чтобы иметь те же функции, что и [HTML canvas](https://developer.mozilla.org/en/HTML:Canvas). | |
| 58 | 36 | ||
| 59 | - | ||
| 37 | + | Некоторые специальные функции требуют использования модулей, но они могут вам не понадобиться: | |
| 60 | 38 | ||
| 61 | - | ||
| 62 | - | ||
| 63 | - | ||
| 64 | - | ||
| 65 | - | ||
| 39 | + | - TBGRAMultishapeFiller иметь сглаженные соединения многоугольников в BGRAPolygon | |
| 40 | + | - TBGRATextEffect в BGRATextFX | |
| 41 | + | - 2D преобразования находятся в BGRATransform | |
| 42 | + | - TBGRAScene3D в BGRAScene3D | |
| 43 | + | - Если вам нужны слои, BGRALayers предоставляет TBGRALayeredBitmap | |
| 66 | 44 | ||
| 67 | - | ||
| 45 | + | Двойная буферизация на самом деле не является частью BGRABitmap, потому что она больше о том, как обрабатывать формы. Для двойной буферизации вы можете использовать TBGRAVirtualScreen, который находится в пакете [[BGRAControls]]. Кроме того, двойная буферизация в BGRABitmap работает как любая двойная буферизация. Вам нужно иметь растровое изображение, в котором вы храните свой чертеж и которое вы отображаете с помощью одной инструкции Draw. | |
| 68 | 46 | ||
| 69 | 47 | #### Ссылка на модуль BGRABitmapTypes | |
| 70 | 48 | ||
| 71 | - | ||
| 72 | - | ||
| 73 | - | ||
| 74 | - | ||
| 75 | - | ||
| 76 | - | ||
| 49 | + | - [[BGRABitmap Pixel types/ru|Pixel types and functions]]: *TBGRAPixel*, *THSLAPixel*... | |
| 50 | + | - [[BGRABitmap Types imported from Graphics|Types imported from Graphics]]: *TColor*, стиль пера... | |
| 51 | + | - [[BGRABitmap Color definitions|Color definitions]]: *VGAColors*, *CSSColors*... | |
| 52 | + | - [[BGRABitmap Geometry types|Geometry types]]: *TPointF*, кривые Берзье, *TArcDef*... | |
| 53 | + | - [[BGRABitmap Miscellaneous types|Miscellaneous types]]: шрифт, формат изображения, ресэмплинг... | |
| 54 | + | - [[TBGRACustomBitmap and IBGRAScanner]]: базовый класс для TBGRABitmap и сканеров | |
| 77 | 55 | ||
| 78 | 56 | #### Установка | |
| 79 | 57 | ||
| 80 | - | ||
| 81 | - | ||
| 82 | - | ||
| 83 | - | ||
| 58 | + | После распаковки архива BGRA часто не компилируется в Linux. Попробуйте использовать макрос IDE | |
| 84 | 59 | ||
| 85 | - | ||
| 60 | + | ` LCLWidgetType:=gtk2` | |
| 86 | 61 | ||
| 62 | + | в таких случаях. Тем не менее, некоторые другие части могут не скомпилироваться. | |
| 63 | + | ||
| 87 | 64 | #### Простой пример | |
| 88 | 65 | ||
| 89 | - | ||
| 90 | - | ||
| 66 | + | Создайте проект и откройте bgrabitmappackage.lpk с помощью Lazarus. В окне пакета нажмите "Use \> Add to Project". Затем в исходном коде основного файла (основная форма или основная программа) добавьте в раздел uses модуль BGRABitmap. Вам также может понадобиться добавить модуль BGRAGraphics, если вы используете определенные типы, которые унаследованы от LCL. | |
| 67 | + | ||
| 68 | + | ``` pascal | |
| 91 | 69 | Uses | |
| 92 | - | ||
| 70 | + | Classes, SysUtils, BGRABitmap, BGRABitmapTypes; | |
| 93 | 71 | ``` | |
| 94 | 72 | ||
| 95 | - | ||
| 96 | - | ||
| 73 | + | Модуль BGRABitmapTypes содержит общие определения, но можно объявить только BGRABitmap для загрузки и отображения растрового изображения. Затем первым шагом является создание объекта [[TBGRABitmap class|TBGRABitmap]]: | |
| 74 | + | ||
| 75 | + | ``` pascal | |
| 97 | 76 | var | |
| 98 | - | ||
| 99 | - | ||
| 100 | - | ||
| 101 | - | ||
| 102 | - | ||
| 103 | - | ||
| 104 | - | ||
| 105 | - | ||
| 106 | - | ||
| 77 | + | bmp: TBGRABitmap; | |
| 78 | + | begin | |
| 79 | + | bmp := TBGRABitmap.Create(100, 100, BGRABlack); // создаем изображение размером 100x100 пикселей с черным фоном | |
| 107 | 80 | ||
| 108 | - | ||
| 81 | + | bmp.FillRect(20, 20, 60, 60, BGRAWhite, dmSet); // рисуем белый квадрат без прозрачности | |
| 82 | + | bmp.FillRect(40, 40, 80, 80, BGRA(0, 0, 255, 128), dmDrawWithTransparency); // рисуем прозрачный синий квадрат | |
| 83 | + | ... | |
| 84 | + | end; | |
| 109 | 85 | ``` | |
| 86 | + | ||
| 87 | + | Наконец, чтобы показать растровое изображение: | |
| 88 | + | ||
| 89 | + | ``` pascal | |
| 110 | 90 | procedure TFMain.FormPaint(Sender: TObject); | |
| 111 | - | ||
| 112 | - | ||
| 113 | - | ||
| 91 | + | begin | |
| 92 | + | bmp.Draw(Canvas, 0, 0, True); // рисуем растровое изображение в непрозрачном режиме (быстрее) | |
| 93 | + | end; | |
| 114 | 94 | ``` | |
| 115 | 95 | ||
| 116 | - | ||
| 96 | + | Смотрите полный исходный код в [[BGRABitmap tutorial 1|tutorial 1]]. | |
| 117 | 97 | ||
| 118 | 98 | ### Понятия | |
| 119 | 99 | ||
| 120 | - | ||
| 100 | + | Пиксели в растровом изображении с прозрачностью хранятся с 4 значениями, здесь 4 байта \[расположены\] в порядке Blue, Green, Red, Alpha. Последний канал определяет уровень непрозрачности (0 означает прозрачный, 255 означает непрозрачный), другие каналы определяют цвет и яркость. | |
| 121 | 101 | ||
| 122 | - | ||
| 102 | + | Есть два основных режима рисования. Первый состоит в замене содержимого информации пикселя, второй состоит в смешении уже имеющегося пикселя с новым, который называется альфа-смешением. | |
| 123 | 103 | ||
| 124 | - | ||
| 104 | + | Функции BGRABitmap предлагают 4 режима: | |
| 125 | 105 | ||
| 126 | - | ||
| 127 | - | ||
| 128 | - | ||
| 129 | - | ||
| 106 | + | - dmSet : заменяет четыре байта нарисованного пикселя, прозрачность не обрабатывается. | |
| 107 | + | - dmDrawWithTransparency : рисует с альфа-каналом и с гамма-коррекцией (см. ниже). | |
| 108 | + | - dmFastBlend или dmLinearBlend : рисует с альфа-каналом, но без гамма-коррекции (быстрее, но влечет за собой искажения цвета с низкой интенсивностью). | |
| 109 | + | - dmXor : применяет Xor к каждому компоненту, включая альфа (если вы хотите инвертировать цвет, но сохранить альфа, используйте BGRA (255,255,255,0)). | |
| 130 | 110 | ||
| 131 | 111 | ### Встроенные функции рисования | |
| 132 | 112 | ||
| 133 | - | ||
| 134 | - | ||
| 135 | - | ||
| 136 | - | ||
| 137 | - | ||
| 138 | - | ||
| 139 | - | ||
| 140 | - | ||
| 141 | - | ||
| 142 | - | ||
| 143 | - | ||
| 113 | + | - рисование/стирание пикселей | |
| 114 | + | - рисование линии с или без сглаживания | |
| 115 | + | - координаты с плавающей точкой | |
| 116 | + | - ширина пера с плавающей точкой | |
| 117 | + | - прямоугольник (рамка или заливка) | |
| 118 | + | - эллипс и многоугольники со сглаживанием | |
| 119 | + | - расчет сплайна (скругленная кривая) | |
| 120 | + | - простая заливка (Floodfill) или прогрессивная заливка | |
| 121 | + | - отрисовка цветового градиента (линейная, радиальная ...) | |
| 122 | + | - скругленные прямоугольники | |
| 123 | + | - тексты с прозрачностью | |
| 144 | 124 | ||
| 145 | 125 | ### Рисование с помощью холста | |
| 146 | 126 | ||
| 147 | - | ||
| 127 | + | Можно рисовать с помощью объекта *Canvas*, с обычными функциями, но без сглаживания. Непрозрачность рисования определяется свойством *CanvasOpacity*. Этот способ медленнее, потому что он требует преобразования изображения. Если вы можете, используйте вместо этого *CanvasBGRA*, который позволяет \[использовать\] прозрачность и сглаживание, имея те же имена функций, что и в TCanvas. | |
| 148 | 128 | ||
| 149 | 129 | ### Прямой доступ к пикселям | |
| 150 | 130 | ||
| 151 | - | ||
| 152 | - | ||
| 131 | + | Для доступа к пикселям есть два свойства: *Data* и *Scanline*. Первый дает указатель на первый пиксель изображения, а второй дает указатель на первый пиксель данной строки. | |
| 132 | + | ||
| 133 | + | ``` pascal | |
| 153 | 134 | var | |
| 154 | - | ||
| 155 | - | ||
| 156 | - | ||
| 157 | - | ||
| 158 | - | ||
| 159 | - | ||
| 160 | - | ||
| 161 | - | ||
| 162 | - | ||
| 163 | - | ||
| 164 | - | ||
| 165 | - | ||
| 166 | - | ||
| 167 | - | ||
| 168 | - | ||
| 169 | - | ||
| 135 | + | bmp: TBGRABitmap; | |
| 136 | + | p: PBGRAPixel; | |
| 137 | + | n: integer; | |
| 138 | + | ||
| 139 | + | begin | |
| 140 | + | bmp := TBGRABitmap.Create('image.png'); | |
| 141 | + | p := bmp.Data; | |
| 142 | + | for n := bmp.NbPixels-1 downto 0 do | |
| 143 | + | begin | |
| 144 | + | p^.red := not p^.red; // инвертируем красный канал | |
| 145 | + | inc(p); | |
| 146 | + | end; | |
| 147 | + | bmp.InvalidateBitmap; // обратите внимание, что мы получили доступ к пикселям напрямую | |
| 148 | + | bmp.Draw(Canvas, 0, 0, True); | |
| 149 | + | bmp.Free; | |
| 150 | + | end; | |
| 170 | 151 | ``` | |
| 171 | 152 | ||
| 172 | - | ||
| 153 | + | Необходимо вызвать функцию *InvalidateBitmap*, чтобы пересобрать изображение, например, при следующем вызове *Draw*. Обратите внимание, что порядок строк может быть обратным, в зависимости от свойства *LineOrder*. | |
| 173 | 154 | ||
| 174 | - | ||
| 155 | + | Смотрите также сравнение между [[Fast direct pixel access|direct pixel access methods]]. | |
| 175 | 156 | ||
| 176 | 157 | ### Манипуляции с изображениями | |
| 177 | 158 | ||
| 178 | - | ||
| 159 | + | Доступные фильтры (с префиксом Filter): | |
| 179 | 160 | ||
| 180 | - | ||
| 181 | - | ||
| 182 | - | ||
| 161 | + | - Radial blur : ненаправленное размытие | |
| 162 | + | - Motion blur : направленное размытие | |
| 163 | + | - Custom blur : размытие по маске | |
| 183 | 164 | ||
| 184 | - | ||
| 185 | - | ||
| 186 | - | ||
| 187 | - | ||
| 165 | + | - Median : вычисляет медиану цветов вокруг каждого пикселя, что смягчает углы | |
| 166 | + | - Pixelate : упрощает изображение с прямоугольниками одного цвета | |
| 167 | + | - Smooth : смягчает все изображение, дополнительно к \[фильтру\] Sharpen | |
| 168 | + | - Sharpen :делает контуры более четкими, дополнительно к \[фильтру\] Smooth | |
| 188 | 169 | ||
| 189 | - | ||
| 190 | - | ||
| 191 | - | ||
| 170 | + | - Contour : рисует контуры на белом фоне (как карандашный рисунок) | |
| 171 | + | - Emboss : рисует контуры с тенью | |
| 172 | + | - EmbossHighlight : рисует контуры выделения, определенного в оттенках серого | |
| 192 | 173 | ||
| 193 | - | ||
| 194 | - | ||
| 174 | + | - Grayscale : преобразует цвета в оттенки серого с гамма-коррекцией | |
| 175 | + | - Normalize : использует весь спектр яркости цвета | |
| 195 | 176 | ||
| 196 | - | ||
| 197 | - | ||
| 198 | - | ||
| 199 | - | ||
| 200 | - | ||
| 201 | - | ||
| 177 | + | - Rotate : вращение изображения вокруг точки | |
| 178 | + | - Sphere : искажает изображение, чтобы оно выглядело, как проецируемое на сферу | |
| 179 | + | - Twirl : искажает изображение с эффектом закручивания | |
| 180 | + | - Cylinder : искажает изображение, чтобы оно выглядело, как проецируемое на цилиндр | |
| 181 | + | - Plane : вычисляет проекцию с высокой точностью на горизонтальную плоскость. Это довольно медленно. | |
| 182 | + | - SmartZoom3 : изменяет размер изображения х3 и определяет границы, чтобы иметь полезный зум с древними игровыми спрайтами | |
| 202 | 183 | ||
| 203 | - | ||
| 184 | + | Некоторые функции не имеют префикса Filter, потому что они не возвращают вновь выделенное изображение. Они изменяют изображение на месте: | |
| 204 | 185 | ||
| 205 | - | ||
| 206 | - | ||
| 207 | - | ||
| 208 | - | ||
| 209 | - | ||
| 210 | - | ||
| 211 | - | ||
| 186 | + | - VerticalFlip : переворачивает изображение по вертикали | |
| 187 | + | - HorizontalFlip : переворачивает изображение по горизонтали | |
| 188 | + | - Negative : инвертирует цвета | |
| 189 | + | - LinearNegative : инверсия без гамма-коррекции | |
| 190 | + | - SwapRedBlue : меняет местами красный и синий каналы (для конвертации между BGRA и RGBA) | |
| 191 | + | - ConvertToLinearRGB : конвертирует из sRGB в RGB. Обратите внимание, что формат, используемый BGRABitmap - **sRGB** при использовании *dmDrawWithTransparency* и **RGB** при использовании *dmLinearBlend*. | |
| 192 | + | - ConvertFromLinearRGB : конвертирует из RGB в sRGB. | |
| 212 | 193 | ||
| 213 | 194 | ### Сочетание изображений | |
| 214 | 195 | ||
| 215 | - | ||
| 196 | + | PutImage является основной функцией рисования изображений, а BlendImage позволяет комбинировать изображения, как слои программ для редактирования изображений. Доступны следующие режимы: | |
| 216 | 197 | ||
| 217 | - | ||
| 218 | - | ||
| 219 | - | ||
| 220 | - | ||
| 221 | - | ||
| 222 | - | ||
| 223 | - | ||
| 224 | - | ||
| 225 | - | ||
| 226 | - | ||
| 227 | - | ||
| 228 | - | ||
| 229 | - | ||
| 230 | - | ||
| 231 | - | ||
| 198 | + | - LinearBlend : простое наложение без гамма-коррекции (эквивалент dmFastBlend) | |
| 199 | + | - Transparent : наложение с гамма-коррекцией | |
| 200 | + | - Multiply : умножение значений цвета (с гамма-коррекцией) | |
| 201 | + | - LinearMultiply : умножение значений цвета (без гамма-коррекции) | |
| 202 | + | - Additive : добавление значений цвета (с гамма-коррекцией) | |
| 203 | + | - LinearAdd : добавление значений цвета (без гамма-коррекции) | |
| 204 | + | - Difference : разница значений цвета (с гамма-коррекцией) | |
| 205 | + | - LinearDifference : разница значений цвета (без гамма-коррекции) | |
| 206 | + | - Negation : устранение общих цветов (с гамма-коррекцией) | |
| 207 | + | - LinearNegation : исчезновение общих цвета (без гамма-коррекции) | |
| 208 | + | - Reflect, Glow : для световых эффектов | |
| 209 | + | - ColorBurn, ColorDodge, Overlay, Screen : разные фильтры | |
| 210 | + | - Lighten : сохраняет самые светлые цветовые значения | |
| 211 | + | - Darken : сохраняет самые темные значения цвета | |
| 212 | + | - Xor : исключающее ИЛИ цветовых значений | |
| 232 | 213 | ||
| 233 | - | ||
| 214 | + | Эти режимы можно использовать в TBGRALayeredBitmap, что упрощает эту задачу, поскольку BlendImage предоставляет только основные операции смешивания. | |
| 234 | 215 | ||
| 235 | 216 | ### Скриншоты | |
| 236 | 217 | ||
| 237 | - | ||
| 238 | - | ||
| 239 | - | ||
| 240 | - | ||
| 241 | - | ||
| 242 | - | ||
| 243 | - | ||
| 244 | - | ||
| 245 | - | ||
| 246 | - | ||
| 247 | - | ||
| 248 | - | ||
| 249 | - | ||
| 218 | + | -  | |
| 250 | 219 | ||
| 251 | - | ||
| 220 | + | * \ | |
| 221 | + | * \ | |
| 222 | + | * \ | |
| 252 | 223 | ||
| 253 | 224 | ### Лицензия | |
| 254 | 225 | ||
| 255 | - | ||
| 226 | + | модифицированная LGPL | |
| 256 | 227 | ||
| 257 | - | ||
| 228 | + | Автор: [Johann ELSASS](http://johann-elsass.net) ([Facebook](http://www.facebook.com/johann.elsass.1)) | |
| 258 | 229 | ||
| 259 | 230 | ### Скачать | |
| 260 | 231 | ||
| 261 | 232 | Последняя версия: <https://github.com/bgrabitmap/bgrabitmap/releases> | |
| 262 | 233 | ||
| 263 | 234 | Sourceforge with [[LazPaint]]: <http://sourceforge.net/projects/lazpaint/files/src/> | |
| 264 | 235 | ||
| 265 | 236 | GitHub: <https://github.com/bgrabitmap/> | |
| 266 | 237 | ||
| 267 | 238 | --- | |
| 268 | - | ||
| 239 | + | *From the Free Pascal wiki, page "BGRABitmap/ru", as it stood on 2022-09-11 after a change by Circular, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's [[Licensing]] page. If you have concerns about this material, [message the admin](/wiki-contact).* |
