第三百七十二节 JavaFX教程 - JavaFX HTMLEditor

JavaFX教程 - JavaFX HTMLEditor

HTMLEditor控件是一个富文本编辑器,具有以下功能。

  • 粗体
  • 斜体
  • 下划线
  • 删除线
  • 字体系列
  • 字体大小
  • 前景色
  • 背景颜色
  • 缩进
  • 项目符号列表
  • 编号列表
  • 对齐
  • 水平线
  • 复制文本片段
  • 粘贴文本片段

HTMLEditor类返回HTML字符串中的编辑内容。

创建HTML编辑器

复制代码
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.web.HTMLEditor;
import javafx.stage.Stage;

public class Main extends Application {
 
    @Override
    public void start(Stage stage) {
        HTMLEditor htmlEditor = new HTMLEditor();
        htmlEditor.setPrefHeight(245);
        Scene scene = new Scene(htmlEditor);       
        stage.setScene(scene);
        stage.show();
    } 
    public static void main(String[] args) {
        launch(args);
    }
}

上面的代码生成以下结果。

HTML内容

要将内容设置为HTMLEditor类,请使用setHtmlText方法。

复制代码
htmlEditor.setHtmlText(INITIAL_TEXT);
复制代码
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.web.HTMLEditor;
import javafx.stage.Stage;

public class Main extends Application {
 
    @Override
    public void start(Stage stage) {
        HTMLEditor htmlEditor = new HTMLEditor();
        htmlEditor.setPrefHeight(245);
        String INITIAL_TEXT = "Lorem ipsum dolor sit "
            + "amet, consectetur adipiscing elit. Nam tortor felis, pulvinar "
            + "aliquam sagittis gravida eu dolor. Etiam sit amet ipsum "
            + "sem.";
        htmlEditor.setHtmlText(INITIAL_TEXT);
        Scene scene = new Scene(htmlEditor);       
        stage.setScene(scene);
        stage.show();
    } 
    public static void main(String[] args) {
        launch(args);
    }
}

上面的代码生成以下结果。

格式

我们可以使用此字符串中的HTML标记为最初渲染的内容应用特定的格式。

复制代码
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.web.HTMLEditor;
import javafx.stage.Stage;

public class Main extends Application {
 
    @Override
    public void start(Stage stage) {
        HTMLEditor htmlEditor = new HTMLEditor();
        htmlEditor.setPrefHeight(245);
        String INITIAL_TEXT = "Lorem ipsum dolor sit "
            + "amet, consectetur adipiscing elit. <i>Nam tortor felis</i>, pulvinar "
            + "<UL><li>a</li><li>a</li><li>a</li></UL>"
            + "aliquam sagittis gravida <b>eu dolor</b>. Etiam sit amet ipsum "
            + "sem.";
        htmlEditor.setHtmlText(INITIAL_TEXT);
        Scene scene = new Scene(htmlEditor);       
        stage.setScene(scene);
        stage.show();
    } 
    public static void main(String[] args) {
        launch(args);
    }
}

上面的代码生成以下结果。

获取HTML内容

复制代码
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.VBox;
import javafx.scene.web.HTMLEditor;
import javafx.stage.Stage;

public class Main extends Application {
 
    @Override
    public void start(Stage stage) {
        HTMLEditor htmlEditor = new HTMLEditor();
        htmlEditor.setPrefHeight(245);
        String INITIAL_TEXT = "Lorem ipsum dolor sit "
            + "amet, consectetur adipiscing elit. <i>Nam tortor felis</i>, pulvinar "
            + "<UL><li>a</li><li>a</li><li>a</li></UL>"
            + "aliquam sagittis gravida <b>eu dolor</b>. Etiam sit amet ipsum "
            + "sem.";
        htmlEditor.setHtmlText(INITIAL_TEXT);
        
        Button showHTMLButton = new Button("Produce HTML Code");
        
        showHTMLButton.setOnAction((ActionEvent arg0) -> {
          System.out.println(htmlEditor.getHtmlText());
        });
        
        VBox vbox = new VBox();
        vbox.getChildren().addAll(htmlEditor,showHTMLButton);
        Scene scene = new Scene(vbox);       
        stage.setScene(scene);
        stage.show();
    } 
    public static void main(String[] args) {
        launch(args);
    }
}

上面的代码生成以下结果。

相关推荐
用户26812851066695 分钟前
react-pdf(pdfjs-dist)如何兼容老浏览器(chrome 49)
前端
阿怼丶5 分钟前
🚀 如何在内网中运行 Cesium?基于 NestJS 构建离线地形与影像服务
前端·gis
lyc2333336 分钟前
鸿蒙应用升级场景下的数据迁移适配
前端
DuxWeb7 分钟前
深入 Vue3 的类型传递机制与 React 的区别
前端
前端梭哈攻城狮9 分钟前
uniapp图片上传添加水印/压缩/剪裁
前端·javascript·vue.js
天涯学馆9 分钟前
前后端分离的 API 设计:技术深度剖析
前端·javascript·面试
lyc23333310 分钟前
鸿蒙File Access Framework:用户文件访问与权限控制📂
前端
爱编程的喵10 分钟前
深入理解JavaScript原型机制:从Java到JS的面向对象编程之路
java·前端·javascript
独立开阀者_FwtCoder11 分钟前
Cursor 1.0 重磅发来袭(毛骨悚然,开始学习你如何编码)
前端·javascript·github
JaysonJin11 分钟前
uni-app 自定义路由封装模块详解(附源码逐行解读)
前端