1 <Insert Picture Here> Visual Development of JavaFX - - PowerPoint PPT Presentation

▶
1
SMART_READER_LITE
LIVE PREVIEW

1 <Insert Picture Here> Visual Development of JavaFX - - PowerPoint PPT Presentation

Sep 05, 2022 144 likes •415 views

1 <Insert Picture Here> Visual Development of JavaFX Applications David Kaspar Software Engineer JavaOne and Oracle Develop Latin America 2010 December 79, 2010 3 JavaOne and Oracle Develop Beijing 2010 December 1416, 2010 4 The

slide-1
SLIDE 1

1

slide-2
SLIDE 2

<Insert Picture Here>

Visual Development of JavaFX Applications

David Kaspar Software Engineer

slide-3
SLIDE 3

3

JavaOne and Oracle Develop

Latin America 2010

December 7–9, 2010

slide-4
SLIDE 4

4

JavaOne and Oracle Develop

Beijing 2010

December 14–16, 2010

slide-5
SLIDE 5

5

The following is intended to outline our general product direction. It is intended for information purposes only, and may not be incorporated into any

  • contract. It is not a commitment to deliver any

material, code, or functionality, and should not be relied upon in making purchasing decisions. The development, release, and timing of any features or functionality described for Oracle’s products remains at the sole discretion of Oracle.

slide-6
SLIDE 6

6

You will learn how to visually develop JavaFX applications including their dynamic behaviors, connecting to data on the Internet and embedding graphics produced by creative designers. Goal

slide-7
SLIDE 7

7

<Insert Picture Here>

Program Agenda

  • Introduction
  • Concept of States
  • Concept of Data Sources
  • Embedding Graphics
  • Summary
slide-8
SLIDE 8

8

Introduction

  • JavaFX

– Technology for creating rich-client applications

  • JavaFX 1.3.1 SDK

– Minimal set of tools for creating JavaFX apps

  • NetBeans 6.9.1 for JavaFX

– Support for full development cycle – Advanced editor features – Built-in JavaFX SDK – JavaFX Production Suite integration – JavaFX Composer

slide-9
SLIDE 9

9

NetBeans JavaFX Composer

  • Visual development tool for JavaFX applications
  • Integrated into NetBeans 6.9
  • Targeted for developers
  • Allows applications to be composed using

– Standard controls from the JavaFX 1.3.1 SDK – Imported graphics files from the JavaFX Production Suite – Templates, Custom components

  • Dynamic UI design
  • Connecting to Data Sources
  • Profiles, Compliance checking
slide-10
SLIDE 10

10

<Insert Picture Here>

Demo

First Project

slide-11
SLIDE 11

11

Concepts of States

  • State – a state of an application (appearance,

behavior, internal state) at a specific time

  • Switching states – changing the UI and internal state
  • f the application
  • Designing an application for individual states
  • States

– One Master state – useful as a template – Multiple Derived states – derived from Master

  • Support for simple animations

– Setting interpolation and duration for transition into each state

slide-12
SLIDE 12

12

<Insert Picture Here>

Demo

State-based Hello World

slide-13
SLIDE 13

13

Multiple State Variables

  • 1. state variable controls the wizard page

The rest happens automatically

  • 2. state variable controls side-bar visibility
slide-14
SLIDE 14

14

Concept of Data Sources

  • Diversity

– Your data are at various locations – Your data requires various APIs to access them – Your data are accessible in various data-formats

  • Data Sources

– Gathers data and serves them in an unified structure – Data can be connected to visual and/or internal components

  • Filtering

– Extracting important data sub-sets

  • Meta-data

– Inspecting structure at run-time

slide-15
SLIDE 15

15

Data Source API

  • Provided by NetBeans JavaFX Composer
  • Structure Types

– DataSource – the source – RecordSet – a list of Record instances – Record – a table of key/value entries where the value is an Object, String, Record, RecordSet, ...

  • Data Sources

– HTTP Data Source, JDBC Data Source – File, Classpath, Storage, File System

  • Parsers

– XML, JSON, Properties, Lines

slide-16
SLIDE 16

16

<Insert Picture Here>

Demo

Yahoo! Search

slide-17
SLIDE 17

17

Embedding Graphics

  • Enhances appearance and usability of applications
  • Study revealed

– Creative designers use different tools than developers – Need for designer/developer collaboration

  • JavaFX Production Suite

– Export plug-ins for 3

rd party graphic tools

– Converters for 3

rd party graphic formats

– New FXD/FXZ graphic file formats – Import and manipulation tools for developers – Allows separation of graphics and code by UI contract

slide-18
SLIDE 18

18

Designer/Developer Collaboration Workflow

Graphic prototype Content authoring Content and logic iterations Business logic development Final application Deployment

slide-19
SLIDE 19

19

Content Authoring

slide-20
SLIDE 20

20

Content Export

slide-21
SLIDE 21

21

Content Export Options

slide-22
SLIDE 22

22

NetBeans Integration

  • Support for FXD/FXZ files

– Graphics viewer – Structure navigator – Text editor

  • UI stub class generator

– Represents the entire graphic as a visual node – Provides access to labeled elements as instance fields

  • NetBeans JavaFX Composer integration

– Embedding a graphics file into a design – Manipulation with selected labeled elements

slide-23
SLIDE 23

23

<Insert Picture Here>

Demo

JavaFX Production Suite Integration

slide-24
SLIDE 24

24

Summary

  • NetBeans JavaFX Composer tool provides

– Rapid visual development of JavaFX applications – Static and dynamic UI design – Connectors to your data – Graphics integration from creative designers

  • More information

– http://netbeans.org/features/javafx/composer.html – http://wiki.netbeans.org/JavaFXComposer

  • Download

– http://www.netbeans.org/downloads/

slide-25
SLIDE 25

25

slide-26
SLIDE 26

26