第章图形图像编程.ppt
《第章图形图像编程.ppt》由会员分享,可在线阅读,更多相关《第章图形图像编程.ppt(38页珍藏版)》请在三一文库上搜索。
1、第五篇 ASP.NET 高级编程,东鹏电子信息有限公司,2,内容,第 15 章 图形图像编程 第 16 章 ASP.NET 和 AJAX 第 17 章 ASP.NET MVC 基础,3,第 15 章 图形图像编程,主讲:Jayce_Zou,4,本章内容 主讲:Jayce_Zou,图形编程 绘制文字特效 绘制图片 图像特效处理,5,图像布局 主讲:Jayce_Zou,在页面布局中,很多设计人员喜欢使用 CSS 设计,这样能够简化页面代码,将页面布局代码和页面代码相分离,从而提高了维护性。 虽然随着技术的发展,越来越多的动态生成页面布局,以及动态生成图像的方法也越来越多的被开发人员和设计人员所认知
2、,但是开发人员和设计人员还是比较喜欢使用 CSS 和 IMG 标签进行页面布局,这是因为 CSS 和 IMG 标签都比较简单,可以说是“轻量级”的,即不需要页面进行逻辑处理也不需要动态生成。,6,IMG 标签 主讲:Jayce_Zou,IMG 标签是图像标签,IMG 标签属于 HTML 控件,在 Web 应用中可以看到在页面中包含大量的 IMG标签用于图形图像显示,示例代码如下所示: 使用 IMG 标签能够轻松的为网页添加图片,IMG 标签包括以下常用属性: Src:图片的地址,可以是图片的相对地址也可以是绝对地址。 Width:设定图片的宽度。 Height:设定图片的高度。 Alt:当图片
3、显示不了时提示的字符。 Border:图片的边框的宽度。 Align:图片的周片文字的对齐方式。 Title:当鼠标放在图片上出现的提示字符。,7,CSS 主讲:Jayce_Zou,通过 CSS 能够使用图像进行页面布局和样式控制。当需要使背景呈现渐变效果时,无需使用 JavaScript进行控制,可以直接使用 CSS 和图像进行搭配使用即可。CSS 背景属性包括: 背景颜色属性(background-color):该属性为 HTML 元素设定背景颜色。 背景图片属性(background-image):该属性为 HTML 元素设定背景图片。 背景重复属性(background-repeat)
4、:该属性和 background-image 属性连在一起使用,决定背景图片是否重复。如果只设置 background-image 属性,没设置 background-repeat 属性,在缺省状态下,图片既 x 轴重复,又 y 轴重复。 背景附着属性(background-attachment):该属性和 background-image 属性连在一起使用,决定图 片是跟随内容滚动,还是固定不动。 背景位置属性(background-position):该属性和 background-image 属性连在一起使用,决定了背景图片的最初位置。 背景属性(background):该属性是设置背景
5、相关属性的一种快捷的综合写法。,8,JavaScript 进行图像编程 主讲:Jayce_Zou,HTML 图像控件支持 JavaScript 进行图像操作,可以为图像控件进行事件处理,JavaScript 代码如下所示: function cut() /获取 ID 为 pic1 的图片的属性 var pic=document.getElementById(“pic1”) pic.width=100; /设置图片的宽度 pic.height=100; /设置图片的高度 上述代码获取图片ID 为pic1 的图片属性,当触发该事件后,ID 为 pic1 的图片的宽度和高度将变为 100。 为了让图
6、片被单击时触发该事件,则应该在 IMG 标签中声明该事件,代码如下所示: ,9,GDI+简介 主讲:Jayce_Zou,虽然通过 IMG 标签和 CSS、JavaScript 相配合能够进行图形图像开发,但是其功能有限,并不能够进行高级的图形图像开发。 GDI+是 Windows XP 中的一个子系统,它主要负责在显示屏幕和打印设备输出有关信息,它是一组通过C+类实现的应用程序编程接口。 GDI+的前身是 GDI,在 C+应用程序开发中,C+开发人员经常需要使用 GDI 进行窗口的绘制与重绘,在 Vista 操作系统之后的操作系统中,微软对图形图像编程进行了更新. 在 Vista 等系统中,大
7、量的使用了半透明、渐变、边缘模糊化等效果,这就要求在编程中强化图形图像渲染。,10,主讲:Jayce_Zou,GDI+相比与 GDI,进行了一些加强, 这些加强功能如下所示: 渐变的画刷(Gradient Brushes):GDI+允许开发人员使用渐变的画刷来绘制线条、图形以及外观。 基数样条函数(Cardinal Splines):GDI+支持基数样条函数而 GDI 不支持,基数样条能够防止锯齿的出现,使得窗口以及图形的绘制能够平滑过渡。 持久路径对象(Persistent Path Objects):在 GDI 中,绘制路径在窗口更改需要通过重绘来保持图形的持久化,而在 GDI+中,可以通
8、过创建对个对象来持久化。 变形和矩阵对象(Transformations Matrix Object):GDI+提供了强大的矩阵对象,开发人员可以通过矩阵对象进行图形的翻转、平移和缩放。 可伸缩区域(Scalable Regions):GDI+允许在一定的范围内进行任何图形变换。 GDI+不仅包括这些新特性,还包括混合以及等多种图像类型支持等特性。ASP.NET 相对于 ASP 的强大之处就在于 ASP.NET 可以使用 GDI+进行图形图像编程,实现不同的 Web 应用功能。,11,.NET Framework 绘图类 主讲:Jayce_Zou,GDI+包括很多的类、结构和枚举用于为开发人员
9、提供图形编程,这些类、结构和枚举都定义在命名空间中,这些命名控件如下所示: System.Drawing:提供对 GDI+基本图形图像功能的访问,提供了 Graphics 类进行图形图像处理。 System.Drawing.Drawing2D :提供了高级的二维图形和矢量图形的处理功能,使用 System.Drawing.Drawing2D 能够进行二维图形和二维游戏的开发和编写。 System.Drawing.Imaging:主要提供了图像处理的功能,例如将图像进行锐化处理,或者将图像 变成黑白色或底片都可以通过使用该命名空间的方法。 System.Drawing.Text:提供高级的文字处
10、理及排版功能,能够实现 Word 中艺术字的效果。 System.Drawing.Printing:提供图形打印所需要的类。 System.Drawing.Design:提供开发 UI 设计时所需要的类。,12,类和方法 主讲:Jayce_Zou,System.Drawing 命名空间提供的类如下所示: Bitmap:在 Bitmap 上使用图形工具,并在其中存储图形图像的绘图面板。 Graphics:提供直线、曲线、多边形等绘画方法,也提供对一些位图的处理,例如平移、缩放等。 Pen:提供直线、曲线等功能需要的画笔属性。 Brush:提供文本填充和图形绘画,可以填充图形如圆形、椭圆形和多边形
11、。 Color:提供颜色的枚举,用于定义 Pen 和 Brush 的颜色。 Font:提供文本的字体属性,定义文本的字体类型、样式和大小等。 Point:用于定义有序的坐标对,这些坐标能够定义二维平面上的点。 Size:定义区域的大小。 Image:用于支持位图、指针和图标等文件类型。 Rectangle:用于定义矩形区域。 StringFormat:用于定义文本在位图上的对齐方式等属性。,13,主讲:Jayce_Zou,简而言之,Bitmap 就相当于绘画时需要的纸,图形能够绘画到纸上面。 而 Graphics 相当于绘画的人, 因为人能够提供只写、曲线、多边形等绘画方法。 而 Pen 和
12、Brush 相当于绘画工具,如铅笔、笔刷等。 Color 就相当于是绘画所需要的颜料。 在绘画过程中: 首先需要使用一张纸,固定到绘画板上, 然后有一个人能够进行绘画,这个人能够进行素描、水彩等绘画。 但是在绘画前,需要给这个人基本的工具,包括铅笔、笔刷和颜料盘等。 在这些基 本物质准备完毕后,就能够开始绘制了。,14,Graphics 类的属性 主讲:Jayce_Zou,DpiX:获取对象的水平分辨率。 DpiY:获取对象的垂直分辨率。 IsClipEmpty:为对象指定裁剪区域。 IsVisibleClipEmpty;判断裁剪区域是否为空。 TextGammaValue:返回一个提供文本灰
13、度值的信息的整数值。 TextRenderingHint:获取或设置与该图形相关联的文本着色模式。 通过 Graphics 类的属性能够获取 Graphics 对象的水平分辨率和垂直分辨率,并能够为 Graphics 对象进行裁剪区域的选择和判断。,15,Graphics 类的方法 主讲:Jayce_Zou,Dispose:删除图形并释放已分配的内存。 DrawArc:绘制弧线。 DrawBezier:绘制后三次贝塞尔曲线。 DrawClosedCurve:绘制封闭曲线。 DrawCurve:绘制曲线。 DrawEllipse:绘制椭圆。 DrawIcon:绘制图标图像。 DrawIconUn
14、stretched:绘制图标图像,并可将图像缩放到指定大小。 DrawImage:绘制图像。 DrawImageUnscaled:绘制图像,并可将图像缩放到指定大小。 DrawImageUnscaledAndClipped:在不进行缩放的情况下进行图像绘制。,16,主讲:Jayce_Zou,DrawLine:绘制线条。 DrawPie:绘制扇形。 DrawPolygon:绘制多边形。 DrawRectangle:绘制矩形。 DrawString:绘制字符串。 FillClosedCurve:填充封闭曲线的内部区域。 FillEllipse:填充椭圆内部。 FillPath:填充 Graphic
15、sPath 内部。 FillPie:填充扇形内部。 Restore:恢复图形状态。 Save:保存图形。 SetClip:为对象设置剪辑区域。,17,绘制线条 主讲:Jayce_Zou,示例代码如下所示: Bitmap images = new Bitmap(200, 200); /创建画纸 Graphics gr = Graphics.FromImage(images); Pen pen = new Pen(Color.Red, 5); /创建画笔 gr.Clear(Color.White); /设置画笔的颜色 gr.DrawLine(pen, 0, 0, 200, 200); /开始绘画
16、images.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg); gr.Dispose(); /释放绘图对象 images.Dispose(); /释放图形对象,18,绘制矩形 主讲:Jayce_Zou,绘制矩形的方法同绘制线条基本相同,但是绘制矩形不仅要指定矩形的坐标,还需要指定矩形的高度和宽度,示例代码如下所示: Bitmap images = new Bitmap(400, 400); /创建画纸 Graphics gr = Graphics.FromImage(images); Pen pen =
17、new Pen(Color.Red, 5); /创建画笔 gr.Clear(Color.White); /设置画笔颜色 gr.DrawLine(pen, 0, 0, 200, 200); /绘制线条 gr.DrawRectangle(pen, 200, 200, 50, 50); /绘制矩形 images.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg); gr.Dispose(); images.Dispose();,19,绘制椭圆 主讲:Jayce_Zou,绘制椭圆的方法只需要使用 DrawEllips
18、e 方法即可,示例代码如下所示: gr.DrawEllipse(pen, 0, 0, 300, 200); /绘制椭圆 上述代码绘制了一个椭圆形,该椭圆形绘制的起点为(0,0),宽度为 300,高度为 200。 DrawEllipse方法同 DrawRectangle 方法基本相同,因为这两个方法都包括五个参数,这 5 个参数都需要指定绘制起点、 宽度和高度。当需要绘制圆形时,只需要将宽度和高度设置相等即可,示例代码如下所示: gr.DrawEllipse(pen, 0, 0, 200, 200); /绘制圆 当设置宽度和高度相等时,该椭圆就会以圆形呈现,上述代码就实现了圆形的绘制。,20,绘
19、制多边形 主讲:Jayce_Zou,绘制多边形的方法只需要使用 DrawPolygon 方法即可,与绘制规则图形不同的是,绘制多边形需要指定多边形的各个节点,DrawPolygon 方法通过获取这些节点即可组成一个多边形,示例代码如下所示: Point pt1 = new Point(50, 50); /设置节点 Point pt2 = new Point(150, 150); /设置节点 Point pt3 = new Point(200, 200); /设置节点 Point pt4 = new Point(350, 170); /设置节点 Point pt5 = new Point(90,
20、 30); /设置节点 Point pt6 = new Point(180, 90); /设置节点 Point pts = pt1, pt2, pt3, pt4, pt5, pt6 ; /设置节点组 gr.DrawPolygon(pen, pts); /绘制多边形,21,绘制文字 主讲:Jayce_Zou,通过使用 DrawString 方法能够绘制文字并呈现在图像中,示例代码如下所示: Font font = new Font(“宋体”, 20); /创建文字对象 Brush brush=new SolidBrush(Color.Red); /创建笔刷对象 gr.DrawString(“我的
21、字符串“, font, brush, 200,200); /绘制文字 使用 DrawString 方法,需要对 DrawString 方法进行参数传递,DrawString 方法需要五个参数,其中包括需要输出的字符串、文本格式对象、笔刷对象以及文字开始绘制的坐标。 上述代码中,输出字串为“我的字符串”。文本格式通过 Font 默认构造函数构造,并在坐标为(200,200)位置开始绘制。,22,图形绘制实例 主讲:Jayce_Zou,protected void Page_Load(object sender, EventArgs e) Bitmap images = new Bitmap(40
22、0, 400); /创建画纸 Graphics gr = Graphics.FromImage(images); /创建绘图类 Pen pen = new Pen(Color.Red, 5); /创建画笔 gr.Clear(Color.White); /绘制直线 gr.DrawLine(pen, 0, 0, 200, 200); /绘制矩形 gr.DrawRectangle(pen, 200, 200, 50, 50); /绘制椭圆 gr.DrawEllipse(pen, 0, 0, 300, 200); /绘制多边形 Point pt1 = new Point(50, 50); /设置节点
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 图形图像 编程
链接地址:https://www.31doc.com/p-2631810.html