• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
JavaOne 2011 Progressive JavaFX 2.0 Custom Components
 

JavaOne 2011 Progressive JavaFX 2.0 Custom Components

on

  • 4,343 views

 

Statistics

Views

Total Views
4,343
Views on SlideShare
2,856
Embed Views
1,487

Actions

Likes
0
Downloads
22
Comments
0

7 Embeds 1,487

http://www.xenonique.co.uk 806
http://java.dzone.com 676
http://translate.googleusercontent.com 1
http://www.javaoracleblog.com 1
http://ranksit.com 1
http://webcache.googleusercontent.com 1
http://www.rritw.com 1
More...

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution-NonCommercial-NoDerivs LicenseCC Attribution-NonCommercial-NoDerivs LicenseCC Attribution-NonCommercial-NoDerivs License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    JavaOne 2011 Progressive JavaFX 2.0 Custom Components JavaOne 2011 Progressive JavaFX 2.0 Custom Components Presentation Transcript

    • Peter Pilgrim Oracle Java Champion10/15/2011 XeNoNiQUe.co.uk (c) 2011 1
    • Blog: www.XeNoNiQUe.co.uk/blog/ Industry: Financial Services, London, UK Education: London South Bank University Languages: Scala, Java, Groovy, Clojure Conferences: JavaOne, ACCU, QCon, Devoxx10/15/2011 XeNoNiQUe.co.uk (c) 2011 2
    • “At the end of the day, on the one hand we have computer systems, and on the other, people. Connecting them together, and allowing people to interact with computer systems in a compelling way, requires graphical user interfaces Chris Oliver, Creator of F3 http://blogs.oracle.com/chrisoliver/entry/epitaph10/15/2011 XeNoNiQUe.co.uk (c) 2011 3
    • Headline News “Something that no one has mentioned and surprises me very much is that JavaFX 2.0 will only be supported on Windows...” - Max Katz, March 2011 “The major difference in the new version is that it provides Java APIs for JavaFX, allowing you to use JavaFX from within your normal Java applications” - James Sugrue, JavaLobby, May 2011 “You can write Pivot applications in Java or any other JVM language (you are not limited to JavaFX Script). ” – Greg Brown, Apache Pivot, Mailing List, Sept 201010/15/2011 XeNoNiQUe.co.uk (c) 2011 4
    • Demo10/15/2011 XeNoNiQUe.co.uk (c) 2011 5
    • The Plan What is a component? What types of component? How does binding work? Design Adaptive Process Future Work10/15/2011 XeNoNiQUe.co.uk (c) 2011 6
    • JavaFX 2.010/15/2011 XeNoNiQUe.co.uk (c) 2011 7
    • The Basics10/15/2011 XeNoNiQUe.co.uk (c) 2011 8
    • The Scene-graph is King.10/15/2011 XeNoNiQUe.co.uk (c) 2011 9
    • Customers want applications that work like today’s popular mobile devices.10/15/2011 XeNoNiQUe.co.uk (c) 2011 10
    • JavaFX forms, controls and layouts provide reinvestment .10/15/2011 XeNoNiQUe.co.uk (c) 2011 11
    • The Java platform is proven10/15/2011 XeNoNiQUe.co.uk (c) 2011 12
    • We know how to make Java run fast and it will get faster.10/15/2011 XeNoNiQUe.co.uk (c) 2011 13
    • Demo10/15/2011 XeNoNiQUe.co.uk (c) 2011 14
    • How much work must we do to reinvigorate a platform?10/15/2011 XeNoNiQUe.co.uk (c) 2011 15
    • Java Virtual Machine is the crown jewels10/15/2011 XeNoNiQUe.co.uk (c) 2011 16
    • JavaFX is written in Java, Java runs on the JVM10/15/2011 XeNoNiQUe.co.uk (c) 2011 17
    • Every Node … Every Node can have a clip node Effectively generate a bitmap mask Easy to create a “PortHole” widget Invert the selection of the clip node, you can create a “Punch” out widget10/15/2011 XeNoNiQUe.co.uk (c) 2011 18
    • Image View 1 Image View 2 Media Image View 3 Image View 410/15/2011 XeNoNiQUe.co.uk (c) 2011 19
    • Media View 1 Media View 2 Media Player Media Media View 3 Media View 410/15/2011 XeNoNiQUe.co.uk (c) 2011 20
    • Breaking Glass1. Divide a bounded area into four triangles2. Are we there yet?3. For each triangle A. Choose a random side and split it to two rectangles B. Recursive descend the two triangles (step 2)10/15/2011 XeNoNiQUe.co.uk (c) 2011 21
    • Express Yourself10/15/2011 XeNoNiQUe.co.uk (c) 2011 22
    • JavaFX Properties.10/15/2011 XeNoNiQUe.co.uk (c) 2011 23
    • Properties Primitive Properties Object Properties FX List Collection Properties10/15/2011 XeNoNiQUe.co.uk (c) 2011 24
    • Listeners Change Listener  Observable, old value, new value Invalidation Listeners  Observable10/15/2011 XeNoNiQUe.co.uk (c) 2011 25
    • Property Listener Example10/15/2011 XeNoNiQUe.co.uk (c) 2011 26
    • Properties of Component10/15/2011 XeNoNiQUe.co.uk (c) 2011 27
    • Code Generate JavaFX Properties e.g. Groovy10/15/2011 XeNoNiQUe.co.uk (c) 2011 28
    • Hey Ho! This is all just to say: var temparature: Integer = 23 on replace oldValue { println(“temperature={temperarture}, oldValue={oldValue}” } // JavaFX Script 1.310/15/2011 XeNoNiQUe.co.uk (c) 2011 29
    • JavaFX Components10/15/2011 XeNoNiQUe.co.uk (c) 2011 30
    • A pad, a paper and a pen, first!10/15/2011 XeNoNiQUe.co.uk (c) 2011 31
    • A JavaFX component is an encapsulation that binds a particular tree set of nodes with the operations that act on those nodes10/15/2011 XeNoNiQUe.co.uk (c) 2011 32
    • Component Types Non-Resizable  javafx.scene.shape.Shape  javafx.scene.Group Resizable  javafx.scene.layout.Pane  javafx.scene.layout.Region  javafx.scene.layout.Control10/15/2011 XeNoNiQUe.co.uk (c) 2011 33
    • Group based Particularly using the JavaFX primitive nodes under javafx.scene.shape.*; Design is not meant to be resized Layout is fixed at construction / initialisation time10/15/2011 XeNoNiQUe.co.uk (c) 2011 34
    • Region based Region is the sub class of javafx.scene.Parent Adds the ability to resize a node, layout a particular set of children10/15/2011 XeNoNiQUe.co.uk (c) 2011 35
    • Control based Allows particular subclass of Region that permits skinning of node with a stylesheet You need 3 classes  The Control java.scene.control.Control type  The Skinnable java.scene.control.Skinnable  The Behaviour com.sun.javafx.scene.control.BehaviorBase10/15/2011 XeNoNiQUe.co.uk (c) 2011 36
    • Control based Allows particular subclass of Region that permits skinning of node with a stylesheet Control is a direct type of Parent You need 3 classes  The Control java.scene.control.Control type  The Skin java.scene.control.Skin java.scene.control.Skinnable  The Behaviour com.sun.javafx.scene.control.Behavior10/15/2011 XeNoNiQUe.co.uk (c) 2011 37
    • Control based contd See JFXtras.org for more examples of skinnable components written for JavaFX 2.0 beta 45 A Skin can be a Region (?)com.sun.javafx.scene.control.BehaviorBasecom.sun.javafx.scene.control.SkinBase10/15/2011 XeNoNiQUe.co.uk (c) 2011 38
    • Layout Children Methodvoid layoutChildren() Layout all of the children of a Region based component10/15/2011 XeNoNiQUe.co.uk (c) 2011 39
    • Layout Children Methodvoid layoutChildren() Layout all of the children of a Region based component Compute the preferred width and height of the children (first) May cache those values internally as part of the component or use Constraints10/15/2011 XeNoNiQUe.co.uk (c) 2011 40
    • Layout Boundaries SDK will make a request to find out the best width and height of your component. Your component must do the same for its children Implement at least compute pref width and pref height methods!10/15/2011 XeNoNiQUe.co.uk (c) 2011 41
    • Layout Methods10/15/2011 XeNoNiQUe.co.uk (c) 2011 42
    • Pedantic CompleteImplement the other four methods too computeMinWidth(v) computeMinHeight(v) computeMaxWidth(v) computeMaxHeight(v)10/15/2011 XeNoNiQUe.co.uk (c) 2011 43
    • Demo10/15/2011 XeNoNiQUe.co.uk (c) 2011 44
    • Writing JavaFX Containers10/15/2011 XeNoNiQUe.co.uk (c) 2011 45
    • Event Input on Node Mouse Events fall under the pointer iteraction (single)  Clicked, Entered, Exited, Pressed, Dragged, Released, Wheel  Target Entered, Target Exited Key Events  Clicked, Pressed, Released10/15/2011 XeNoNiQUe.co.uk (c) 2011 46
    • Event Input on Node It is possible to consume an event and stop it bubbling further down the scenegraph hierarchy You can block a component from event interaction Using clever tricks (opaque shape) you can implement dialog / focus / modal behaviour10/15/2011 XeNoNiQUe.co.uk (c) 2011 47
    • Layout Secrets10/15/2011 XeNoNiQUe.co.uk (c) 2011 48
    • Reuse SDK Methods10/15/2011 XeNoNiQUe.co.uk (c) 2011 49
    • Some SDK Methods Region#layoutInArea() Region#positionInArea() Node#resize() Node#resizeRelocate()10/15/2011 XeNoNiQUe.co.uk (c) 2011 50
    • Demo10/15/2011 XeNoNiQUe.co.uk (c) 2011 51
    • Tips When Dragging a Node prefer to translate (X,Y) When Laying Out a Node prefer to set the position with layoutX, layoutY Given steady state conditions you can swap layout (X,Y) for translation (X,Y)10/15/2011 XeNoNiQUe.co.uk (c) 2011 52
    • Tips 2 Use blocking boolean flags to prevent conflict when you animating children in a container If you are unsure about MT concurrency you can always use AtomicBoolean Prefer JavaFX Properties10/15/2011 XeNoNiQUe.co.uk (c) 2011 53
    • Tools10/15/2011 XeNoNiQUe.co.uk (c) 2011 54
    • Tools We badly need a JavaFX Property plug- in for various IDE Otherwise the Groovy script will do for now Scene Builder is coming FXML is always10/15/2011 XeNoNiQUe.co.uk (c) 2011 55
    • Alternative JVM Languages Still new to comment on the best practice for writing component in other languages other than Java Consider using a Java interface Prefer to use and expose JavaFX Properties Learn JavaFX against Java, First!10/15/2011 XeNoNiQUe.co.uk (c) 2011 56
    • Six Months, 2012 … Okay!10/15/2011 XeNoNiQUe.co.uk (c) 2011 57
    • Design Think of JavaFX as a sophisticated composition engine á la PhotoShop without the pixel access Learn U/I/X design from elsewhere10/15/2011 XeNoNiQUe.co.uk (c) 2011 58
    • Boagworld.com10/15/2011 XeNoNiQUe.co.uk (c) 2011 59
    • Books10/15/2011 XeNoNiQUe.co.uk (c) 2011 60
    • End Game10/15/2011 XeNoNiQUe.co.uk (c) 2011 61
    • Blow your toe off now!10/15/2011 XeNoNiQUe.co.uk (c) 2011 62
    • However, we are behind the wave! Let us learn from the web technologists and the mobile app leaders and ran past them!10/15/2011 XeNoNiQUe.co.uk (c) 2011 63
    • Test JavaFX 2.0 User Interface against your target users BEFORE and AFTER10/15/2011 XeNoNiQUe.co.uk (c) 2011 64
    • Learn more http://xenonique.co.uk/blog/ peter.pilgrim@gmail.com http://javafx.com/ twitter:peter_pilgrim10/15/2011 XeNoNiQUe.co.uk (c) 2011 65
    • Professional Services peter.pilgrim@gmail.com JavaFX 2.0 in Enterprises Contracting Training with Consultancy Technical Leadership10/15/2011 XeNoNiQUe.co.uk (c) 2011 66
    •  Can I have a HIRES JavaFX logo please? A work in Progress Source Code to be added Demos to be completed in September10/15/2011 XeNoNiQUe.co.uk (c) 2011 67
    • AttributionsAll images are Creative Commons (CC) License from Flickr.com– “You must attribute the source and you cannot change the content”Tim Ellis http://www.flickr.com/photos/tim_ellis/Lego Basics http://www.flickr.com/photos/tim_ellis/338755101/sizes/l/*PaysImaginaire* http://www.flickr.com/photos/nevrlndtink/Variable Plastic Bag http://www.flickr.com/photos/nevrlndtink/232906118/sizes/m/~Deiby http://www.flickr.com/photos/deiby/Expression http://www.flickr.com/photos/deiby/5489382677/sizes/l/Lisa Sinclair http://www.flickr.com/photos/plumandjello/fruit http://www.flickr.com/photos/plumandjello/2333263539/sizes/l/Nerovivo http://www.flickr.com/photos/dominik99/http://www.flickr.com/photos/dominik99/407716865/sizes/z/in/photostream/10/15/2011 XeNoNiQUe.co.uk (c) 2011 68
    • AttributionsAll images are Creative Commons (CC) License from Flickr.com– “You must attribute the source and you cannot change the content”.Guilty http://www.flickr.com/photos/roll_initiative/Arbitrary Function Generator http://www.flickr.com/photos/roll_initiative/3278642272/Loop Oh Rupert Grazer http://www.flickr.com/photos/loop_oh/Pattern at the Senckenberg Museum in Frankfurt am Main / Germany. http://www.flickr.com/photos/loop_oh/4571485915/Lili Vieira de Carvalho, Vancouver, Canada http://www.flickr.com/people/lilivc/Composition of Bowls http://www.flickr.com/photos/lilivc/367582911/sizes/l/Mykl Roventine http://www.flickr.com/people/myklroventine/19/365 Game Over http://www.flickr.com/photos/myklroventine/3210068573/sizes/l/superciliousness / Bentley Smith http://www.flickr.com/people/superciliousness/200510 carpenters tools - inside the workmans shed - all his old tools http://www.flickr.com/photos/superciliousness/57486288/10/15/2011 XeNoNiQUe.co.uk (c) 2011 69
    • AttributionsAll images are Creative Commons (CC) License from Flickr.com– “You must attribute the source and you cannot change the content”You’ve got a fast car http://www.flickr.com/photos/coreforce/5910961411/Core Force http://www.flickr.com/photos/coreforce/GAME AT MARBLES http://www.flickr.com/photos/9619972@N08/928099769/sizes/l/in/photostream/(Author unknown, from an antique childrens booLucs Game http://www.flickr.com/photos/9619972@N08/928099769/just.Luc http://www.flickr.com/people/9619972@N08/DIY Easel http://www.flickr.com/photos/68888883@N00/2744696593/in/photostream/Judy of the Woods http://www.flickr.com/people/68888883@N00/10/15/2011 XeNoNiQUe.co.uk (c) 2011 70
    • Beyond Java Today10/15/2011 XeNoNiQUe.co.uk (c) 2011 71
    • Beyond Java Future 2016?10/15/2011 XeNoNiQUe.co.uk (c) 2011 72