Стили DataGrid - добавить визуальный шаблон в фон - PullRequest
0 голосов
/ 09 января 2012

Я пытаюсь добавить несколько стилей в некоторые DataGrid s, которые у меня есть.

В настоящее время я работаю над приложением, предназначенным для отображения огромных объемов финансовых данных (матриц чисел) со многими визуальными инструментами для обнаружения хороших данных, неправильных данных ... и исправления их при необходимости, сравнивая их с целевым значением

На данный момент у меня есть цветовой код, который в основном:

  • Белый фон: текущее значение отлично
  • Красный фон: текущее значение ниже целевого значения!
  • Зеленый фон: текущее значение выше целевого значения!

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

Теперь я хотел бы добавить еще один визуальный инструмент: своего рода визуальный шаблон, чтобы уведомить пользователя о том, что это значение, будучи правильным или неправильным, представляет потенциальный риск (как я уже говорил ранее, это финансовые данные, поэтому в основном измерение рисков потери денег).

В текущем приложении, запрограммированном в VBA, используется трюк, который добавляет пустой комментарий к ячейке, поэтому в углу появляется маленький красный треугольник.

Я бы хотел найти способ добавить его в свой стиль XAML. Самое приятное, что я придумал, - это добавить визуальный шаблон.

Вот пример того, чего я пытаюсь достичь:

Grid example

В левом столбце вы можете увидеть «нормальное отображение». Справа я добавил «стили опасности», которые должны означать «предупреждение, что с этим значением что-то не так». Первая строка показывает старый способ сделать это в Excel: с поддельным комментарием, который добавляет красный треугольник в верхнем правом углу.

Не могли бы вы представить, как этого добиться? Adorner сделает трюк?

Кстати, сетка редактируема, поэтому я, очевидно, не хочу терять редактируемый аспект, поэтому я сомневаюсь в возможном Adorner ...

Вот текущий XAML Style, который применяется как CellStyle:

<Style x:Key="DynamicCellStyle" TargetType="{x:Type DataGridCell}">
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Background" Value="#FF316AC5" />
        </Trigger>
        <Trigger Property="IsSelected" Value="False">
            <Setter Property="Background">
                <Setter.Value>
                    <MultiBinding Converter="{StaticResource CellToColorConverter}">
                        <!-- Some bindings for the converter to compute the actual color -->
                    </MultiBinding>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridCell}">
                <Grid Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>

    </Setter>

Есть идеи?

Большое спасибо!

Ответы [ 2 ]

2 голосов
/ 13 января 2012

Хорошо, я нашел очень правильный способ сделать это, используя DrawingBrush

                                            <DrawingBrush TileMode="Tile"
                                                      ViewportUnits="RelativeToBoundingBox"
                                                      Viewport="0,0,0.20,1">
                                                <DrawingBrush.Drawing>
                                                    <DrawingGroup>
                                                        <GeometryDrawing>
                                                            <GeometryDrawing.Pen>
                                                                <Pen Brush="Red" Thickness="0.83"/>
                                                            </GeometryDrawing.Pen>
                                                            <GeometryDrawing.Geometry>
                                                                <RectangleGeometry Rect="0.3,0.4,0.3,0.21" RadiusX="0" RadiusY="0"/>
                                                            </GeometryDrawing.Geometry>
                                                        </GeometryDrawing>
                                                        <GeometryDrawing>
                                                            <GeometryDrawing.Pen>
                                                                <Pen Brush="Black" Thickness="0.05"/>
                                                            </GeometryDrawing.Pen>
                                                            <GeometryDrawing.Geometry>
                                                                <LineGeometry StartPoint="0,1" EndPoint="1,0" />
                                                            </GeometryDrawing.Geometry>
                                                        </GeometryDrawing>
                                                    </DrawingGroup>
                                                </DrawingBrush.Drawing>
                                            </DrawingBrush>

По сути, вы бы нарисовали красный прямоугольник (вы можете изменить цвет, конечно), который заполнитячейка, поэтому выступать в качестве фона, а также рисовать выше 5 диагональных линий.Вы можете изменить номер онлайн, переключив число х здесь: Viewport="0,0,x,1".В моем случае это 0.20, что означает 20% от общей поверхности, например, Geometry будет нарисовано пять раз, каждый из которых занимает 20% доступной ширины.

Используйте эту кисть какфон для любого DataGridCell, и вы получите следующий результат:

DataGrid templates

Это почти точно то, что я хотел (и делает немного лучше, чем идея GradientBrushиз dex3703)

2 голосов
/ 10 января 2012

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

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

[после просмотра моей книги WPF ...]

Самым простым может быть LinearGradientBrush с SpreadMethod, установленным на Repeat. Поиграйте со значениями начальной и конечной точек, чтобы получить эффект полосатости. Вот пример из книги:

<LinearGradientBrush StartPoint=".45,.45" EndPoint=".55,.55" SpreadMethod="Repeat">
<GradientStop Offset="0" Color="Blue"/>
<GradientStop Offset="1" Color="Red"/>
</LinearGradientBrush>
...