第10章 Applet编程.ppt

第第10章章 Applet编程编程 本章学习重点l熟悉熟悉Applet技术。技术。l掌握掌握Applet的开发步骤的开发步骤。l理解理解Applet小程序的生命周期。小程序的生命周期。l掌握掌握Graphics类的用法。类的用法。lHTML基础基础Applet概述概述 lAppletApplet技术一出现，互联网立刻焕发出无限的生技术一出现，互联网立刻焕发出无限的生机，因为机，因为AppletApplet不仅可以生成绚丽多彩的不仅可以生成绚丽多彩的WebWeb页面、页面、进行良好的人机交互，同时还能处理图形图像、进行良好的人机交互，同时还能处理图形图像、声音、视频和动画等多媒体数据，随即它吸引了声音、视频和动画等多媒体数据，随即它吸引了全世界编程者的目光，全世界编程者的目光，JavaJava语言也正因此火热流语言也正因此火热流行起来，可见行起来，可见AppletApplet在在JavaJava的发展过程中起到不的发展过程中起到不可估量的推动作用。可估量的推动作用。Applet开发步骤开发步骤 lApplet的开发步骤大致可以分为以下三个步骤：l（1）用UltraEdit或Notepad等纯文本软件编辑Java Applet源程序。l（2）利用javac编译器将Applet源程序转换成class字节码文件。l（3）编写HTML页面，并通过APPLET/APPLET标签引用上述字节码文件。一个简单的例子一个简单的例子 import java.awt.*;import java.applet.*;public class HelloApplet extends Applet public void paint(Graphics g)g.drawString(Hello!,10,10);g.drawString(Welcome to Applet Programming!,30,30);HTML网页网页Hello Applet嵌入网页效果嵌入网页效果Applet技术解析技术解析 lAppletApplet类是用户编写的类是用户编写的appletapplet小程序的小程序的基类，该基类的继承关系如下图所示。基类，该基类的继承关系如下图所示。Applet生命周期生命周期lAppletApplet小程序的生命周期相对于小程序的生命周期相对于ApplicationApplication而言较为复杂。在而言较为复杂。在其生命周期中涉及到其生命周期中涉及到AppletApplet类的四个方法：类的四个方法：initinit（）、（）、startstart（）（）、stopstop（）和（）和destroydestroy（），（），AppletApplet的生命周期中有相对应的四的生命周期中有相对应的四个状态：初始态、运行态、停止态和消亡态。当程序执行完个状态：初始态、运行态、停止态和消亡态。当程序执行完initinit（）方法以后，（）方法以后，AppletApplet小程序就进入了初始态；然后立刻执行小程序就进入了初始态；然后立刻执行startstart（）方法，（）方法，AppletApplet小程序进入运行态；当小程序进入运行态；当AppletApplet小程序所在的浏小程序所在的浏览器图标化或者是转入其它页面时，该览器图标化或者是转入其它页面时，该AppletApplet小程序立刻执行小程序立刻执行stop stop（）方法，使（）方法，使AppletApplet小程序进入停止态；在停止态中，如小程序进入停止态；在停止态中，如果浏览器又重新加载该果浏览器又重新加载该AppletApplet小程序所在的页面，或者是浏览器小程序所在的页面，或者是浏览器从图标中还原，则从图标中还原，则AppletApplet小程序又会调用小程序又会调用startstart（）方法，进入（）方法，进入运行态；不过，在停止态时，若浏览器被关闭，则运行态；不过，在停止态时，若浏览器被关闭，则AppletApplet小程序小程序会调用会调用destroydestroy（）方法，使其进入消亡态。（）方法，使其进入消亡态。paint（）方法（）方法 AppletApplet小程序的窗口绘制通常是由小程序的窗口绘制通常是由paintpaint（）方法（）方法来完成的。来完成的。paintpaint（）方法在小程序执行后会被自行调（）方法在小程序执行后会被自行调用，并且以后在遇到窗口缩小化后再恢复或者被其他用，并且以后在遇到窗口缩小化后再恢复或者被其他窗口遮挡后再恢复情形，它都会被自动调用，以重新窗口遮挡后再恢复情形，它都会被自动调用，以重新绘制窗口。绘制窗口。paintpaint（）方法包含一个（）方法包含一个GraphicsGraphics类的参数对象，类的参数对象，这个对象可以被用来输出文本、绘制图形、显示图像这个对象可以被用来输出文本、绘制图形、显示图像等。该方法的格式如下：等。该方法的格式如下：public void public void paint(Graphicspaint(Graphics g)g)/编写代码编写代码 Applet多媒体编程多媒体编程-文字文字 import java.awt.*;import java.applet.*;public class TextApplet extends Applet Font f1=new Font(Times New Roman,Font.PLAIN,12);Font f2=new Font(宋体宋体,Font.BOLD,24);Font f3=new Font(黑体黑体,Font.BOLD,36);Color c1=new Color(255,0,0);/红色红色 Color c2=new Color(0,255,0);/绿色绿色 Color c3=new Color(0,0,255);/蓝色蓝色 public void paint(Graphics g)g.setFont(f1);g.setColor(c1);g.drawString(Times New Roman,20,30);g.setFont(f2);g.setColor(c2);g.drawString(宋体宋体,20,60);g.setFont(f3);g.setColor(c3);g.drawString(黑体黑体,20,120);Applet多媒体编程多媒体编程-图形图形 import java.awt.*;import java.applet.*;public class LineApplet extends Applet public void paint(Graphics g)int x1,y1,x2,y2;x1=10;y1=10;x2=100;y2=100;g.drawLine(x1,y1,x2,y2);Applet多媒体编程多媒体编程-图形图形import java.awt.*;import java.applet.*;public class RectApplet extends Applet public void paint(Graphics g)g.drawRect(10,10,60,60);g.fillRect(80,10,60,60);Applet多媒体编程多媒体编程-图形图形import java.awt.*;import java.applet.*;public class PolyApplet extends Applet public void paint(Graphics g)int x =30,90,100,140,50,60,30;int y =30,70,40,70,100,80,100;int pts=x.length;g.drawPolygon(x,y,pts);import java.applet.*;public class LampApplet extends Applet public void paint(Graphics g)/绘制灯上的黑点绘制灯上的黑点 g.fillArc(78,120,40,40,63,-174);g.fillArc(173,100,40,40,110,180);g.fillOval(120,96,40,40);/绘制灯的上下轮廓绘制灯的上下轮廓 g.drawArc(85,157,130,50,-65,312);g.drawArc(85,87,130,50,62,58);/绘制灯的左右轮廓绘制灯的左右轮廓 g.drawLine(85,177,119,89);g.drawLine(215,177,181,89);/绘制灯柱线绘制灯柱线 g.drawLine(125,250,125,160);g.drawLine(175,250,175,160);/绘制底座绘制底座 g.fillRect(10,250,260,30);图像图像 import java.awt.*;import java.applet.*;public class PicApplet extends Applet Image pic;/图像对象图像对象 public void init()pic=getImage(getCodeBase(),fish.jpg);/获得图片获得图片 public void paint(Graphics g)g.drawImage(pic,30,30,this);声音声音 import java.awt.*;import java.applet.*;public class AudioApplet extends Applet AudioClip audio;/声音对象声音对象 public void init()audio=getAudioClip(getCodeBase(),fire.au);/获得声音获得声音 public void paint(Graphics g)g.drawString(循环播放声音的循环播放声音的Applet小程序小程序,30,30);public void start()audio.loop();/循环播放声音循环播放声音 public void stop()audio.stop();/停止播放停止播放 动画动画 l 所谓动画就是通过连续播放一系列画面，给所谓动画就是通过连续播放一系列画面，给视觉造成连续变化的图画，这是动画最基本的原视觉造成连续变化的图画，这是动画最基本的原理。理。l 在屏幕上显示一系列连续动画的第一帧图像，在屏幕上显示一系列连续动画的第一帧图像，然后每隔很短的时间再显示下一帧图像，如此往然后每隔很短的时间再显示下一帧图像，如此往复，利用人眼视觉的暂停现象，感觉画面的物体复，利用人眼视觉的暂停现象，感觉画面的物体在运动。在运动。用多线程实现动画文字用多线程实现动画文字 l在在JavaJava中实现多线程有两种方法：一种是继承中实现多线程有两种方法：一种是继承ThreadThread类；另外一种是实现类；另外一种是实现RunnableRunnable接口，对接口，对于于AppletApplet小程序，我们一般是实现小程序，我们一般是实现RunnableRunnable接接口。实现动画文字与实现动画的方法是一样的，口。实现动画文字与实现动画的方法是一样的，可以通过实现可以通过实现RunnableRunnable接口来实现多线程绘出接口来实现多线程绘出动画文字，使文字像打字一样一个文字一个文动画文字，使文字像打字一样一个文字一个文字地跳出来，然后全部隐去，再重复显示文字，字地跳出来，然后全部隐去，再重复显示文字，实现打字效果。实现打字效果。显示动画显示动画 public class MovingImg extends AppletImage img0,img1;int x=10;public void init()img0=getImage(getCodeBase(),T5.gif);img1=getImage(getCodeBase(),T1.gif);public void paint(Graphics g)g.drawImage(img0,0,10,this);g.drawImage(img1,x,30,this);g.drawImage(img0,0,60,this);tryThread.sleep(50);x+=5;if(x=550)x=10;Thread.sleep(1500);catch(InterruptedException e)repaint();l运行上述运行上述Applet时画面有闪烁的现象。一般来时画面有闪烁的现象。一般来说，画面越大，闪烁越严重。说，画面越大，闪烁越严重。l避免闪动的方法有两个，一是通过覆盖避免闪动的方法有两个，一是通过覆盖update()方法，二是使用方法，二是使用buffer屏幕缓冲区。屏幕缓冲区。l若画面较大，只使用若画面较大，只使用update()以背景色清除显以背景色清除显示区的时间就较长，不可避免地会产生闪烁，示区的时间就较长，不可避免地会产生闪烁，可以通过双缓冲技术，有效地消除闪烁。可以通过双缓冲技术，有效地消除闪烁。显示动画显示动画 双缓冲技术简介双缓冲技术简介 l双缓冲技术在显示动画之前，首先创建两个图形双缓冲技术在显示动画之前，首先创建两个图形缓冲区，一个为前台的显示缓冲，一个为后台的缓冲区，一个为前台的显示缓冲，一个为后台的图形缓冲，然后在显示（绘制）图形时，对两个图形缓冲，然后在显示（绘制）图形时，对两个缓冲区进行同步的图形数据更新，该操作相当于缓冲区进行同步的图形数据更新，该操作相当于为前台显示区的数据作了一个后台的图形数据备为前台显示区的数据作了一个后台的图形数据备份，当前台显示区的图形数据需要恢复时，可以份，当前台显示区的图形数据需要恢复时，可以用后台备份的图形数据来恢复，其具体方法则是用后台备份的图形数据来恢复，其具体方法则是重写重写paint()和和update()方法，将备份好的图形数方法，将备份好的图形数据一次性地画到显示屏幕上。据一次性地画到显示屏幕上。Applet/HelloWorld.java import java.awt.*;import java.applet.*;public class HelloWorld extends Appletpublic void paint(Graphics g)g.setColor(Color.blue);g.drawRect(10,10,100,150);g.drawString(Hello World,25,50);Applet与与HTML Example 演示演示在线计算器在线计算器 HTML简介简介lHTML入门入门 l HTML基本构架基本构架l页面布局与文字设计页面布局与文字设计l列表列表l 多媒体效果多媒体效果 l TABLE表格表格HTML入门入门lHTML英语意思是：英语意思是：Hypertext Marked Language，即超文本标记语言即超文本标记语言l通过通过HTML可以表现出丰富多彩的设计风格可以表现出丰富多彩的设计风格l通过通过HTML可以展现多媒体的效果可以展现多媒体的效果l标签标签 “”HTML的基本结构的基本结构l文档头、文档体文档头、文档体l头头 部部 信信 息息 文文 档档 主主 体，体，正正 文文 部部 分分 HTML的基本结构的基本结构l下面是一个最基本的超文本文档的源代码：下面是一个最基本的超文本文档的源代码：ll一个简单一个简单的的HTML示例示例l欢迎光临我的主页欢迎光临我的主页这是我第一次做主页，无论怎么样，我都会努力做好！这是我第一次做主页，无论怎么样，我都会努力做好！超文本中的标签超文本中的标签l单标签单标签 l双标签双标签 内内 容容 l标签属性标签属性 APPLET CODE=width=150 height=200页面布局及文字设计页面布局及文字设计l标题标题l换行换行l段落标签段落标签l水平线段水平线段l文字的大小设置文字的大小设置l文字的字体与样式文字的字体与样式l文字的颜色文字的颜色l位置控制位置控制l综合示例综合示例标题标题lHTML中提供了相应的标题标签中提供了相应的标题标签,总共提总共提供六个等级，供六个等级，n越小，标题字号就越大越小，标题字号就越大l第一级标题第一级标题 第二级标题第二级标题 第三级标题第三级标题 第四级标题第四级标题 第五级标题第五级标题 第六级标题第六级标题l请看例子请看例子换行换行l在在HTML语言规范里，每当浏览器窗口被缩小语言规范里，每当浏览器窗口被缩小时，浏览器会自动将右边的文字转折至下一行。时，浏览器会自动将右边的文字转折至下一行。所以，编写者对于自己需要断行的地方，应加所以，编写者对于自己需要断行的地方，应加上上标签。标签。段落标签段落标签l文件段落的开始由文件段落的开始由来标记，段落的结束由来标记，段落的结束由来标记，来标记，是可以省略的，因为下一是可以省略的，因为下一个个的开始就意味着上一个的开始就意味着上一个的结束的结束l标签还有一个属性标签还有一个属性ALIGN，它用来指名字，它用来指名字符显示时的符显示时的对齐方式对齐方式，一般值有，一般值有CENTER、LEFT、RIGHT三种三种l请看例子请看例子水平线段水平线段l这个标签可以在屏幕上显示一条水平线，用以分割页这个标签可以在屏幕上显示一条水平线，用以分割页面中的不同部分。面中的不同部分。l有四个属性：有四个属性：size水平线的宽度水平线的宽度width 水平线的长，用占屏幕宽度的百分比或象素值水平线的长，用占屏幕宽度的百分比或象素值 来表示来表示align 水平线的对齐方式，水平线的对齐方式，有有LEFT RIGHT CENTER三种三种noshade 线段无阴影属性，为实心线段线段无阴影属性，为实心线段水平线段水平线段l线段粗细的设定线段粗细的设定l线段长度的设定线段长度的设定l线段排列的设定线段排列的设定l无阴影的设定无阴影的设定 请看例子请看例子文字的大小设置文字的大小设置l提供设置字号大小的是提供设置字号大小的是FONT，FONT有一个有一个属性属性SIZE，通过指定通过指定SIZE属性就能设置字号属性就能设置字号大小，而大小，而SIZE属性的有效值范围为属性的有效值范围为17，其，其中缺省值为中缺省值为3。我们可以。我们可以SIZE属性值之前加上属性值之前加上“”、“”字符，来指定相对于字号初始字符，来指定相对于字号初始值的增量或减量。值的增量或减量。l请看示例请看示例文字的字体与样式文字的字体与样式lHTML提供了定义字体的功能，提供了定义字体的功能，用用FACE属性属性来完成这个工作。来完成这个工作。lFACE的属性值可以是本机上的任一字体类型，的属性值可以是本机上的任一字体类型，只有对方的电脑中装有相同的字体才可以在他只有对方的电脑中装有相同的字体才可以在他的浏览器中出现你预先设计的风格。的浏览器中出现你预先设计的风格。ll请看例子请看例子文字的字体与样式文字的字体与样式l为了让文字富有变化，或者为了着意强调某一部分，为了让文字富有变化，或者为了着意强调某一部分，HTML提供了一些标签产生这些效果，现将常用的标签列提供了一些标签产生这些效果，现将常用的标签列举如下：举如下：l 粗体粗体HTML语言语言l 斜体斜体 HTML语言语言l 加下划线加下划线 HTML语言语言l 打字机字体打字机字体 HTML语言语言l大型字体大型字体 HTML语言语言l小型字体小型字体HTML语言语言l 表示强调，一般为斜体表示强调，一般为斜体HTML语言语言l 表示特别强调，一般为粗体表示特别强调，一般为粗体HTML语言语言l 用于引证、举例，一般为斜体用于引证、举例，一般为斜体HTML语言语言文字的颜色文字的颜色l文字颜色设置格式如下：文字颜色设置格式如下：这里的颜色值可以是一个十六进制数这里的颜色值可以是一个十六进制数(用用“#”作为前缀作为前缀)，也可，也可以是颜色名称以是颜色名称 如：如：Black=#000000“Green=#00FF00 Red=#FF0000“Blue=#0000FF“请看例子请看例子列表列表 l无序号列表无序号列表l序号列表序号列表无序号列表无序号列表l无序号列表使用的一对标签是无序号列表使用的一对标签是，每每一个列表项前使用一个列表项前使用。其结构如下所示：其结构如下所示：第一项第一项第二项第二项第三项第三项l请看例子请看例子序号列表序号列表l序号列表和无序号列表的使用方法基本相同，它使用序号列表和无序号列表的使用方法基本相同，它使用标签标签，每一个列表项前使用每一个列表项前使用。每个项每个项目都有前后顺序之分，多数用数字表示。其结构如下目都有前后顺序之分，多数用数字表示。其结构如下所示：所示：l第一项第一项第二项第二项第三项第三项多媒体效果多媒体效果l插入图象插入图象l播放音乐播放音乐l播放视频播放视频插入图形插入图形l超文本支持的图象格式有超文本支持的图象格式有GIF、JPEG等。等。插入图象的标签是插入图象的标签是，其格式为：其格式为：l请看例子请看例子播放音乐播放音乐l点播音乐点播音乐 将音乐做成一个链接：乐曲名乐曲名l自动载入音乐自动载入音乐 基本语法：播放视频播放视频l链接一个视频文件链接一个视频文件 将视频文件做成一个链接的方法：视频名称视频名称l自动载入视频自动载入视频与音乐的播放一样，我们可以使用EMBED标签播放视频：TABLE表格表格 l表格的基本结构表格的基本结构l表格的标题表格的标题l表格的尺寸设置表格的尺寸设置l表格内文字的对齐、布局表格内文字的对齐、布局l跨多行、多列的表元跨多行、多列的表元l表格的颜色表格的颜色表格的基本结构l.定义表格定义表格.定义标题定义标题 定义表行定义表行 定义表头定义表头 定义表元定义表元(表格的具体数据表格的具体数据)l一个简单的例子表格的标题表格的标题l表格标题的位置，可由表格标题的位置，可由ALIGN属性来设置，其属性来设置，其位置分别由表格上方和表格下方。下面为表格位置分别由表格上方和表格下方。下面为表格标题位置的设置格式。标题位置的设置格式。设置标题位于表格上方：设置标题位于表格上方：.设置标题位于表格下方：设置标题位于表格下方：.表格尺寸设置表格尺寸设置 l表格的大小表格的大小一般情况下，表格的总长度和总宽度是根据各行一般情况下，表格的总长度和总宽度是根据各行和各列的总和自动调整的，如果我们要直接固定表格和各列的总和自动调整的，如果我们要直接固定表格的大小，可以使用下列方式：的大小，可以使用下列方式：width和和height属性分别指定表格一个固定的宽度和长属性分别指定表格一个固定的宽度和长度，度，n1和和n2可以用像素来表示，也可以用百分比（与可以用像素来表示，也可以用百分比（与整个屏幕相比的大小比例）来表示整个屏幕相比的大小比例）来表示表格尺寸设置表格尺寸设置 l边框尺寸设置边框尺寸设置边框是用边框是用border属性来体现的，它表示表格的边框边属性来体现的，它表示表格的边框边厚度和框线。将厚度和框线。将border设成不同的值，有不同的效果。设成不同的值，有不同的效果。如：如：定货单定货单苹果苹果香蕉香蕉葡萄葡萄200公斤公斤200公斤公斤100公公斤斤 表格尺寸设置l格间线宽度格间线宽度 格与格之间的线为格间线，它的宽度可以使用中的CELLSPACING属性加以调节。格式是：#表示要取用的像素值例：定货单苹果香蕉葡萄200公斤200公斤100公斤 表格尺寸设置表格尺寸设置 l内容与格线之间的宽度内容与格线之间的宽度我们还可以在我们还可以在中设置中设置CELLPADDING属性，用来规定属性，用来规定内容与格线之间的宽度。格式为：内容与格线之间的宽度。格式为：#表示要取用的像素值表示要取用的像素值l例：例：定货单定货单苹果苹果香蕉香蕉葡萄葡萄200公斤公斤200公斤公斤100公斤公斤 表格内文字的对齐表格内文字的对齐/布局布局l表格中数据的排列方式有两种，分别是表格中数据的排列方式有两种，分别是左右排列左右排列和和上下排列上下排列。左。左右排列是以右排列是以ALIGN属性来设置，而上下排列则由属性来设置，而上下排列则由VALIGN属性来属性来设置。设置。l其中左右排列的位置可分为三种：居左（其中左右排列的位置可分为三种：居左（left)、居右居右(right)和居和居中中(center)；l而上下排列基本上比较常用的有四种：上齐而上下排列基本上比较常用的有四种：上齐(top)、居中居中(middle)、下齐下齐(bottom)和基线和基线(baseline)。l#=left,center,right l#=top，middle，bottom，baseline 表格的颜色表格的颜色l在表格中，既可以对整个表格填入底色，也可以对任在表格中，既可以对整个表格填入底色，也可以对任何一行、一个表元使用背景色。何一行、一个表元使用背景色。表格的背景色彩表格的背景色彩 行的背景色彩行的背景色彩 表元的背景色彩表元的背景色彩或或#=rrggbb 16进制进制 RGB数码数码,或者是下列预定义色彩名称：或者是下列预定义色彩名称：Black,Olive,Teal,Red,Blue,Maroon,Navy,Gray,Lime,Fuchsia,White,Green,Purple,Silver,Yellow,Aqua 学习学习HTML的建议：的建议：l语法手册语法手册l模仿，模仿，照葫芦画瓢照葫芦画瓢作业作业l1l2l3l7l9