Фотошоп, как фон на прозрачном изображении

Question

Я делаю графический редактор для своего проекта класса, и я хочу сделать так, чтобы когда, например, пользователь загружает изображение в редактор или или рисует что-то в PictureBox, все альфа-части отображаются на шахматной доске в качестве фона.

Моя идея состоит в том, что когда я создаю PictureBox с прозрачным фоном, я создаю еще один позади него, устанавливаю его BackColor на белый и добавляю серые изображения 50x50, поочередно по горизонтали и по вертикали. Это хороший подход к проблеме? Если нет, у вас есть какие-либо предложения?

В фотошопе, например, я создаю изображение 1600x1600. Когда я увеличиваю масштаб до определенного уровня, он сужает рамки и добавляет их больше, чтобы заполнить изображение. Если вы использовали Photoshop аналогичной программы, вы знаете, что я имею в виду. Теперь, как бы я пошел для достижения того же эффекта?

Answer 1

Создание фотошоп-подобной программы - увлекательный проект.

На вашем пути будет много испытаний, и стоит подумать немного впереди.

Вот краткий и неполный список вещей, которые нужно иметь в виду:

• Рисование и рисование
• Отменить, повторить, редактировать
• Несколько слоев
• Масштабирование и прокрутка
• Сохранение и печать

Так что получение фона шахматной доски - это только начало долгого путешествия.

Используя PictureBox В качестве базового холста очень хороший выбор, так как его несколько слоев помогут. Вот фрагмент кода, который предоставит вам гибкий фон шахматной доски, который сохранит свой размер даже при масштабировании реальной графики:

void setBackGround(PictureBox pb, int size, Color col)
{   
    if (size == 0 && pb.BackgroundImage != null)
    {
        pb.BackgroundImage.Dispose();
        pb.BackgroundImage = null;
        return;
    }
    Bitmap bmp = new Bitmap(size * 2, size * 2);
    using (SolidBrush brush = new SolidBrush(col))
    using (Graphics G = Graphics.FromImage(bmp) )
    {
        G.FillRectangle(brush, 0,0,size, size);
        G.FillRectangle(brush, size,size, size, size);
    }
    pb.BackgroundImage = bmp;
    pb.BackgroundImageLayout = ImageLayout.Tile;
}

Загрузите изображение для тестирования, и это то, что вы получите, оставив в норме, увеличив вправо:

Да, для сохранения этот фон должен быть удален; как вы можете видеть в коде, передача в размере = 0 сделает это.

Что дальше? Позвольте мне дать вам несколько советов о том, как подходить к различным задачам сверху:

• Прокрутка: Picturebox не могу прокрутить Вместо этого поместите это в Panel с AutoScroll = true и сделать его настолько большим, насколько это необходимо.

• Масштабирование: игра со своим Size и SizeMode позволит вам увеличивать и уменьшать Image без проблем. BackgroundImage останется неизменным, так же, как в Photoshop. Однако вам придется добавить еще немного кода, чтобы увеличить изображение, которое вы рисуете на верхней панели или на слоях. Ключевым моментом здесь является масштабирование Graphics объект с помощью Graphics.MultiplyTransform(Matrix),

• Слои: Слои, по-моему, единственная наиболее полезная функция в PhotoShop (и других качественных программах). Они могут быть достигнуты путем вложения прозрачных рисунков холстов. Panels можно использовать, я предпочитаю Labels, Если каждый сидит внутри того, кто находится под ним, и у того, что внизу, есть PB как его Parent, все их содержимое будет показано вместе.

  • Не используйте Label прямо, но создать subclass держать дополнительные данные и ноу-хау!
  • Менять их порядок не очень сложно, просто помните вложенную структуру и не троньте ее!
  • Чтобы скрыть слой, нужно установить флаг и проверить этот флаг в действиях рисования.
  • Другие данные могут включать Имя, Непрозрачность, возможно цвет наложения.
  • Слои также должны отображаться в палитре слоев, лучше всего с помощью создания эскиза и вставки объекта-слоя в FlowLayoutPanel

• Действия рисования: это всегда ключ к любому рисунку в WinForms, При использовании мыши для рисования каждое такое действие создает объект DrawAction класс, который вам нужно спроектировать, который содержит всю информацию, необходимую для создания фактического рисунка, например:

  • Тип (прямоугольник, заполненный прямоугольник, линия, FreeHandLine (серия точек), текст и т. Д. И т. Д.)
  • Цвета
  • Точки
  • Ширина
  • Текст
  • Слой для рисования
  • может быть, даже вращение

  Наряду с классом LayerCanvas класс DrawAction будет самым важным классом в проекте, поэтому правильное проектирование стоит некоторой работы!

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

• Поскольку все рисунки хранятся в списках, выполнение неограниченного числа операций отмены и повтора является простым. Чтобы обеспечить эффективное рисование и отмену, возможно, лучший список действий и отдельный список для каждого слоя - лучший дизайн.

  • Отмена и повтор - это просто вопрос удаления последнего элемента списка и помещения его в стек повторного выполнения.
  • Также возможно редактирование действий, включая изменение параметров, перемещение их вверх или вниз по списку действий или удаление одного из середины списка. Это помогает показать палитру действий, как F9 в PhotoShop.
  • Чтобы сгладить два или более слоя вместе, все, что вам нужно, это объединить их списки действий.
  • Чтобы сгладить все слои в Image вам нужно только нарисовать их не на холсте, а на изображении. Различие рисования на элемент управления или в растровое изображение смотрите здесь! Здесь мы имеем PictureBox.Image как второй уровень структуры ПБ выше Background.Image, (3-й Control поверхность, но с несколькими слоями сверху нам это не нужно..)

• Сохранение может быть выполнено любым Image.Save() после сглаживания всех слоев или после того, как вы выключили BackgroundImage, сказав PB, чтобы нарисовать себя в Bitmap (control.DrawToBitmap()), который вы можете сохранить.

Повеселись!