0

我正在尝试在我的 WPF 应用程序中绘制类似于 soundcloud.com 上使用的波形我正在通过绘制多条垂直线来做到这一点

我想要的是所有线条都具有相同的颜色过渡（因此水平方向上所有像素都具有相同的颜色）因为并非所有线条都具有相同的长度，每条线条的末端都有不同的颜色。

LinearGradientBrush 有很多构造函数，最适合我需求的似乎是LinearGradientBrush(GradientStopCollection, Point, Point)。

Msdn 关于 LinearGradientContstructor 的文章

有了这些点，我似乎可以将 GradientStops 设置在画线之外

我的问题是我不知道如何使用积分。

var r = new GradientStopCollection();
r.Add(new GradientStop(Colors.Black, 0));
r.Add(new GradientStop(Colors.Red, 0.5));
r.Add(new GradientStop(Colors.Black, 1));

//this would be my main gradient background for all my lines (100%)
for (int i = 0; i < 25; i++)
{
  var line = new Line { X1 = i, X2 = i, Y1 = 0, Y2 = 200, Stroke = new LinearGradientBrush(r), StrokeThickness = 1 };
  WaveformCanvas.Children.Add(line);
}
//this would be an actual value of the waveform, points 0,0 and 1,1 seem to indicate that the gradientstops are exactly on the y1/y2
for (int i = 25; i < 50; i++)
{
  var line = new Line { X1 = i, X2 = i, Y1 = 50, Y2 = 150, Stroke = new LinearGradientBrush(r, new Point(0, 0), new Point(1, 1)), StrokeThickness = 1 };
  WaveformCanvas.Children.Add(line);
}
//these point values seem to be about correct for the current line length
//I came to these values by trial and error
for (int i = 50; i < 75; i++)
{
  var line = new Line { X1 = i, X2 = i, Y1 = 50, Y2 = 150, Stroke = new LinearGradientBrush(r, new Point(-0.5, -0.5), new Point(1.5, 1.5)), StrokeThickness = 1 };
  WaveformCanvas.Children.Add(line);
}

我对为什么这些点是 2d 坐标感到困惑，因为点 -0.5，-0.5 的渐变似乎与绘制的线没有不同的角度

所以我需要了解如何相对于我的“主要 100% 渐变”放置点

或者也许更简单的方法是用纯色绘制线条，然后使用某种颜色选择将黑色像素替换为矩形渐变作为背景。

4

1 回答 1

1

看看GradientBrush.MappingMode 属性。

LinearGradientBrush(GradientStopCollection, Point, Point)将初始化画笔，BrushMappingMode.RelativeToBoundingBox但我认为你需要BrushMappingMode.Absolute. 这个没有构造函数重载。所以你必须自己设置这个属性。

LinearGradientBrush brush = new LinearGradientBrush(r, new Point(0, 0), new Point(0, 200));
brush.MappingMode = BrushMappingMode.Absolute;
于 2012-06-07T02:16:42.067 回答