javafx实现时钟效果

本文实例为大家分享了javafx实现时钟效果的具体代码,供大家参考,具体内容如下

核心为三个函数:

第一个为 public void dials,绘制表盘

第二个为 public void scale,绘制刻度,这里需要注意的是字体旋转

第三个为 public void point,绘制秒分时针以及打印时间,需要注意的是进制问题

总的源码如下:

package com.wu.demo;

import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;

import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.layout.AnchorPane;
import javafx.scene.paint.Color;
import javafx.scene.paint.Paint;
import javafx.scene.text.Font;
import javafx.stage.Stage;
import javafx.util.Duration;

public class view extends Application{
 @Override
 public void start(Stage stage) throws Exception{
 AnchorPane root = new AnchorPane();
 Canvas canvas = new Canvas(800,650);
 root.getChildren().add(canvas);
 Scene scene = new Scene(root,800,650);
 stage.setScene(scene);
 stage.setResizable(false);
 stage.show();
 // 获取画板对象
 GraphicsContext gc = canvas.getGraphicsContext2D();
 // 创建时间轴
 Timeline timeLine = new Timeline();
 // 获取时间轴的帧列表
 ObservableList<KeyFrame> keyFrames = timeLine.getKeyFrames();
 // 添加关键帧
 keyFrames.add(new KeyFrame(Duration.seconds(0.1),e->{
 // 刷新操作
 gc.clearRect(0,0,800,650);
 // 绘制表盘
 dials(gc);
 // 绘制刻度
 scale(gc);
 // 绘制指针
 point(gc);
 }));
 // 设置时间轴播放次数为无限
 timeLine.setCycleCount(-1);
 // 播放时间轴
 timeLine.play();
 }
 /**
 * 绘制表盘
 * @param gc
 */
 public void dials(GraphicsContext gc) {
 // 保存现场
 gc.save();
 // 变换坐标到外切圆矩形左上角坐标
 gc.translate(100,25);
 gc.setLineWidth(8);
 gc.setStroke(Color.GRAY);
 gc.strokeOval(0, 0, 600, 600);
 gc.restore();
 }
 /**
 * 绘制刻度
 * @param gc
 */

 public void scale(GraphicsContext gc) {
 // 保存现场
 gc.save();
 // 变换坐标系原点到表盘中心
 gc.translate(400,325);
 // 坐标逆时针旋转角度-90
 gc.rotate(-90);
 // 设置字体大小
 gc.setFont(Font.font(20));
 for(int i = 1 ; i < 61 ; i++) {
 // 每一个刻度角度为6度
 gc.rotate(6);
 if(i % 5 == 0) {
 gc.save();
 // 当前坐标切换到 (250,0) 即刻度左边界位置
 gc.translate(250,0);
 // 设置表格数字位置 相对于桌面应该是竖直
 gc.rotate(90-i/5*30);
 gc.fillText(i/5+"",0,0);
 gc.restore();
 gc.fillRect(275,0,22,10);
 }
 else{
 gc.fillRect(285,0,12,5);
 }
 }
 // 恢复现场
 gc.restore();
 }
 /**
 * 绘制指针
 * @param gc
 */
 public void point(GraphicsContext gc) {
 LocalDateTime time = LocalDateTime.now();
 int seconds = time.getSecond();
 int minutes = time.getMinute();
 int hours = time.getHour();
 double[] pointX1 = new double[]{0,50,270,50};
 double[] pointY1 = new double[]{0,5,0,-5};
 double[] pointX2 = new double[]{0,30,210,30};
 double[] pointY2 = new double[]{0,10,0,-10};
 double[] pointX3 = new double[]{0,20,150,20};
 double[] pointY3 = new double[]{0,12,0,-12};
 gc.save();
 // 坐标移动至圆心
 gc.translate(400, 325);
 // 时间数字
 {
 String timeText1 = time.format(DateTimeFormatter.ofPattern("yyyy-MM-dd"));
 gc.setFill(Paint.valueOf("#c0c0c0"));
 gc.setFont(Font.font(20));
 gc.fillText(timeText1,-40,-200);
 String timeText2 = time.format(DateTimeFormatter.ofPattern("HH:mm:ss"));
 gc.setFill(Paint.valueOf("#c0c0c0"));
 gc.setFont(Font.font(115));
 gc.fillText(timeText2,-220,30);
 }
 // 秒钟
 {
 gc.save();
 gc.rotate(-90);
 gc.setFill(Color.RED);
 gc.rotate(seconds*6);
 // 四边形秒钟
 gc.fillPolygon(pointX1,pointY1, 4);
 gc.restore();
 }
 // 分钟
 {
 gc.save();
 gc.rotate(-90);
 gc.setFill(Color.BLUE);
 gc.rotate(minutes*6+0.1*seconds);
 // 四边形分钟
 gc.fillPolygon(pointX2,pointY2, 4);
 gc.restore();
 }
 // 时钟
 {
 gc.save();
 gc.rotate(-90);
 gc.setFill(Color.BLACK);
 gc.rotate(hours*30+minutes*0.5+seconds*(0.5/60));
 // 四边形时钟
 gc.fillPolygon(pointX3,pointY3, 4);
 gc.restore();
 }
 // 恢复现场
 gc.restore();

 }
 public static void main(String[] args) {
 launch(args);
 }
}

效果图:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • java实现动态时钟并设置闹钟功能

    本文实例为大家分享了java实现动态时钟设置闹钟功能,供大家参考,具体内容如下 显示如上图所示的动态时钟,并且可以设置闹钟,播放mp3. 首先用到的是时钟(Timer)和日历(Calendar)得到系统的当前时间. 代码如下: import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.geom.Ellipse2D; import java.awt.geom.Line2D; import java.io.Buffer

  • Java实现的简单数字时钟功能示例

    本文实例讲述了Java实现的简单数字时钟功能.分享给大家供大家参考,具体如下: 应用名称:Java数字时钟 用到的知识:Java GUI编程,线程 开发环境:win8+eclipse+jdk1.8 功能说明:可以显示当前系统的年月日.星期以及准确时间,并实时更新显示. 效果图: 源代码: import javax.swing.JFrame; import javax.swing.JPanel; import java.awt.BorderLayout; import javax.swing.JL

  • java多线程编程制作电子时钟

    模拟一个电子时钟,它可以在任何时候被启动或者停止,并可以独立的运行. 1.定义一个Clock类.它继承Label类,并实现Runnable接口.这个类中有一个Thread类型的clocker域,以及start()和run()方法.在run()方法中,每隔一秒就把系统时间显示为label的文本. class Clock extends Label implements Runnable { //定义Thread类型的clocker域 public Thread clocker=null; publ

  • Java实现动态模拟时钟

    本文实例为大家分享了java动态模拟时钟的具体代码,供大家参考,具体内容如下 应用名称:java动态模拟时钟 用到的知识:javaGUI,java 绘图 开发环境:win10+eclipse+jdk1.8 功能说明:通过java绘图画出一个虚拟的动态时钟 效果图: 源代码: import javax.swing.*; import java.awt.*; import java.util.*; import java.lang.Thread; import java.text.DecimalFo

  • Java编程小实例—数字时钟的实现代码示例

    本文的实例是Java编程实现一个数字时钟,代码测试可用,练练手吧.代码如下: package me.socketthread; import java.awt.Color; import java.awt.Dimension; import java.awt.Font; import java.awt.Graphics; import java.awt.Graphics2D; import java.util.Calendar; import java.util.GregorianCalenda

  • Java实现动态数字时钟

    本文实例为大家分享了Java实现动态数字时钟的具体代码,供大家参考,具体内容如下 构建: Clock继承 JFrame 为运行页面 ClockText 测试类 创建 Clock 对象 运行效果: 具体实现: 一.Clock类 四个JPnal 三个放时间 最后一个放日期 放时间的三个JPnal 分别加入 地点 时间 按钮 最后一个按钮添加日期 具体实现如下: public class Clock extends JFrame { private JPanel jPanelBeijing; priv

  • java实现时钟效果

    本文实例为大家分享了java实现时钟效果的具体代码,供大家参考,具体内容如下 实现效果如图: Java代码: 文件一:ClockPanel.java import static java.util.Calendar.HOUR; import static java.util.Calendar.MILLISECOND; import static java.util.Calendar.MINUTE; import static java.util.Calendar.SECOND; import j

  • java实现的小时钟示例分享

    复制代码 代码如下: //package com.clock; import java.awt.BasicStroke;import java.awt.Color;import java.awt.Font;import java.awt.Graphics;import java.awt.Graphics2D;import java.awt.Insets;import java.awt.event.ActionEvent;import java.awt.event.ActionListener;i

  • Java实现的动态数字时钟功能示例【显示世界时间】

    本文实例讲述了Java实现的动态数字时钟功能.分享给大家供大家参考,具体如下: 构建: 1. Clock继承 JFrame 为运行页面 2. ClockText 测试类 创建 Clock 对象 运行效果: 具体实现: 一.Clock类  四个JPnal 三个放时间 最后一个放日期 放时间的三个JPnal 分别加入 地点 时间 按钮 最后一个按钮添加日期 具体实现如下: public class Clock extends JFrame { private JPanel jPanelBeijing

  • javafx实现时钟效果

    本文实例为大家分享了javafx实现时钟效果的具体代码,供大家参考,具体内容如下 核心为三个函数: 第一个为 public void dials,绘制表盘 第二个为 public void scale,绘制刻度,这里需要注意的是字体旋转 第三个为 public void point,绘制秒分时针以及打印时间,需要注意的是进制问题 总的源码如下: package com.wu.demo; import java.time.LocalDateTime; import java.time.format

  • JavaFX实现简易时钟效果(二)

    本文实例为大家分享了JavaFX实现简易时钟效果的具体代码,供大家参考,具体内容如下 在前一篇博客中,我们已经绘制了一个静止时钟. 绘制简易时钟(一) 首先进行一个微调:让表盘根据窗口大小自动调整大小: 在 ShowClock.start() 中,添加对面板长宽的监听. pane.widthProperty().addListener(ov -> clock.setW(pane.getWidth())); pane.heightProperty().addListener(ov -> cloc

  • JavaFX实现简易时钟效果(一)

    本文实例为大家分享了JavaFX实现简易时钟效果的具体代码,供大家参考,具体内容如下 效果图 用当前时间创建时钟,绘制表盘. 钟表是静止的.让指针动起来,请参照:绘制简易时钟(二) 主函数文件 ShowClock: package primier; import javafx.application.Application; import javafx.geometry.Insets; import javafx.geometry.Pos; import javafx.scene.Scene;

  • JavaFX实现简易时钟效果

    本文实例为大家分享了JavaFX实现简易时钟效果的具体代码,供大家参考,具体内容如下 首先要在面板中显示一个时钟,我们可以设计一个ClockPane类来显示一个时钟. 最终效果: 若要绘制一个时钟,需要绘制一个圆并为秒钟.分钟和小时绘制三个指针.为了画一个指针,需要确定一条直线的两端:一端是时钟的中央,位于(centerX,centerY):另外一端位于(endX,endY),由一下公式来确定: endX=centerX+handLength×sin(θ) endY=centerY-handLe

  • JS实现的网页倒计时数字时钟效果

    本文实例讲述了JS实现的网页倒计时数字时钟效果.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q

  • 使用JS显示倒计时数字时钟效果

    本文实例讲述了JS实现的网页倒计时数字时钟效果.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> &l

  • 基于javascript实现动态时钟效果

    本文实例讲解了javascript动态时钟效果的实现方法,分享给大家供大家参考,具体内容如下 实现代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <

  • JavaScript html5 canvas绘制时钟效果

    本文实例讲述了JavaScript+html5 canvas绘制时钟效果.分享给大家供大家参考,具体如下: HTML部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0

  • JavaScript Canvas绘制圆形时钟效果

    本文实例为大家分享了Canvas时钟效果展示的具体代码,供大家参考,具体内容如下 <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> canvas{ display: block; margin: 0 auto; background-color: #fdffad; border: 1px solid #0

  • js实现Form栏显示全格式时间时钟效果代码

    本文实例讲述了js实现Form栏显示全格式时间时钟效果代码.分享给大家供大家参考.具体如下: 这里演示的Form栏特效时钟,显示全日期格式的时间日期效果,可显示星期几.几月几号,以往都是直接显示在网页中,而本代码是将时间显示在表单的文本框中,看一下代码就明白了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-form-input-showtime-codes/ 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3

随机推荐