JavaFXPluginTutorial

(Difference between revisions)
(Create a simple JavaFX Application)
 
(6 intermediate revisions not shown)
Line 4: Line 4:
# Go to the [http://download.netbeans.org/netbeans/6.8/beta NetBeans Download page]
# Go to the [http://download.netbeans.org/netbeans/6.8/beta NetBeans Download page]
-
<span style="color: 'red'">Spell out NetBeans. Correct Link to full version when available.</span>
+
# Download and Install one of the following options
-
# Download the NetBeans with the JavaFX bundle
+
-
<span style="color: 'red'">Change to indicate "Download and Install of one of
+
## NetBeans 6.8 with the JavaFX Bundle
## NetBeans 6.8 with the JavaFX Bundle
## NetBeans 6.8 Full installation
## NetBeans 6.8 Full installation
-
## NetBeans 6.8 (any version) and add the JavaFX Plugins from the Tools->Plugins->Available Plugins dialog.</span>
+
## NetBeans 6.8 (any version) and add the JavaFX Plugins from the Tools->Plugins->Available Plugins dialog.
-
# Launch the installer
+
-
<span style="color: 'red'">Remove</span>
+
==Create a simple JavaFX Application==
==Create a simple JavaFX Application==
-
# Run the IDE
+
# Launch the IDE
-
<span style="color: 'red'">Change "Run" to "Launch" or "Start"</span>
+
# Invoke <tt>File| New Project...</tt> from the main menu bar.
-
# Invoke <tt>Tools | New Project...</tt> from the main menu bar.
+
-
<span style="color: 'red'">Change "Tools" to "File"</span>
+
# Under Categories, select <tt>JavaFX</tt>.
# Under Categories, select <tt>JavaFX</tt>.
# Under Projects, select <tt>JavaFX Script Application</tt>.
# Under Projects, select <tt>JavaFX Script Application</tt>.
Line 32: Line 26:
<pre>
<pre>
import javafx.stage.*;
import javafx.stage.*;
-
 
import javafx.scene.*;
import javafx.scene.*;
import javafx.scene.text.*;
import javafx.scene.text.*;
import javafx.scene.paint.*;
import javafx.scene.paint.*;
import javafx.scene.effect.*;
import javafx.scene.effect.*;
-
 
Stage {
Stage {
-
title: "JavaFX Hello World"
+
    title: "JavaFX Hello World"
-
width: 250
+
    width: 250
-
height: 80
+
    height: 80
-
scene: Scene {
+
    scene: Scene {
-
content: Text {
+
        content: Text {
-
x: 10 y: 30
+
            x: 10 y: 30
-
font: Font { size: 24 }
+
            font: Font { size: 24 }
-
fill: Color.BLUE
+
            fill: Color.BLUE
-
effect: DropShadow{ offsetX: 3 offsetY: 3}
+
            effect: DropShadow { offsetX: 3 offsetY: 3 }
-
content: "Hello World!"
+
            content: "Hello World!"
-
}
+
        }
-
}
+
    }
}
}
 +
</pre>
</pre>
-
<span style="color: 'red'">REPLACE WITH:
+
# Change title "Application title" to "JavaFX Hello World"
-
# Change your application Title
+
-
## Change _title: "Application title"_ to _title: "JavaFX Hello World"_
+
# Add Content to your page
# Add Content to your page
## Change the font size to 24
## Change the font size to 24
-
## Add a Fill to your Text content by dragging a color oject into the text block
+
## Add the "fill:" attribute to the Text node
-
### Add a "fill:" member to the text block
+
## Drag the color you want from the palette and drop it in the code immediately following the "fill:"
-
### drag the color you want from the palette and drop it in the code immediately following the "fill:"
+
## Add the "effect:" attribute to the text block
-
## Add a Drop Shadow effect to your Text content by dragging a Drop Shadow effect into the Text Block.
+
## Drag the Drop Shadow effect from the palette and drop it in the code immediately following the "effect:"
-
### Add ae "effect:" member to the text block
+
-
### drag the Drop Shaddow effect from the palette and drop it in the code immediately following the "effect:"
+
## Change the content from "Application Text" to "Hello World!"
## Change the content from "Application Text" to "Hello World!"
-
</span>
+
 
9. Press <tt>F6</tt> to run the JavaFX project
9. Press <tt>F6</tt> to run the JavaFX project
Line 72: Line 61:
[[File:javafx_helloworld_JavaFXPluginTutorial.png]]
[[File:javafx_helloworld_JavaFXPluginTutorial.png]]
-
 
+
==To learn more about JavaFX==
-
 
+
-
==JavaFX Script language Tutorial==
+
-
<span style="color: 'red'">Change this heading to "To learn more about JavaFX"</span>
+
Use the [http://java.sun.com/javafx/1/tutorials/ui JavaFX Tutorial Overview] to create JavaFX Script applications which include
Use the [http://java.sun.com/javafx/1/tutorials/ui JavaFX Tutorial Overview] to create JavaFX Script applications which include

Current revision as of 14:30, 25 November 2009

Contents


Install NetBeans 6.8 Beta and JavaFX plugin

  1. Go to the NetBeans Download page
  2. Download and Install one of the following options
    1. NetBeans 6.8 with the JavaFX Bundle
    2. NetBeans 6.8 Full installation
    3. NetBeans 6.8 (any version) and add the JavaFX Plugins from the Tools->Plugins->Available Plugins dialog.

Create a simple JavaFX Application

  1. Launch the IDE
  2. Invoke File| New Project... from the main menu bar.
  3. Under Categories, select JavaFX.
  4. Under Projects, select JavaFX Script Application.
  5. Click Next.
  6. In the Project Name field, type HelloWorld.
  7. Click Finish.
  • The HelloWorld JavaFX project is created
  • The Main.fx file opens

File:javafx_project_JavaFXPluginTutorial.png

8. Copy the code to the editor

import javafx.stage.*;
import javafx.scene.*;
import javafx.scene.text.*;
import javafx.scene.paint.*;
import javafx.scene.effect.*;

Stage {
    title: "JavaFX Hello World"
    width: 250
    height: 80
    scene: Scene {
        content: Text {
            x: 10 y: 30
            font: Font { size: 24 }
            fill: Color.BLUE
            effect: DropShadow { offsetX: 3 offsetY: 3 }
            content: "Hello World!"
        }
    }
}

  1. Change title "Application title" to "JavaFX Hello World"
  2. Add Content to your page
    1. Change the font size to 24
    2. Add the "fill:" attribute to the Text node
    3. Drag the color you want from the palette and drop it in the code immediately following the "fill:"
    4. Add the "effect:" attribute to the text block
    5. Drag the Drop Shadow effect from the palette and drop it in the code immediately following the "effect:"
    6. Change the content from "Application Text" to "Hello World!"


9. Press F6 to run the JavaFX project

  • The JavaFX Hello World application appears

File:javafx_helloworld_JavaFXPluginTutorial.png

To learn more about JavaFX

Use the JavaFX Tutorial Overview to create JavaFX Script applications which include

  • 2D Graphics
  • UI Controls
  • Effects
  • Animation
  • Video and Audio

Learn more about the JavaFX Script language

JavaFX Plugin Features

  • Editor
  • Code Highlighting
  • Code Completion
  • Source Navigation
  • Code Folding
  • Javadoc
  • Error Detection
  • Refactoring
  • To enable the refactoring add the -J-Djavafx.refactoring=true flag to the netbeans.conf file
  • Palette
  • Deployment
  • Desktop
  • Applet
  • WebStart
  • Mobile Emulator
  • Debuger
  • Profiler
Not logged in. Log in, Register

By use of this website, you agree to the NetBeans Policies and Terms of Use. © 2012, Oracle Corporation and/or its affiliates. Sponsored by Oracle logo