65.9K
CodeProject 正在变化。 阅读更多。
Home

Photoshop 式渐变编辑器

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.31/5 (14投票s)

2006年2月9日

Ms-RL

3分钟阅读

viewsIcon

58185

downloadIcon

1454

一个类似 Photoshop 的渐变构建器控件,用于绘图应用程序。

引言

我目前正在设计一个巨大的智能客户端应用程序,其中包含大量令人惊叹的 UI。 仔细研究 UI 设计,很快就发现我需要花费大量时间编写代码来绘制渐变填充,这在如今的平面设计师中似乎非常热门。 并且不难理解为什么; 它们对 UI 产生的差异是相当壮观的。

因此,面对不得不从简单的 Label 到复杂的容器控件绘制所有内容的潜在噩梦,我开始构建一个小型的 GUI 库,我将其命名为 Inferno。 想法是构建几个从 System.Windows.Forms 中的类继承的控件,并附加设计时可配置的渐变填充。 因此,例如,代替通常的 BackColor 属性,Label 将具有 BackGraident 属性。 好了,希望在不久的将来,我能够在这里发布整个库。 祝好运...

所以这篇文章是关于我制作的第一个小部件。 虽然它最初是作为我的 Gradient 类的 UITypeEditor 使用的,但我相信很多人可以在他们可能构建的任何形式的图形应用程序中使用它。

它是如何运作的

GradientBuidler 类是一个自定义绘制的控件,它在水平方向上分为两个矩形区域,称为 gradientBarRectmarkerStrip

标记条区域是用户可以在渐变上插入新颜色步进的地方。 他基本上可以双击渐变预览正下方的任何点,以插入一个新标记(默认为其正上方渐变的准确颜色)。 除了开始和结束标记之外,标记可以在标记条上移动以微调渐变。

渐变的预览以酌情方式绘制到 gradientBarRect 上。 当渐变更改时,新渐变将绘制到 Bitmap 对象上,然后将其绘制到渐变条区域。 Bitmap 对象充当渐变的缓存快照,极大地提高了控件必须自行重绘时的绘制操作的性能。 顺便说一句,这种行为在我的实际 UITypeEditor 中不存在,因为它只需要显示很短的时间。

该代码还包括由 Emmanuel Tissandier 开发的用于显示颜色选择器的 TypeEditor。

使用渐变编辑器

渐变编辑器设置为公开 Gradient 类型的对象。 Gradient 类包含几个方法,您可以在执行常见填充操作时使用它们

  • public void FillRectangle( Graphics g, Rectangle rect )
  • public void FillRegion( Graphics g, Region rgn )
  • public void FillPath( Graphics g, GraphicsPath path )

另一方面,如果您需要更大的灵活性,您可以使用以下方法获取 LinearGradientBrushPathGradientBrush 对象的句柄:

  • public PathGradientBrush GetPathGradientBrush( GraphicsPath path )
  • public LinearGradientBrush GetLinearGradientBrush(Rectangle rect)

然后,您当然有责任在完成后处理画笔。 ;)

处理 GradientEditorGradientChanged 事件,以便在用户更改 Gradient 时重绘您的图形。 通过将 SilentMarkers 属性设置为 false(默认),您可以使控件在拖动标记时触发此事件。

关于演示的说明

我包含的演示应用程序对于任何人来说可能都过于简单。 通过处理其 Paint 事件来在 Panel 上绘图不是最理想的方式。 我这样做只是为了尽可能保持简单。 如果您正在编写一个真正的图形应用程序,我建议您使用 CodeProject 似乎拥有的许多优秀的画布类之一。

© . All rights reserved.