JavaFX学习笔记(二)

技术帖,Java FX 2016-09-22

本文给出了JavaFX架构和生态系统的高阶视图。

图2-1说明了JavaFX平台的组件架构。后面的章节将会对每个组件及其之间的联系进行说明。在JavaFX公开的API之下JavaFX代码运行引擎。它由几大部分组成:一个JavaFX 高性能图形引擎,名为Prism;一个简洁高效的窗体系统,名为Glass;一个媒体引擎;一个web引擎。尽管这些组件并没有公开对外暴露,但是下面的描述将有助于你理解一个JavaFX应用是如何运行的。

● 场景图(Scene Graph)

● JavaFX功能的公开API(Java Public APIs for JavaFX Features)

● 图形系统(Graphics System)

● Glass窗体工具包(Glass Windowing Toolkit)

● 多媒体和图像(Media and Images)

● Web组件(Web Component)

● CSS

● UI控件(UI Controls)

● 布局(Layout)

● 2-D和3-D转换(2-D and 3-D Transformations)

● 视觉特效(Visual Effects)

屏幕快照 2016-09-22 14.29.45.png

场景图

JavaFX场景图(Scene Graph)位于图2-1中的顶层部分,它是构建JavaFX应用的入口。它是一个层级结构的节点树,表示了所有用户界面的视觉元素。它可以处理输入,并且可以被渲染。

在场景图中的一个元素被称为一个节点(Node)。每个节点都有一个ID、样式类和包围盒(bounding volume)。除了根节点之外,在场景图中的所有节点都有一个父节点、0个或多个子节点。节点还可以有如下特性:

● 效果(Effects),例如模糊和阴影

● 不透明度(Opacity)

● 变换(Transforms)

● 事件处理器(Event handlers,例如鼠标、键盘和输入法)

● 应用相关的状态(Application-specific state)

与Swing和AWT不同,JavaFX场景图还包括图元,例如矩形、文本,还有控件、布局容器、图像、多媒体。

对于大多数用户来说,场景图简化了UI设计,尤其是对富客户端应用来说。对场景图中使用动画可以很容易地通过javafx.animation API和声明式方法(例如XML文档)来实现。

javafx.scene API允许创建和定义各种内容,例如:

● 节点(Nodes):包括各种形状(2D或3D)、图像、多媒体、内嵌的Web浏览器、文本、UI控件、图表、组和容器

● 状态(State):变换(节点的定位和定向)、视觉效果、以及内容的其它视觉状态。

● 效果(Effects):可以改变场景图节点的外观的简单对象。例如模糊、阴影、图像调整。

如果希望了解更多信息,请参考后面的教程“使用JavaFX 场景图”。
JAVAFX功能的JAVA 公开API

在图2-1中描述的JavaFX架构的顶层提供了一个支持富客户端应用开发的完整Java API集合。这些API为构建富客户端程序提供了无比的自由和弹性。JavaFX平台将Java平台上众多最佳功能以及全面、沉浸式的多媒体功能集成到了一个直观、全面的一站式开发环境之中。这些JavaFX功能API包括:

● 允许使用Java的强大特性,例如泛型、注解、多线程、Lamda表达式(从Java8开始引入)

● 允许Web开发者通过其他基于JVM的动态语言来使用JavaFX,例如Groovy和JavaScript。

● 允许Java开发者使用其他系统语言来开发大型、复杂的JavaFX应用,例如Groovy。

● 允许使用绑定技术,包括高性能的lazy binding、binding expressions、bound sequence expressions、partial bind reevaluation。其它语言(像Groovy)可以通过与JavaFX 脚本类似的语法来使用这些绑定库。

● 扩展了Java 集合库,包括可观察的list和map,允许应用程序将用户界面和数据模型进行连接,观察数据模型的改变并同时更新对应的UI控件。

JavaFX API和编程模型是JavaFX 1.x 产品线的延续。大多数JavaFX API已经被直接用到了Java之中。有一些API,例如布局和多媒体,由于具有更多的细节,它们已经基于JavaFX 1.x的用户反馈进行了改进和简化。JavaFX采用了很多Web 标准,例如CSS用于控件的样式化、ARIA用于易用性标准化。对更多Web标准的应用正处在review状态。

图形系统

JavaFX图形系统(Graphics System)是在图2-1中蓝色部分,它是在JavaFX场景图层之下的实现细节。它支持2D和3D场景图。当系统中的图形硬件无法支持硬件加速渲染时,它将提供软件渲染技术。

在JavaFX平台中实现了两套图形加速流水线:

● Prism用于处理渲染工作。它可以在硬件和软件渲染器之上工作,包括3D。它负责将JavaFX场景进行光栅化和渲染。下面的各种渲染方式都有可能被用到:

○ 在Windows XP和Vista上的DirectX 9

○ 在Windows 7上的DirectX 11

○ Mac、Linux、嵌入式设备上的OpenGL

○ 当硬件加速技术不支持时使用软件渲染

如果可能将会优先使用硬件加速,但是如果硬件加速不可用则会使用软件渲染,软件渲染技术已经内置于JRE之中。这点在展示3D场景时尤其重要。当然,使用硬件加速时性能将会更好。

● Quantum Toolkit 将Prism和Glass Windowing ToolKit绑在一起,使得它们可以被其上层的JavaFX层使用。它也负责管理与渲染有关的事件处理的线程规则。

GLASS窗体工具包

Glass窗体工具包(Glass Windowing Toolkit)在图2-1中处于整体架构的中间位置,它处于JavaFX图形技术栈的最底层。其主要职责是提供本地操作服务,例如窗体、计时器、皮肤。它是连接JavaFX层与本地操作系统的平台无关层。

它还负责管理事件队列。与AWT自行管理事件队列不同,它使用本地操作系统的事件队列来调度线程。同样与AWT不同的是Glass Toolkit与JavaFX应用运行在一个线程之上,而在AWT中本地系统中的那部分代码运行在一个线程中,而Java部分的运行在另外一个线程上。这导致了很多问题,而这些问题在JavaFX由于采用了统一的线程而都得到了解决。

线程
在系统运行时会有下面的两个或更多线程:

● JavaFX应用程序线程:这是JavaFX应用开发者使用的主要线程。任何“活动”的场景都是窗体的一部分,它们都必需通过此线程来访问。场景图可以通过一个后台线程来创建和控制,但是如果其根节点与任何活动对象相关,则该场景图必需通过JavaFX应用程序线程来访问。这允许开发者在背景线程上创建复杂的场景图,而与此同时在“活动”场景中保持动画的流畅。由于JavaFX应用程序线程与Swing和AWT事件调度线程(EDT)不同,所以在将JavaFX代码嵌入到Swing应用程序中时必需小心。

● Prism渲染线程:此线程处理渲染工作,使其与事件调度器独立开来。它使得第N帧在被渲染时可以对第N+1帧进行处理。这种并行处理机制具有很大的优势,尤其是在具有多处理器的现代操作系统上。Prism渲染线程可以带有多个光栅化线程来协助处理渲染相关的工作。

● 多媒体线程:此线程会在后台运行,通过使用JavaFX应用程序线程来在场景图中同步最近的帧。

脉冲
脉冲(Pulse)是一个事件,用于通知JavaFX场景图何时该使用Prism来同步场景图之上的元素状态。一个脉冲被限制为最多60帧每秒(fps),并且会在场景图上运行动画时被触发。即使动画没有运行,如果场景图中的内容发生了改变,也会使脉冲被调度。例如,如果一个Button的位置被改变了,那么一个脉冲将会被调度。

如果一个脉冲被触发,在场景图之上的元素状态将会与渲染层进行同步。脉冲向开发者提供了一种异步处理消息的方法。这种特性对于系统在脉冲上进行批处理和执行事件非常重要。

Layout和CSS也与脉冲事件相关。场景图中的改变可以导致很多布局或CSS的更新,这些更新有可能会影响性能。系统在每个脉冲之上自动进行一次CSS和布局处理,以此降低对系统性能的影响。应用开发者也可以根据需要手工在脉冲之前触发布局。

Glass WindowToolkit负责使用高分辨率的本地计时器来执行脉冲事件。

多媒体和图像

通过javafx.scene.media API可以访问 JavaFX的多媒体功能。JavaFX支持视频和音频媒体。支持的格式包括MP3、AIFF、WAV音频文件和FLV视频文件。JavaFX多媒体功能包括3个独立的组件:Midia对象用于表示一个多媒体文件、MediaPlayer用于播放文件、MediaView用于显示内容。

WEB组件

Web组件(Web Component)是一个基于Webkit的JavaFX UI控件,其提供了一个Web Viewer,并通过其API提供了完全的浏览功能。它基于WebKit,而Webkit是一个开源的Web浏览器引擎,支持HTML5、CSS、JavaScript、DOM、SVG。它允许开发者在Java应用程序中实现下列功能:

● 渲染来自本地或远程URL的HTML内容

● 支持历史记录、提供后退和前进导航

● 内容重加载

● 向Web组件添加效果

● 编辑HTML内容

● 执行JavaScript命令

● 事件处理

这个嵌入式的浏览器组件由以下类组成:

● WebEngine提供了基本的Web页面浏览功能

● WebView封装了WebEngine对象,将HTML内容整合到应用场景之中,并提供属性和方法来增加效果、变换。它是Node类的一个扩展。

另外Java和JavaScript可以互相调用。

CSS

JavaFX层叠样式表(CSS)提供了在不修改应用程序代码的情况下自定义应用程序外观的能力。CSS可以被添加到任何JavaFX场景图中的节点之上,这个添加过程是异步的。JavaFX CSS支持在运行时添加到场景中,这使得动态改变应用外观变得可行。

图2-2展示了对相同的控件集应用了两种不同CSS样式的情况。

屏幕快照14.39.22 .png

JavaFX CSS基于W3C CSS标准的2.1版,也加入了少量3.0版的特性。JavaFX CSS被设计成支持扩展,这样JavaFX CSS样式表可以被任何兼容的CSS解析器所解析,即使对应的的解析器不支持JavaFX扩展。这样使得在JavaFX和其他情况下(录入HTML页面)可以使用统一的CSS样式表。所有JavaFX属性名都加上了“-fx-”前缀,这些看起来和标准的HTML CSS很类似,不过有部分具有细微的语义差别。

想要了解关于JavaFX CSS的更多信息,请参考《在JavaFX应用中使用CSS样式来管理外观(Skinning JavaFXApplications with CSS)》文档。

UI控件

JavaFX UI控件可通过JavaFX API来使用,这些控件通过场景图中的节点来构建。这些控件充分利用了JavaFX平台丰富的视觉功能,并且支持多种操作系统。JavaFX CSS允许对UI控件进行主题和风格控制。

图2-3展示了目前支持的控件,这些控件位于javafx.scene.control包中。

屏幕快照 2016-09-22 14.41.29.png

如果需要更多关于可用的JavaFX UI控件的相关信息,请参考《使用JavaFX UI控件》教程或javafx.scene.control包对应的API文档。

布局

布局容器(Layoutcontainer)或面板(Pane)允许对JavaFX应用程序场景图中的UI控件进行灵活、动态的排布。JavaFX Layout API包括下列容器类:

● BorderPane类将其内容节点放到上、下、左、右、中各个区域中。

● HBox类将其内容节点横向排成一行。

● VBox类将其内容节点纵向排成一列。

● StackPane类将其内容节点摞在一起。

● GridPane类允许开发者创建一个灵活的网格,按行列来布局其内容节点。

● FlowPane类将其内容按行或列进行”流式“布局,当遇到横向或纵向的边界时自动进行换行或换列。

● TilePane类将其内容放到统一大小的单元格中。

● AnchorPane类允许开发者创建锚节点,将控件停靠于布局的上下左右各边,也可以居中停靠。

为了获得理想的布局结构,可以在JavaFX应用中嵌套使用各类布局。

如果要学习更多关于如何使用布局的信息,可以参考文档:《在JavaFX中使用布局(Working with Layouts in JavaFX)》。如果想要了解更多关于JavaFX布局API的信息,请参考javafx.scene.layout包的API文档。

2D和3D变换

在JavaFX场景图中的每个节点都可以使用下面的javafx.scene.tranform包中的类来进行x-y坐标系变换:

● translate——将一个节点在xyz坐标系中从一个位置移动另外一个位置。

● scale——将一个节点在xyz坐标系中根据缩放因子进行缩放。

● shear——旋转一个坐标轴,这样x轴和y轴不再是垂直的了。节点的坐标值会根据制定的倍数进行变换。

● rotate——根据scene中指定的一个支点对节点进行旋转。

● affine——执行从一个2D/3D坐标系到另外一个2D/3D坐标系的线性映射,同时保留线条的 ‘straight’ 和’parallel’ 属性。这个类应与Translate、Scale、Rotate、Shear变换类同时使用,一般不要直接使用。

要了解更多关于使用变换的信息,可以参考文档:《在JavaFX中应用变换(Applying Transformation in JavaFX》。要了解更多关于javafx.scene.transform包中的类的信息,可以参考API文档。

视觉效果

在JavaFX场景图中开发富客户端界面包括使用视觉效果来实时地美化JavaFX应用程序的外观。JavaFX的视觉效果主要是基于像素的图像,因此它们需要先获取场景图中节点渲染成图像,再将视觉效果添加上去。

JavaFX中通过下面的类来提供一些常用的视觉效果:

● Drop Shadow——应用视觉效果后将为给定的内容渲染一个在它的后面的阴影。

● Reflection——在真实的内容后面渲染一个反射倒影。

● Lighting——模仿一个光源的照射效果,使一个平面的对象看起来更真实、具有三维效果。

要了解更多关于如何使用这些可用的视觉效果的样例,可以参考文档:《创建可视化效果(Creating Visual Effects)》。要了解关于所有可用的视觉效果类的信息,可以参考javafx.scene.effect包的API文档。


本文由 BF 创作,采用 知识共享署名 3.0,可自由转载、引用,但需署名作者且注明文章出处。

还不快抢沙发

添加新评论

bst g22 jinniu lilai opebet orange88 vinbet xbet yuebo zunlong shijiebei bet007 hg0088 ju111 letiantang m88 mayaba qg777 qianyiguoji sbf777 tengbohui tlc ule weilianxier waiweitouzhu xingfayule xinhaotiandi yinheyule youfayule zhongying 2018shijiebei w88 18luck 188bet beplay manbet 12bet 95zz shenbo weide1946 ca88 88bifa aomenxinpujing betway bodog bt365 bwin tongbao vwin weinisiren 88jt fenghuangyule hongyunguoji 918botiantang huanyayule jianada28 jixiangfang libo long8 hongzuyishi zuqiutouzhu