wpf - 如何创建 WPF 滚动条看起来像 iTunes 封面流滚动条？

Question

我想在 WPF 中创建一个滚动条，看起来就像在 iTunes 封面流中看到的那样。请参阅下面的滚动条图像，它还显示了滚动条下方专辑封面的反射。

下面是 xaml 中的基本滚动条控件。

<ScrollBar Name="scrollBar1" Height="24" Width="Auto" Orientation="Horizontal"  
           SmallChange="1" />

我怎样才能从上面得到一个 iTunes 封面流滚动条的样子？最好使用完整的即用型源代码示例。

score 3 · Accepted Answer

从http://msdn.microsoft.com/en-us/library/ms742173.aspx的 MSDN 中的 ScrollBar ControlTemplate 示例开始（这比从 Blend 或 ShowMeTheTemplate 获得的窗口样式更容易修改）

现在开始编辑模板，更改颜色、箭头按钮和拇指的模板，直到看起来像你想要的。

score 1 · Accepted Answer

你有表达混合吗？如果没有，我建议安装它（如果您没有 MSDN 许可证，则有 30 天试用版）。

例如，这里有很多 Expression Blend 教程，这是一个很好的起点。

基本上，您复制标准滚动条的模板，它将为您提供构成它的所有元素。然后，您更改每个元素的外观，直到您得到它想要的样子。在这个过程中会有相当多的试错。

score 0 · Accepted Answer

第一个任务是在滚动条下方显示滚动区域。您必须更改ScrollViewer控件的结构。默认情况下，它是 2x2 Grid，因此水平滚动条位于滚动区域下方。编辑其模板，将滚动区域和滚动条放在同一个单元格中，将滚动条垂直对齐到底部。

第二部分是设置滚动条本身的样式。我不相信这不能用圆角矩形来完成。

我通常使用 Blend 提取模板来修改它，还有一个免费的ShowMeTheTemplate工具。

score 0 · Accepted Answer

查看 codeplex 上的WPF Themes 项目。Expression Blend 主题（浅色/深色）与您提供的示例非常接近。它是在PL 女士的名下发布的。

4 回答 4