WPF学习笔记-第二周【基本笔刷】

  书接上回，这一次，讲的是WPF中的基本笔刷，由于是菜鸟，就不多说了，继续帖示例代码：）

 

第一部份 代码

第二章 基本笔刷

第一个 示例

 

  1     #region VaryTheBackgroud P38
 2     
 3     /// <summary>
 4     /// 改变背景的示例
 5     /// 通过鼠标移动事件，根据鼠标对应的窗口中心位置的距离计算并改变窗口的背景颜色
 6     /// </summary>
 7     public class VaryTheBackgroud : Window
 8     {
 9         /// <summary>
10         /// 定义一个 Brush,存放窗口的背景颜色
11         /// </summary>
12         SolidColorBrush brush = new SolidColorBrush(Colors.Black);
13         /// <summary>
14         /// 构造窗口
15         /// </summary>
16         public VaryTheBackgroud()
17         {
18             //指定标题\高\宽和背景颜色
19             this.Title = "Vary The Backgroud";
20             this.Width = 384;
21             this.Height = 384;
22             Background = brush;
23         }
24 
25         [STAThread]
26         static void Main()
27         {
28             //定义并运行程序
29             Application app = new Application();
30             app.Run(new VaryTheBackgroud());
31         }
32 
33         /// <summary>
34         /// 重写鼠标移动事件
35         /// </summary>
36         /// <param name="e"></param>
37         protected override void OnMouseMove(MouseEventArgs e)
38         {
39             //base.OnMouseMove(e);
40             //获得窗口的工作区的宽和高(减去加框和标题栏后的高宽度)
41             double width = ActualWidth - 2 * SystemParameters.ResizeFrameVerticalBorderWidth;
42             double height = ActualHeight - 2 * SystemParameters.ResizeFrameHorizontalBorderHeight - SystemParameters.CaptionHeight;
43             //当前鼠标的位置
44             Point ptMouse=e.GetPosition(this);
45             //窗口工作区中心点
46             Point ptCenter=new Point(width/2,height/2);
47             //鼠标相对工作区中心的偏移量
48             Vector vectMouse = ptMouse - ptCenter;
49             //计算角度
50             double angle = Math.Atan2(vectMouse.Y, vectMouse.X);
51             //计算一个圆形的区域
52             Vector vectEllipse = new Vector(width / 2 * Math.Cos(angle), height / 2 * Math.Sin(angle));
53             //计算鼠标的位置与圆形区域的比例,并*255 以转换成颜色值
54             Byte byLevel = (byte)(255 * (1 - Math.Min(1, vectMouse.Length / vectEllipse.Length)));
55             //修改brush 的颜色
56             Color clr=brush.Color;
57 
58             clr.R=clr.G=clr.B=byLevel;
59 
60             brush.Color=clr;
61         }
62     }
63 
64     //相关知识:
65     //1、Brush 的改变后会自动重画窗口，
66     //原因是因继承自Freezable类，该类实现了一个名为Changed的事件，会在发生改变后被触发。
67     //2、Colors 定义了141种颜色，Brushs也同样的定义了同名的141种画刷
68     //3、如果直接 SolidColorBrush brush =Brushs.Black 后再来指定颜色则会报错，因由 Brushs 所得的画刷对象是处于冻结状态的，不能再被改变
69     //4、被冻结的Freezable对象可以在不同的线程之间共享，未被冻结的则不行。
70     
71     #endregion

 

 

第二个示例

 

  1     #region FlipTroughTheBrushes P41
 2     
 3     /// <summary>
 4     /// 使用 Brushes 类定义的 141 种颜色笔刷填充窗口
 5     /// 通过重写 OnKeyDown 事件按一下下方向键，就使用一种颜色的笔刷填充窗口
 6     /// </summary>
 7     public class FlipThroughTheBushes:Window
 8     {
 9         //定义计数器和笔刷组
10         int index = 0;
11         PropertyInfo[] props;
12 
13         [STAThread]
14         public static void Main()
15         {
16             Application app = new Application();
17             app.Run(new FlipThroughTheBushes());
18         }
19 
20         public FlipThroughTheBushes()
21         {
22             //通过反射获取 Brushes 类定义的所有公有成员和静态成员
23             //BindingFlags 标识成员的类型，Brushes 只有Public 和 static 所以可以不用限制
24             props = typeof(Brushes).GetProperties(BindingFlags.Public | BindingFlags.Static);
25             //设置窗口标题和背景颜色
26             setTitleAndBackground();
27         }
28 
29         /// <summary>
30         /// 重写 OnKeyDown 事件
31         /// </summary>
32         /// <param name="e"></param>
33         protected override void OnKeyDown(KeyEventArgs e)
34         {
35             //根据上下方向键的动作来设定计数
36             if (e.Key == Key.Down || e.Key == Key.Up)
37             {
38                 index += e.Key == Key.Up ? 1 : props.Length - 1;
39                 
40                 index %= props.Length;
41                 //设置窗口标题和背景颜色
42                 setTitleAndBackground();
43             }
44             base.OnKeyDown(e);
45         }
46         /// <summary>
47         /// 设置窗口标题和背景颜色
48         /// </summary>
49         void setTitleAndBackground()
50         {
51             //在标题显示当前使用的颜色
52             Title = "Flip Through the Brushes -" + props[index].Name;
53             //设置背景色
54             //PropertyInfo[].GetValue(null,null) 在这里实际返回是的 SolidColorBrush 对象
55             Background = (Brush)props[index].GetValue(null, null);
56         }
57     }
58 
59     //知识：
60     //1、System.Window 命名空间 有 SystemColors 类其作用相似于 Colors 和 Brushes 只具有静态的只读property,返回Color值和SolidColorBrush对象。
61     //2、这些值存储在Windows的注册表中，可以由SystemColors.WindowColor 和 SystemColors.WindowTextBrush 获得用户对窗口工作区背景和文字颜色的喜好
62     //3、SystemColors返回的画刷是冻结的 可以 Brush brush=new SystemColorBrush(SystemColors.WindowColor); 但不能改变 Brush brush=SystemColors.WindowBrush; 这样的画刷
63     //4、继承自Freezable 的类对象有冻结的问题，但Color 是结构体，没有冻结的问题。
64     //5、SolidColorBrush 是单色画刷，渐变画刷是： LinearGradientBrush
65     
66     #endregion

 

 

第三个示例

 

  1     #region GradilteTheBrush P43
 2     
 3     /// <summary>
 4     /// 以渐变色填充窗口工作区
 5     /// </summary>
 6     public class GradialteTheBrush : Window
 7     {
 8         [STAThread]
 9         public static void Main()
10         {
11             Application app = new Application();
12             app.Run(new GradialteTheBrush());
13         }
14         public GradialteTheBrush()
15         {
16             Title = "Gradiate The Brush";
17             // 定义一个渐变色的画刷 ，LinearGradientBrush中 从 Point(0, 0)到 Point(1, 1)就是指从窗口工作区的右上角到左下角
18             //LinearGradientBrush brush = new LinearGradientBrush(Colors.Red, Colors.Blue, new Point(0, 0), new Point(1, 1));
19                        
20 
21             LinearGradientBrush brush = new LinearGradientBrush(Colors.Red, Colors.Blue, new Point(0, 0), new Point(0.25, 0.25));
22             brush.SpreadMethod = GradientSpreadMethod.Reflect;
23 
24             //指定为背景色
25             Background = brush;
26         }
27 
28     }
29 
30     //知识：
31     //1、WPF中的点是与设备无关的，WPF渐变画刷有特性是让你不用基于窗口尺寸来调整的点，默认情况下你指定的点是相对于表面的，这里的表面被视为一个单位宽一个单位高，即左上角为（0，0），右下角为（1，1）,左下角为（0，1） 右下角为（1，0）
32     //2、LinearGradientBrush 设置的渐变色效果是以两点进行连线，连线中点的颜色就是两点颜色的平均值，垂直与连线的线上的点颜色是相同的
33     //3、LinearGradientBrush 的重载版本中可以设置360度角度（angle）进行渐变填充 如 new LinearGradientBrush(Color1, Color2, angle）
34     //4、LinearGradientBrush 的重载版本中垂直渐变填充 如 new LinearGradientBrush(Color1, Color2, new Point(0, 0), new Point(1, 1)）
35     //5、LinearGradientBrush 的重载版本中任意角度渐变填充 如 new LinearGradientBrush(Color1, Color2, new Point(0, 0), new Point(cos(angle),sin(angle)));
36    
37     #endregion

 

 

第四个示例

 

  1     #region AdjustTheBrush P47
 2     
 3     /// <summary>
 4     /// 对角线为渐变中线的渐变画刷填充
 5     /// </summary>
 6     public class AdjustTheGradient : Window
 7     {
 8         LinearGradientBrush brush;
 9 
10         [STAThread]
11         static void Main()
12         {
13             Application app = new Application();
14             app.Run(new AdjustTheGradient());
15         }
16 
17         public AdjustTheGradient()
18         {
19             Title = "Adjust The Gradient";
20             SizeChanged += WindowOnSizeSizeChanged;
21             brush = new LinearGradientBrush(Colors.Red, Colors.Blue, 0);
22             brush.MappingMode = BrushMappingMode.Absolute;
23             Background = brush;
24         }
25 
26         void WindowOnSizeSizeChanged(object sender, SizeChangedEventArgs e)
27         {
28             double width = ActualWidth - 2 * SystemParameters.ResizeFrameVerticalBorderWidth;
29             double height = ActualHeight - 2 * SystemParameters.ResizeFrameHorizontalBorderHeight - SystemParameters.CaptionHeight;
30 
31             Point ptCenter = new Point(width / 2, height / 2);
32             Vector vectDiag = new Vector(width, -height);
33             Vector vectperp = new Vector(vectDiag.Y, -vectDiag.X);
34 
35             vectperp.Normalize();
36             vectperp *= width * height / vectDiag.Length;
37 
38             brush.StartPoint = ptCenter + vectperp;
39             brush.EndPoint = ptCenter - vectperp;
40         }
41 
42     }
43     //知识：
44     //1、  StartPoint 和 是LinearGradientBrush仅有的两个 property
45     //2、  LinearGradientBrush 可以使用 GradientBrush 定义的GradinetStops property 设置更多的颜色
46     //3、 new GradientStop(color1,offset);
47     
48     #endregion

 

 

第五个示例

 

  1     #region FollowTheRainbow P48
 2     
 3     /// <summary>
 4     /// 彩虹颜色的窗体
 5     /// </summary>
 6     class FollowTheRainbow:Window
 7     {
 8         [STAThread]
 9         static void Main()
10         {
11             Application app = new Application();
12             app.Run(new FollowTheRainbow());
13         }
14 
15         public FollowTheRainbow()
16         {
17             Title = "Follow The Rainbow";
18             LinearGradientBrush brush = new LinearGradientBrush();
19             brush.StartPoint = new Point(0, 0);
20             brush.EndPoint = new Point(1, 0);
21 
22             Background = brush;
23 
24             // 采用Rey G.Biv 的彩虹记住系统
25             brush.GradientStops.Add(new GradientStop(Colors.Red, 0));
26             brush.GradientStops.Add(new GradientStop(Colors.Orange, .17));
27             brush.GradientStops.Add(new GradientStop(Colors.Yellow,.33));
28             brush.GradientStops.Add(new GradientStop(Colors.Green, .5));
29             brush.GradientStops.Add(new GradientStop(Colors.Blue, .67));
30             brush.GradientStops.Add(new GradientStop(Colors.Indigo, .84));
31             brush.GradientStops.Add(new GradientStop(Colors.Violet, 1));
32         }
33 
34     }
35     
36     #endregion

 

 

第六个示例

 

  1     #region FollowTheRainbow P49
 2     
 3     /// <summary>
 4     /// 由内向处的彩虹颜色的窗体
 5     /// </summary>
 6     class ClrcleTheRainbow : Window
 7     {
 8         [STAThread]
 9         static void Main()
10         {
11             Application app = new Application();
12             app.Run(new ClrcleTheRainbow());
13         }
14 
15         public ClrcleTheRainbow()
16         {
17             Title = "Follow The Rainbow";
18             RadialGradientBrush brush = new RadialGradientBrush();
19             Background = brush;
20 
21             // 采用Rey G.Biv 的彩虹记住系统
22             brush.GradientStops.Add(new GradientStop(Colors.Red, 0));
23             brush.GradientStops.Add(new GradientStop(Colors.Orange, .17));
24             brush.GradientStops.Add(new GradientStop(Colors.Yellow, .33));
25             brush.GradientStops.Add(new GradientStop(Colors.Green, .5));
26             brush.GradientStops.Add(new GradientStop(Colors.Blue, .67));
27             brush.GradientStops.Add(new GradientStop(Colors.Indigo, .84));
28             brush.GradientStops.Add(new GradientStop(Colors.Violet, 1));
29         }
30 
31     }
32     
33     #endregion

 

 

第七个示例

 

  1     #region FollowTheRainbow P51
 2     
 3     /// <summary>
 4     /// 同心圆的渐变
 5     /// </summary>
 6     class ClickTheGradientCenter : Window
 7     {
 8         [STAThread]
 9         static void Main()
10         {
11             Application app = new Application();
12             app.Run(new ClickTheGradientCenter());
13         }
14         RadialGradientBrush brush;
15         public ClickTheGradientCenter()
16         {
17             Title = "Click The Gradient Center";
18             brush = new RadialGradientBrush(Colors.White,Colors.Red);
19             brush.RadiusX = brush.RadiusY = .10;
20             brush.SpreadMethod = GradientSpreadMethod.Repeat;
21             Background = brush;
22         }
23 
24         protected override void OnMouseDown(MouseButtonEventArgs e)
25         {
26             double width = ActualWidth - 2 * SystemParameters.ResizeFrameVerticalBorderWidth;
27             double height = ActualHeight - 2 * SystemParameters.ResizeFrameHorizontalBorderHeight - SystemParameters.CaptionHeight;
28 
29             Point ptMouse = e.GetPosition(this);
30             ptMouse.X /= width;
31             ptMouse.Y /= height;
32 
33             if (e.ChangedButton == MouseButton.Left)
34             {
35                 brush.Center = ptMouse;
36                 brush.GradientOrigin = ptMouse;
37             }
38             else if (e.ChangedButton==MouseButton.Right)
39             {
40                 brush.GradientOrigin = ptMouse;
41             }
42         }
43 
44     }
45     
46     #endregion

 

 

第八个示例

 

  1     #region FollowTheRainbow P52
 2 
 3     /// <summary>
 4     /// 同心圆的渐变
 5     /// </summary>
 6     class RotateTheGradientOrigin : Window
 7     {
 8         [STAThread]
 9         static void Main()
10         {
11             Application app = new Application();
12             app.Run(new RotateTheGradientOrigin());
13         }
14         RadialGradientBrush brush;
15         double angle;
16 
17         public RotateTheGradientOrigin()
18         {
19             Title = "Rotate The Gradient Origin";
20             this.WindowStartupLocation = WindowStartupLocation.CenterScreen;
21             Width = 384;
22             Height = 384;
23             brush = new RadialGradientBrush(Colors.White, Colors.Blue);
24             brush.RadiusX = brush.RadiusY = .10;
25             brush.SpreadMethod = GradientSpreadMethod.Repeat;
26             //Background = brush;
27             Background = new LinearGradientBrush(Colors.Red, Colors.Blue, new Point(0, 0), new Point(1, 1));
28 
29             //BorderBrush = Brushes.SaddleBrown;
30             //BorderThickness = new Thickness(25, 50, 75, 100);
31             BorderBrush = new LinearGradientBrush(Colors.Red, Colors.Blue, new Point(0, 0), new Point(1, 1));
32             BorderThickness = new Thickness(50);
33 
34             DispatcherTimer timer = new DispatcherTimer();
35             timer.Interval = TimeSpan.FromMilliseconds(100); ;
36             timer.Tick += timerOnTick;
37             timer.Start();
38         }
39 
40 
41 
42         void timerOnTick(object sender, EventArgs e)
43         {
44 
45             Point pt = new Point(.5 + .05 * Math.Cos(angle), .5 + .05 * Math.Sin(angle));
46             brush.GradientOrigin = pt;
47             angle += Math.PI / 6;//ie ,30 degrees
48         }
49     }
50 
51     #endregion

 

 

       本章主要是通过示例对WPF中各种画刷的使用进行了练习，通过这些练习熟悉了对简单画刷和渐变画刷的各种使用。

       贯例，帖张图作为对自己的奖励

        

 

       下一章将继续WPF学习之旅，内容就是 WPF中的 Content。