创建一个由左、中、右图像组成的画笔，其中中间图像平铺

Posted 2023-04-09

【中文标题】创建一个由左、中、右图像组成的画笔，其中中间图像平铺

【英文标题】：Creating a Brush made of a left, middle, right image where the middle image gets tiled

【发布时间】：2012-09-13 14:55:15

【问题描述】：

我需要在 WPF 中创建一个画笔，用作面板的背景。画笔具有固定高度但可变宽度。中间图像需要平铺以填充空间，而左右图像是固定的。我尝试使用 VisualBrush 和带有图像的网格，但它不能正确对齐/缩放。这是一个适用于固定宽度的画笔。如何使它工作，以便它为可变宽度的面板平铺中间图像？

<DrawingBrush x:Key="Background">
    <DrawingBrush.Drawing>
        <DrawingGroup>
                <ImageDrawing Rect="0 0 16 16" ImageSource="Resources/Left.png"/>
                <ImageDrawing Rect="16 0 16 16" ImageSource="Resources/Middle.png"/>
                <ImageDrawing Rect="48 0 16 16" ImageSource="Resources/Right.png"/>
            </DrawingGroup>
        </DrawingGroup>
    </DrawingBrush.Drawing>
</DrawingBrush>

【问题讨论】：

你看过TileBrush吗？

DrawingBrush 是一个 TileBrush。 TileMode 适用于整个画笔，而不仅仅是其中的一部分。这就是为什么我要问是否可以将多个画笔（具有不同的平铺模式）组合成一个画笔。

【参考方案1】：

我不确定你是否真的能做到这一点，因此作为替代方案，使用绑定和转换器生成一个新的画笔以适应适当的大小。

<Grid VerticalAlignment="Center" Height="16" Margin="16,0" HorizontalAlignment="Stretch"
    Background="Binding Path=ActualWidth, RelativeSource=RelativeSource Self,Converter=StaticResource widthToBrushConverter"/>

并在宽度到画笔转换器

public class WidthToBrushConverter : IValueConverter

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    
        var width = (double)value;

        var result = new DrawingBrush();
        var group = new DrawingGroup();
        result.Drawing = group;

        group.Children.Add(new ImageDrawing(new BitmapImage(new Uri(@"Resources\Left.png", UriKind.Relative)), new Rect(0, 0, 16, 16)));
        group.Children.Add(new ImageDrawing(new BitmapImage(new Uri(@"Resources\Centre.png", UriKind.Relative)), new Rect(16, 0, width, 16)));
        group.Children.Add(new ImageDrawing(new BitmapImage(new Uri(@"Resources\Right.png", UriKind.Relative)), new Rect(16 + width, 0, 16, 16)));
        return result;
    

更新 唯一的问题是这似乎不起作用。我只是黑屏