Metro-Style App 中的简单径向渐变背景答案

【问题标题】：Simple radial gradient background in Metro-Style AppMetro-Style App 中的简单径向渐变背景
【发布时间】：2012-04-28 08:57:44
【问题描述】：

在 XAML/C# Metro-Style App 中绘制径向渐变背景（也可以更改其颜色）的简单方法是什么？使用 DirectX 是一种选择吗？我尝试查看一些适用于 Windows 8 Consumer Preview 的 SharpDX 示例，但未能编译它们。尚未找到在 Windows 8 上的 C# 中使用 DX 的任何其他示例。有什么想法吗？

【问题讨论】：

XAML 可以做渐变。 Metro 指南说你不应该使用它们。
XAML 框架中没有径向渐变。据我所知，Metro 指南中没有关于不使用渐变的内容。你能指出我在哪里看到这个声明吗？此外 - Windows 8 Metro 风格的应用程序不必遵循 Metro 设计语言，所以这无关紧要 - 这只是沙盒化 WinRT 应用程序的一个不幸的名称选择。
开始菜单上的许多图块显然具有渐变背景。渐变效果很好

标签： c# xaml directx windows-runtime winrt-xaml

【解决方案1】：

RadialGradientBrush 尚未添加到 XAML 堆栈中。您可以使用 WriteableBitmapEx 自己将渐变绘制到 WriteableBitmap，然后使用 Image 或 ImageBrush 来显示它 - 尽管如果您有许多元素要使用不同形状的渐变，这可能会非常慢。

您可以只使用在 Photoshop 或 Paint.NET 中创建的常规图像。

使用 DirectX 可能过于复杂且没有必要，但您可以将 DirectX 与 XAML 混合使用。如果你真的想去那里 - 你可能需要使用 SurfaceImageSource。 MSDN 上有基本介绍here 或查看SharpDX 示例here。您可能还想使用 Direct2D 来渲染到该表面，因此您需要混合使用相当多的技术。

【讨论】：

据我所知 Metro 不支持 WriteableBitmapEx ......我自己发现了相同的 SharpDX 样本，但我还没有设法解决它，即使我过去曾与 OpenGL 合作过 :(
抱歉，忘记链接了 - 我将 WriteableBitmapEx 移植到 WinRT - 你可以在这里获取它：bit.ly/WriteableBitmapExWinRT
知道如何加快速度吗？我将每个像素设置在一个象限中，然后使用对称性，但是对于在屏幕之外具有起点/终点的渐变，我最终不得不设置每个像素。我只在主“窗口”的背景上使用渐变，但是一旦用户更改主题，就必须更改它。

【解决方案2】：

我使用 SharpDx 克服了这个障碍并为我创建了一个 RadialGradient 填充背景

http://advertboy.wordpress.com/2012/05/20/radial-gradients-mini-path-geometry-sprites-infinite-scrolling-inertial-canvas/

【讨论】：

你好电池消耗。

【解决方案3】：

径向渐变画笔已经存在了很长一段时间 - 我想我第一次使用是在 2008 年。无论如何，xaml 中的标记非常简单：

<Rectangle Width="200" Height="100">
      <Rectangle.Fill>
        <RadialGradientBrush 
          GradientOrigin="0.5,0.5" 
          Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5">
          <RadialGradientBrush.GradientStops>
            <GradientStop Color="Yellow" Offset="0" />
            <GradientStop Color="Red" Offset="0.25" />
            <GradientStop Color="Blue" Offset="0.75" />
            <GradientStop Color="LimeGreen" Offset="1" />
          </RadialGradientBrush.GradientStops>
        </RadialGradientBrush>
      </Rectangle.Fill>
    </Rectangle>

这里有完整的细节：http://msdn.microsoft.com/en-us/library/ms752281(v=vs.100).aspx

【讨论】：

RadialGradientBrush 在 Metro 上不可用
也许我对原始帖子的阅读太深了，但他说的是地铁风格，这让我想到香草 wpf 或 silverlight。
由于 OP 使用 WinRT 标记了消息，我认为可以安全地假设此解决方案在 Windows 8“以前称为 Metro 的艺术家”应用程序中目前不起作用。
RadialGradientBrush 在 RTM 版本中也不可用