WPF: создание настраиваемых линий сетки с переменным интервалом

Question

В настоящее время я создаю WPF-приложение, подобное MSPaint, и борюсь с реализацией настраиваемой сетки.

Рисование сетки не является проблемой для VisualBrush и Rectangle, но проблема в том, что эти линии предназначены только для внешнего вида и не могут быть легко изменены (например, выделены, когда срабатывает привязка к определенной линии).

Моя другая идея заключалась в том, чтобы иметь решение 2 Canvas, где 1 Canvas используется для элементов, а один Canvas (который расположен над другим) содержит все линии сетки. Однако у меня есть ощущение, что это будет значительный удар по производительности.

Существуют ли другие возможные способы реализации такого рода функций?

Answer 1

Вопросы эффективности двухпанельного подхода по сравнению с DrawingContext

У меня для вас хорошая новость: вы ошибаетесь в значительном падении производительности. Ваша идея с двумя холстами почти оптимальна, даже если вы используете отдельные объекты для линий сетки. Это связано с тем, что в WPF используется рендеринг с сохранением режима: при создании холста все на нем сериализуется в компактную структуру на нативном уровне. Это изменяется только при изменении линий сетки, например, при изменении расстояния между сетками. Во всех других случаях производительность будет неотличима от самых быстрых методов управляемого кода.

Небольшое увеличение производительности может быть достигнуто при использовании DrawingContext, как описывает Николас.

Более простое и эффективное решение

Возможно, лучший способ рисования отдельных линий на холсте сетки - использовать две мозаичные визуальные кисти (одну горизонтальную и одну вертикальную), чтобы нарисовать все неосвещенные линии, а затем использовать Rectangle (s), добавленные в коде для подсветки. линия (и), к которой вы привязываетесь.

Основным преимуществом этого метода является то, что ваша сетка может быть практически бесконечной, поэтому нет необходимости вычислять правильное количество линий сетки для рисования, а затем обновлять его каждый раз, когда изменяется размер окна или изменяется масштаб. У вас также есть только три элемента UIE, плюс еще один для каждой линии сетки, которая в данный момент подсвечена. Это также кажется мне чище, чем отслеживание коллекций линий сетки.

Причина, по которой вы хотите использовать две визуальные кисти, заключается в том, что рисование более эффективно: кисть, рисующая вертикальные линии, растягивается на огромное расстояние (например, double.MaxValue / 2) в вертикальном направлении, поэтому графический процессор получает только один чертеж вызов по вертикальной линии, то же самое по горизонтали. Выполнение двусторонней мозаики намного менее эффективно.

Слой Adorner

Поскольку вы спрашивали об альтернативах, другая возможность состоит в том, чтобы использовать Adorner и AdornerLayer с любым из приведенных выше решений, а не укладывать холст, используя, например, сетку или содержащий холст. Для приложения, подобного Paint, это хорошо, потому что слой надстройки может находиться над вашими графическими слоями, но при этом надписи могут прикрепляться к отдельным отображаемым элементам.

Answer 2

Возможно, вы захотите нарисовать свою сетку, используя DrawingContext внутри OnRender . Рисование таким способом не вводит новые элементы UIE в визуальное дерево, что помогает поддерживать производительность. В некотором смысле это похоже на то, что вы в настоящее время делаете с VisualBrush, который также не создает новых элементов пользовательского интерфейса для каждой копии.

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

Если вы собираетесь идти по этому маршруту, обязательно посмотрите GuidelineSet s для позиционирования направляющих (подробности здесь ), так как вы, вероятно, хотите, чтобы ваши направляющие линии привязывались к пикселям устройства, чтобы они рисовались резко.