Canvas: примитивы рисования

canvas.Rectangle — самый частый примитив: подложки панелей, плашки статусов, цветные полосы. У него три краски: FillColor заливает фигуру, StrokeColor со StrokeWidth рисуют контур. Создаётся либо функцией canvas.NewRectangle(color), либо литералом &canvas.Rectangle{FillColor: ...} — разницы нет, выбирай что читабельнее. Первое, что надо понять: примитив не знает, какого размера ему быть. У Rectangle, как и у большинства объектов пакета, минимальный размер нулевой — размеры диктует контейнер-владелец или прямой вызов Resize. Положишь прямоугольник в VBox — получишь полосу нулевой высоты; отдашь ячейке грида — он растянется на всю ячейку. Второе железное правило: поменяй поле — позови Refresh(). Цвет, записанный в FillColor, не сам просится на экран: перерисовка происходит по команде, и без Refresh новое значение проявится только когда окно перерисуется само, например при изменении размера. Так устроен весь fyne canvas: примитив — данные, Refresh — приказ их нарисовать. Третье: цвета задаются из пакета image/color стандартной библиотеки — обычно color.NRGBA с четырьмя каналами, о палитрах чуть позже.

canvas.Circle — окружность, вписанная в свой прямоугольник: те же FillColor, StrokeColor и StrokeWidth. В ячейке с равными сторонами получится круг, в вытянутой — эллипс: примитив честно заполняет отведённое место, за пропорциями следишь ты — здесь снова пригодится GridWrap из пятого урока. canvas.Line устроен неожиданно: у него нет полей вида «от точки до точки» — линия рисуется как диагональ своего прямоугольника. Позиция объекта задаёт начало, позиция плюс размер — конец; направь размер строго горизонтально — получишь черту-разделитель, дай высоту — наклонную линию, а набор коротких отрезков складывается в график. Толщина — StrokeWidth, заливки у линии нет, только StrokeColor. Это модель «ограничивающего прямоугольника», и она сначала сбивает с толку, но потом окупается: линия подчиняется тем же компоновкам, что и всё остальное, растёт и сжимается вместе с контейнером без пересчёта координат. Хочешь разделитель на всю ширину панели — положи Line в грид или в Border, и он растянется сам. Полоску нулевой высоты в VBox, как и прямоугольник, не увидишь: размеры примитивам всегда выдаёт контейнер.

canvas.Text — надпись без обёртки виджета: поле Text хранит строку, Color — цвет, Alignment задаёт выравнивание константами fyne.TextAlignLeading, fyne.TextAlignCenter и fyne.TextAlignTrailing, TextStyle включает Bold, Italic и Monospace, а TextSize — размер в пунктах. Функция canvas.NewText(s, color) делает то же в одну строку. В отличие от виджетов, у Text нет темы: какой цвет назначил — такой и есть, и смена темы его не перекрасит, пока ты не назначишь новый и не позовёшь Refresh. Чем это отличается от widget.Label из третьего урока? Label — виджет: берёт цвет и шрифт из активной темы, перерисовывается сам при её смене и участвует в стандартных механизмах вроде масштабирования шрифтов; canvas.Text — сырое рисование: полный контроль над цветом, размером и стилем в обмен на ручное обновление. Редактировать текст он тоже не умеет: для ввода нужен Entry из третьего урока, подробный разбор поля ввода — девятый. Практическая ниша Text — надписи поверх рисунка: штампы на превью, подписи осей, значения на шкалах, watermark на миниатюре.

canvas.Image показывает растровые картинки, и у него три источника. Поле File — путь к файлу на диске, для него есть canvas.NewImageFromFile; поле Resource — fyne.Resource, данные, вшитые в бинарник, — canvas.NewImageFromResource, о ресурсах и embed подробно расскажет шестнадцатый урок; поле Image — готовый image.Image из памяти, например отрисованное другим кодом, — canvas.NewImageFromImage. Главный настрой — FillMode, режим вписывания. ImageFillStretch растягивает картинку на весь контейнер без сохранения пропорций: заполнит любую ячейку, но круг превратит в овал — это значение по умолчанию. ImageFillContain вписывает с сохранением пропорций: если контейнер выше, появятся пустые поля сверху и снизу. ImageFillOriginal рисует в натуральном размере без всякого масштабирования: картинка 1200 на 800 будет именно такой, даже если окно 300 на 200, — удобно с прокруткой, а в маленьком контейнере она просто уйдёт за края. Плюс Translucency — прозрачность от 0 до 1, чтобы призрачно наслаивать картинки. Частая ошибка новичка — ожидание, что Image сам уменьшится: он делает ровно то, что сказал FillMode, и не пикселем больше.

Когда примитивов мало, включается canvas.Raster: ты отдаёшь функцию-генератор func(w, h int) image.Image, и при каждой перерисовке она получает размер области в пикселях и возвращает картинку. Полный контроль над каждым пикселем: визуализации, тепловые карты, фракталы, эффекты пламени — всё это Raster. Плата за свободу — собственные руки: у примитивов сглаживание делает painter тулкита, а в генераторе ты рисуешь в буфер image.Image сам, и ступеньки убираешь своими силами. Для простых плавных переходов есть готовый и дешёвый canvas.LinearGradient: поля StartColor, EndColor и Angle дают градиентную подложку любой плашки без единого пикселя вручную — чаще всего это именно то, что нужно, а Raster оставь попиксельным задачам. Важная деталь производительности: генератор Raster вызывается заново при каждой перерисовке области, поэтому тяжёлую математику кешируй — считай один раз и отдавай готовый image.Image, если параметры не изменились. Эта же гигиена пригодится в восьмом уроке: рендерер виджета тоже перерисовывается неоднократно.

Все примитивы красятся одним типом — color.Color из стандартной библиотеки, и на практике это почти всегда color.NRGBA{R, G, B, A}: четыре канала от 0 до 255, где альфа задаёт прозрачность — 0 полностью прозрачно, 255 непрозрачно. Полупрозрачные плашки поверх фото делаются одним значением альфы, например A: 160. Второй источник цветов — активная тема: theme.Primary(), theme.Error(), theme.Warning() и другие возвращают color.Color текущей темы, и подложки, совпадающие с палитрой приложения, лучше брать оттуда, а не изобретать оттенки. Но есть нюанс, о котором часто спотыкаются: ты присваиваешь полю примитива значение цвета на момент присваивания. Если пользователь сменит тему, виджеты перекрасятся сами — их рендереры слушают тему, а твой Rectangle останется в старом цвете, пока ты не присвоишь новое значение из обновлённой темы и не позовёшь Refresh. Это плата за сырость примитивов: полный контроль и ручное обслуживание. Как строить свои темы и корректно перекрашивать всё приложение — пятнадцатый урок; здесь запомни правило: примитив запоминает цвет, а не подписку на него. Так начинается осмысленное рисование fyne: палитра — твоя забота.

Примитивы у тебя в руках, и это не случайность: внешний вид любого виджета — это WidgetRenderer, собранный из тех же canvas-объектов. Восьмой урок — «Кастомные виджеты» — соединит события шестого урока и примитивы этого в один навык: свой контрол с поведением и внешним видом. До этого стоит держать в голове каталог базовых виджетов, сетки пятого урока, которые сегодня выдавали примитивам размеры, и события шестого, которые заставят твой будущий виджет реагировать на клики. Картинки, кстати, грузятся и из ресурсов, вшитых в бинарник, — им посвящён шестнадцатый урок, а живое применение шкал и индикаторов ждёт в итоговом менеджере задач. Общий маршрут из двадцати пяти уроков — на странице курса Fyne. Домашнее задание соберёт из примитивов спидометр — и это будет твоя первая нарисованная, а не собранная из виджетов вещь.