WPF转UWP：图像平铺背景等效实现方案咨询

嘿，我之前也碰到过这个问题！WPF里的ImageBrush平铺逻辑到UWP里确实有变化，直接照搬原来的代码大概率会失效，不过有几个很实用的替代方法，我给你整理一下：

方案1：调整ImageBrush的Viewport设置（最简单的适配） #

UWP里的ImageBrush对ViewportUnits="Absolute"的处理和WPF不太一样，容易受DPI缩放影响导致平铺错位。换成相对单位配合比例值会更稳定：

<ImageBrush ImageSource="/Images/GroupPattern.png" 
            TileMode="Tile" 
            Viewport="0,0,0.03125,0.03125" 
            ViewportUnits="RelativeToBoundingBox"/>

这里的0.03125是32/1000的比例值——因为你的图案是32x32像素，用相对单位的话，Viewport的宽高是相对于控件尺寸的0-1范围，这样不管控件多大，图案都会按比例重复平铺。如果你的图案尺寸不是32，换成对应比例就行（比如24px的话就是24/1000=0.024）。

方案2：用DrawingBrush实现稳定平铺（推荐） #

UWP里的DrawingBrush对TileMode的支持更可靠，尤其是处理高DPI屏幕的时候，不会出现错位问题：

<DrawingBrush TileMode="Tile" Viewport="0,0,32,32" ViewportUnits="Absolute">
    <DrawingBrush.Drawing>
        <ImageDrawing ImageSource="/Images/GroupPattern.png" Rect="0,0,32,32"/>
    </DrawingBrush.Drawing>
</DrawingBrush>

这个方案和你原来WPF的逻辑最接近，直接指定图案的实际像素尺寸，就能实现精准的平铺效果，我自己项目里就是用这个解决的问题。

方案3：后台代码动态生成平铺图像（适合动态场景） #

如果需要根据控件尺寸动态调整平铺，或者要做一些自定义逻辑，可以用后台代码循环添加Image控件：

private void TileBackground(Panel targetPanel, Uri imageUri)
{
    targetPanel.Background = null;
    targetPanel.Children.Clear();
    
    var imageSize = new Size(32, 32);
    var bitmapSource = new BitmapImage(imageUri);

    // 循环生成平铺图像
    for (double y = 0; y <= targetPanel.ActualHeight; y += imageSize.Height)
    {
        for (double x = 0; x <= targetPanel.ActualWidth; x += imageSize.Width)
        {
            var tileImage = new Image
            {
                Source = bitmapSource,
                Width = imageSize.Width,
                Height = imageSize.Height,
                Margin = new Thickness(x, y, 0, 0)
            };
            targetPanel.Children.Add(tileImage);
        }
    }

    // 监听控件尺寸变化，重新平铺
    targetPanel.SizeChanged += (sender, e) =>
    {
        TileBackground(targetPanel, imageUri);
    };
}

调用的时候直接传入目标面板和图像路径就行：

TileBackground(MyMainGrid, new Uri("ms-appx:///Images/GroupPattern.png"));

额外注意事项 #

• 确保你的图像文件的Build Action设置为Content，不然UWP可能无法正确加载图像；
• 如果遇到DPI缩放导致的图案模糊，建议把图像准备多分辨率版本（比如1x、2x、3x），UWP会自动适配。

内容的提问来源于stack exchange，提问作者ODB8