图形、图像与多媒体.doc

第18章 图形、图像与多媒体18.1 最简单的图形现代的计算机软件设计往往是图形、图象和多媒体的组合，有效地利用声音、图象可以更好的展示软件的界面，给用户一个良好的操作环境。C+Builder 的集成开发环境中，已经作好一些最简单的图形构件,在使用的时候顺便加入到你的程序就可以了,常用作修饰界面的图形构件有: GroupBox、Panel、Bevel、Shape等，只要在设计程序时多加注意，还可以发现其它构件也可以作为图形加入到应用程序的窗体上，这些构件在窗体设计时加入时根本就不需要代码，只要设置相应的属性即可。Shape构件的shape属性值：stCircle圆、stEllipse椭圆、stRectangle矩形（默认）、stRoundRect圆角矩形、stRoundSquare圆角正方形、stSquare、正方形。还可以设置它的Color属性、Pen属性。Bevel构件的shape属性值：bsBox 方形、bsFrame框架型、bsTopLine顶线、bsBottomLine底线、bsLeftLine左边线、bsRightLine右边线、bsSpacer虚线。 GroupBox、Panel构件也有几个属性可以显示在窗体上，得到不同的效果，这里想要提示的有两点：一是这些属性既是设计属性也是运行属性，你可以在设计时设置，也可以在运行是用代码设置和改变，用法非常简单；二是作为初学者往往对图形、图象和颜色着迷，在应用程序的界面上设置大量的图形，或者应用了很多的颜色，最终效果并不理想。在计算机显示卡上颜色是由红（Red）、绿（Green）和蓝（Blue）三中颜色组合而成的，常用的RGB值表如下。常用的RGB值表RGB颜色000黑色00255蓝色02550绿色0255255青色25500红色2550255紫色2552550黄色255255255白色在C+Builder中对构件的颜色处理代码如图18.1所示： Shape1-Color=0X00FF00FF R G B 图18.1C+Builder中对构件的颜色处理处理画刷的代码如下： Shape1-Brush-Color=RGB(255,255,255) ;/代表白色画刷因为这些常数对编程人员来讲很难记忆，C+Builder又定义一些符号常量代表常用的颜色，如下表：常数颜色常数颜色clAqua浅绿色Aqua clMaroon 褐紫红色Maroon clBlack 黑色BlackclNavy深蓝色Navy Blue clBlue 蓝色BlueclOlive橄榄色Olive Green clDkGray 暗灰色Dark GrayclPurple紫色Purple clFuchsia 深红色FuchsiaclRed红色Red clGray 灰色GrayclSilver银色SilverclGreen绿色GreenclTeal蓝绿色TealclLime灰绿色Lime GreenclWhite白色WhiteclLtGray亮灰色Light GrayclYellow黄色Yellow在程序中巧妙地应用这些方法，也可以完成一些比较有效的图形功能。18.2 绘图的初步体验XOYO为屏幕坐标原点，X为横向坐标，Y为纵向坐标。要实现窗体图形的绘制，必须了解计算机屏幕坐标的设置如图18.2: 图18.2计算机屏幕坐标的设置下面设计一个简单画矩形程序，窗体上放置一个按钮，按钮的事件处理代码为：void _fastcall TForm1:Button1Click(TObject *Sender) Canvas-Pen-Color=clRed; /设置画笔颜色 Canvas-Pen-Width=12; /设置画笔宽度 Canvas-Rectangle(50,50,350,350); /画矩形 为了说明上述方法，下面在窗体上放一个按钮，产生事件处理代码如下：void _fastcall TForm1:Button2Click(TObject *Sender)Canvas-Pie(50,50,350,200,50,50,260,200);在屏幕上产生一个扇形图。以下的几个代码段分别画出不同的图形。void _fastcall TForm1:Button3Click(TObject *Sender)Canvas-Pen-Color = clBlue; /设置画笔颜色Canvas-MoveTo( 10, 10 ); /画线起点Canvas-LineTo( 100, 100 ); /画线终点Canvas-Brush-Color = clBtnFace; /画刷颜色Canvas-Font-Name = 仿宋; /字体设置Canvas-Font-Size=18; /字体大小Canvas-TextOut( Canvas-PenPos.x, Canvas-PenPos.y,”画线到这里结束 );void _fastcall TForm1:Button4Click(TObject *Sender) for (int i = 10; i Pixelsi10 = clRed; for (int i = 10; i Pixelsi50 = clRed; void _fastcall TForm1:Button5Click(TObject *Sender) TRect R = GetClientRect(); /在当前窗体上画带弦的弧 Canvas-Chord(R.Left, R.Top, R.Right, R.Bottom, R.Right, R.Top, R.Left, R.Top);void _fastcall TForm1:Button5Click(TObject *Sender)Graphics:TBitmap *Bitmap;TRect MyRect, MyOther; /动态显示一个位图MyRect = Rect(10,10,500,500);MyOther = Rect(10,111,100, 201);Bitmap = new Graphics:TBitmap;Bitmap-LoadFromFile(c:未命名.bmp); /任意找一个图像代替Form1-Canvas-BrushCopy(MyRect, Bitmap, MyRect, clBlack);Form1-Canvas-CopyRect(MyOther, Bitmap-Canvas, MyRect);delete Bitmap;void _fastcall TForm1:Button1Click(TObject *Sender)Graphics:TBitmap *pBitmap = new Graphics:TBitmap(); try pBitmap-LoadFromFile(c:未命名.bmp); /任意找一个图像代替 pBitmap-Transparent = true; pBitmap-TransparentColor = pBitmap-Canvas-Brush-Color; Form1-Canvas-Draw(0,0,pBitmap); pBitmap-TransparentMode = tmAuto; Form1-Canvas-Draw(50,50,pBitmap); catch (.) ShowMessage(不能加载位图文件); delete pBitmap;有了对图形的认识，现在介绍Canvas，Canvas是构件PaintBox的一个重要属性，这个构件提供了一个画布，可以限定在窗体的某个区域内绘图，Canvas是TCanvas类的实例，从上面的简单例子程序中已经看到Canvas在绘图中的作用，表18.1给出TCanvas类的主要属性，表18.2出TCanvas类的主要方法。表18.1 TCanvas类的主要属性属性功能Brush填充到画面的画刷颜色ClipRect对画布剪去矩形，将绘图限制在这个矩形中CopyMode确定进行绘图的方式（AND、OR、XOR等）Font画布上的字体Handle画布的句柄，直接调用windows API函数Pen确定画布上绘图的线型和颜色PenPos当前绘图位置的X和Y坐标Pixels当前绘画的颜色表18.2 TCanvas类的主要方法方法功能Arc用当前画笔在画布上画圆弧CopyRect复制部分图到画布上BrushCopy用当前画刷颜色复制部分图到画布上Chord在当前窗体上画带弦的弧Draw将内存位图复制到画布上DrawFocusRect画带焦点的矩形Ellipse画椭圆，并用当前画刷填充Free释放对象内存FloodFill用当前画刷填充画布区域LineTo画线起点MoveTo画线终点Pie画饼图Polygon画多边形，并填充Polyline画折线，不自动闭合Rectangle画矩形Refresh刷新RoundRect画圆角矩型StretchDraw将内存位图复制到画布上，根据位图大小变化TextOut在当前指定位置上写文本TextExtent返回Text参数字串的高和宽TextHeight返回Text参数字串的高TextRect在矩形上写文本 在绘图中常用到画笔Pen和画刷Brush，它们分别是TPen和TBrush类的实例也有几个常用的属性，表18.3给出Tpen类的属性和表18.4给出TBrush类的属性。表18.3给出TPen类的属性属性功能Color设置画笔颜色Handle画笔句柄，用于直接调用windows API函数Mode画线的方法（AND、OR、XOR等）Style笔的样式（实线、点线、划线、清除等）Width画笔的像素数表18.4给出TBrush类的属性属性功能Bitmap画刷背景位图Color设置画刷颜色Handle画刷句柄，用于直接调用windows API函数Style画刷样式（实心、清除或其它）18.3窗体上任意正三角形图形的绘制在掌握简单绘图方法以后，就可以进行绘制程序的编制了，本例用一个在窗体上绘制任意正三角形程序说明C+Builder中的绘图方法，本程序和Windows提供的画板程序相似，可以在屏幕上画一个任意的正三角形。正三角形是三条边相等的三角形，要实现屏幕绘制正三角形，需要解决的问题是三个边的顶点位置，而顶点位置坐标可以用正三角形的中心坐标和边长表示。所以问题已经转化为设置一个正三角形中心和边长，由此计算出三个顶点的坐标，画三条直线。如图18.3计算屏幕坐标.x=px+length*sin(60*pi/180)y=py+length*cos(60*pi/180)x=px+length*sin(300*pi/180)y=py+length*cos(300*pi/180)x=px+length*sin(180*pi/180)y=py+length*cos(180*pi/180)px,py图18.3计算屏幕坐标.void _fastcall TForm1:FormActivate(TObject *Sender) Canvas-Pen-Width = 2; Canvas-Brush-Style=bsClear; Canvas-Pen-Color=clRed; Canvas-Pen-Mode=pmXor;int px,py,status,counter;void _fastcall TForm1:FormMouseDown(TObject *Sender, TMouseButton Button, TShiftState Shift, int X, int Y) px = X; py = Y; status = 1; counter=0;void triangle(int x,int y,float length,float angle) static rx1, ry1, rx2, ry2, rx3, ry3; if(counter = 1) Form1-Canvas-MoveTo(rx1,ry1); Form1-Canvas-LineTo(rx2,ry2); Form1-Canvas-LineTo(rx3,ry3); Form1-Canvas-LineTo(rx1,ry1); if(counter = 0) counter = 1; float pi = 3.14159; int x1 = x + length * sin(angle * pi / 180); int y1 = y + length * cos(angle * pi / 180); int x2 = x + length * sin(angle + 120) * pi / 180); int y2 = y + length * cos(angle + 120) * pi / 180); int x3 = x + length * sin(angle + 240) * pi / 180); int y3 = y + length * cos(angle + 240) * pi / 180); Form1-Canvas-MoveTo(x1,y1); Form1-Canvas-LineTo(x2,y2); Form1-Canvas-LineTo(x3,y3); Form1-Canvas-LineTo(x1,y1); rx1 = x1; ry1 = y1; rx2 = x2; ry2 = y2; rx3 = x3; ry3 = y3;void _fastcall TForm1:FormMouseMove(TObject *Sender, TShiftState Shift, int X, int Y) float r,s; if(status = 1) s=(X-px)*(X-px)+(Y-py)*(Y-py); r=sqrt(s); /计算边长 triangle(px,py,r,180); void _fastcall TForm1:FormMouseUp(TObject *Sender, TMouseButton Button, TShiftState Shift, int X, int Y) status=0;运行程序,用鼠标可以在窗体上画任意正三角形。18.4 屏幕坐标表示画正三角形毫无疑问，屏幕坐标表示画三角形或其它图形的方法和上例的方法是完全相同的，只是计算顶点的坐标不同，计算出的屏幕坐标画三条直线即可。图18.4px,pyX=px+Length*sin(pi/6)Y=py+length*cos(pi/6)X=px-Length*sin(pi/6)Y=py+length*cos(pi/6)图18.4 屏幕坐标表示正三角形采用屏幕坐标的方法只要将上例中的部分代码if(counter = 0) counter = 1; float pi = 3.14159; int x1 = x + length * sin(angle * pi / 180); int y1 = y + length * cos(angle * pi / 180); int x2 = x + length * sin(angle + 120) * pi / 180); int y2 = y + length * cos(angle + 120) * pi / 180);int x3 = x + length * sin(angle + 240) * pi / 180); int y3 = y + length * cos(angle + 240) * pi / 180);替换为下述代码就可以了if(counter = 0) counter = 1; float pi = 3.14159/6; / 直接算出pi，减少计算量 int x1 = px; int y1 = py; int x2 = px + length * sin(pi); int y2 = py + length * cos(pi); int x3 = px - length * sin(pi); int y3 = py + length * cos(pi);通过上述两个例子，可以看到同一个问题，往往有多种解决方案，在实际应用中，需要对系统的时间和空间整体效率加以考虑，有时侯不同的计算方法，在程序的效率会有很大差别。18.5 图形的动画技巧关于图形和图象的静态设置,在前面已经多次用到，下面介绍图形的动画技巧,在本例中将动态生成一个正方形，随着时间推移，正方形不断扩大，当到一定程度时重新开始，反复进行。 窗体设计如图18.5：图18.5图形的动画技巧相应的事件处理代码如下：bool flag=0; int x1, y1,x2,y2;void _fastcall TForm1:Button1Click(TObject *Sender) Canvas-Pen-Color=clRed; Canvas-Pen-Width=3; / Canvas-Pen-Mode=pmXor; /比较屏蔽此句和不屏蔽此句的异同 flag=1; x1=x2=y1=y2=200;void _fastcall TForm1:Timer1Timer(TObject *Sender) if(flag=1) x1-=1;y1-=1;x2+=1;y2+=1; Canvas-Rectangle(x1,y1,x2,y2); if(x2400) x1=x2=y1=y2=200;18.6 图象的动画技巧为了演示本程序，需要制作一系列图片，本例的图片是从比较流行的“拖拉机”游戏中截取的十三张扑克牌。在窗体上放置一个Image构件、一个Timer构件，Timer的事件处理器代码为：int i=0;void _fastcall TForm1:Timer1Timer(TObject *Sender)switch (i)case 1: Image1-Picture-LoadFromFile(c:图片命名 1.bmp) ;break;case 2: Image1-Picture-LoadFromFile(c:图片命名 2.bmp) ;break;case 3: Image1-Picture-LoadFromFile(c:图片命名 3.bmp) ;break;case 4: Image1-Picture-LoadFromFile(c:图片命名 4.bmp) ;break;case 5: Image1-Picture-LoadFromFile(c:图片命名 5.bmp) ;break;case 6: Image1-Picture-LoadFromFile(c:图片命名 6.bmp) ;break;case 7: Image1-Picture-LoadFromFile(c:图片命名 7.bmp) ;break;case 8: Image1-Picture-LoadFromFile(c:图片命名 8.bmp) ;break;case 9: Image1-Picture-LoadFromFile(c:图片命名 9.bmp) ;break;case10: Image1-Picture-LoadFromFile(c:图片命名 10.bmp) ;break;case11: Image1-Picture-LoadFromFile(c:图片命名11.bmp) ;break;case12: Image1-Picture-LoadFromFile(c:图片命名 12.bmp) ;break;case 13: Image1-Picture-LoadFromFile(c:图片命名 13.bmp) ;break; i+;if(i=14)i=1;这样执行程序后，Image上连续地循环显示十三张扑克牌，如果将十三张扑克牌换作相互连续变化的图象，就可以得到一系列逐渐变化的图象。18.7 播放声音文件下面的例程演示声音文件的播放，在窗体上放置一个Animate构件Animate1，一个OpenDialog构件OpenDialog1，四个按钮Button，设置按钮的Caption属性分别如图18.6图18.6播放AVI文件程序代码如下:#include #pragma hdrstop#include Unit1.h#pragma package(smart_init)#pragma resource *.dfmTForm1 *Form1;_fastcall TForm1:TForm1(TComponent* Owner) : TForm(Owner)void _fastcall TForm1:Button1Click(TObject *Sender)Animate1-Play(1,Animate1-FrameCount ,1);void _fastcall TForm1:Button2Click(TObject *Sender)Animate1-Stop();int frame=1;void _fastcall TForm1:Button3Click(TObject *Sender)Animate1-Seek(frame);frame+;if(frameAnimate1-FrameCount ) frame=1; void _fastcall TForm1:Button4Click(TObject *Sender)OpenDialog1-Title =打开一个影音AVI文件;/OpenDialog1-Filter=影音文件|*.AVI;*.avi; /分别比较此句和下/一句异同OpenDialog1-Filter=影音文件 (*.AVI;*.avi);if (OpenDialog1-Execute() Animate1-F