1.在Applet中画一轮黄色新月,并且窗口上方显示红字“The Moon"。当在窗口另一位置单击鼠标后,在鼠标位置重新绘制月亮,并写出相应html文件。
时间: 2023-06-27 07:07:53 浏览: 166
在Java Applet中实现动画.rar_applet_java Applet
这个需求需要使用HTML5的Canvas和JavaScript来实现。以下是实现该需求的代码:
HTML文件:
```html
<!DOCTYPE html>
<html>
<head>
<title>The Moon</title>
<meta charset="utf-8">
<style type="text/css">
canvas {
border: 1px solid black;
}
</style>
</head>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<script src="moon.js"></script>
</body>
</html>
```
JavaScript文件(moon.js):
```javascript
// 获取canvas元素
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
// 绘制黄色新月
ctx.beginPath();
ctx.fillStyle = "yellow";
ctx.arc(250, 250, 200, 0.25*Math.PI, 1.25*Math.PI);
ctx.lineTo(250, 250);
ctx.fill();
// 显示"The Moon"文字
ctx.font = "30px Arial";
ctx.fillStyle = "red";
ctx.fillText("The Moon", 10, 50);
// 监听鼠标单击事件
canvas.addEventListener("click", function(event) {
// 清除画布
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 绘制新的月亮
ctx.beginPath();
ctx.fillStyle = "yellow";
ctx.arc(event.clientX, event.clientY, 200, 0.25*Math.PI, 1.25*Math.PI);
ctx.lineTo(event.clientX, event.clientY);
ctx.fill();
// 显示"The Moon"文字
ctx.font = "30px Arial";
ctx.fillStyle = "red";
ctx.fillText("The Moon", 10, 50);
});
```
以上代码实现了在页面中绘制黄色新月,并且在窗口上方显示红字"The Moon"。当在窗口另一位置单击鼠标后,会在鼠标位置重新绘制月亮。
阅读全文