w3hJava

So, its a short wait. JavaFX for mobile is here. I have tried quite a good number of application on FX Mobile and its running smooth. But why to take my words, download and give a try.

New sample section is updated too + some nice new samples like Calculator, Ripple Effect and many more…

For Student, Developer, Coder or in one word for Learner(we all come in this section), have a look at JavaFX with Passion

Some of the industrial leader committed to FX, have a look : http://www.javafx.com/partners/

So, “The most pervasive and powerful mobile platform is now the most expressive” - Feel it :).

If liked it, then why not share!

With me, it happens most of the time. The basic code is over and I stuck in giving a good color to a button or a text. Now a day, a good UI is as required as basic functionality. In my 7 year of Computer life including college + work I always ran away from animations and coloring. 

Last day, I was making a button and it took me pretty much time to finish it off. But, I find a good observation from it. A simple and quick way to color a button or giving a glossy effect. Have a look at these buttons. 

If you are not a grahics designer, then you probably like these buttons. These buttons has been made with very simple effort, just a small work of Linear Gradient. But the fight is which color to put in Linear Gradient. So, here is my observation, you need to put the color which are close to each other and can be easily merged with each other. Like .. hmm :

LIGHTBLUE, DARKBLUE, LIGHTBLUE.(3rd button)

This is actually the best pattern. 

2nd button is also the result of same :

LIGHTGREEN, DARKGREEN, LIGHTGREEN.

So, check more with this simple code :

Stage {
    title: "Some Cool Buttons"
    width: 250
    height: 280
    scene: Scene {
        fill:Color.BLACK
        content: [
            Rectangle {
                x: 10,
                y: 10
                width: 90,
                height: 30
                fill: LinearGradient {
                    startX: 0.0
                    startY: 0.0
                    endX: 0.0
                    endY: 1.0
                    proportional: true
                    stops: [
                        //   Stop { offset: 0.0 color: Color.BLACK },
                      Stop {
                            offset: 0.0
                        color: Color.LIGHTGREEN },
                        Stop {
                            offset: 0.5
                        color: Color.DARKGREEN },
                        Stop {
                            offset: 1.0
                        color: Color.LIGHTGREEN }
                    ]

                }
                opacity:0.6
                arcHeight:5
                arcWidth:5
            },
            Text {
                font: Font {
                size: 12
                name: "Arial Bold"
                letterSpacing: 0.15

            }
                fill:Color.WHITE
                x: 18,
                y: 30
                content: "HelloWorld"
            } ] }

Some of my fav. combinations(2 already mentioned) :

1. Stop {
                            offset: 0.0
                        color: Color.LIME },
                        Stop {
                            offset: 0.5
                        color: Color.DARKGREEN },
                        Stop {
                            offset: 1.0
                        color: Color.LIME }

This will look awesome, if you are writing a flashy application. Very vibrant in color.

2.  Stop {
                                offset: 0.0
                            color: Color.ALICEBLUE },
                            Stop {
                                offset: 0.5
                            color: Color.BLUE },
                            Stop {
                                offset: 1.0
                            color: Color.ALICEBLUE }

3. Stop {
                                offset: 0.0
                            color: Color.ORANGE },
                            Stop {
                                offset: 0.5
                            color: Color.RED },
                            Stop {
                                offset: 1.0
                            color: Color.ORANGE }

4. A very plain and descent effect :

Stop {
                                offset: 0.0
                            color: Color.LIGHTYELLOW },
                            Stop {
                                offset: 0.5
                            color: Color.YELLOWGREEN },
                            Stop {
                                offset: 1.0
                            color: Color.LIGHTYELLOW }

Enough, please let me know your choice. Is there any pattern, you follow !

If liked it, then why not share!

In my last blog, I have added jnlp files of JavaFX samples. These are the simple steps how to do it with the help of netbeans.

Step 1: Compile the Project after this change(here my project name is Carousel) :

Project -> Properties - > Run -> Web Start Execution.

Step 2: It will generate some files :
- Project.jar
- Project.jnlp
- Project_Browser.jnlp.
- Project.html

Step 3: Open jnlp file in editpad, and you need to do some changes:

Here it will look originally:

<?xml version="1.0" encoding="UTF-8"?>

 <jnlp spec="1.0+" codebase="http://localhost:8082/servlet/

 org.netbeans.modules.javafx.project.JnlpDownloadServlet/D%3A/

 NetBeansProjects/Carousel/dist/” href=”Carousel.jnlp”>

     <information>

         <title>Carousel</title>

         <vendor>Vaibhav Choudhary</vendor>

         <homepage href=”http://localhost:8082/servlet/

 org.netbeans.modules.javafx.project.JnlpDownloadServlet/D%3A/

 NetBeansProjects/Carousel/dist/”/>

         <description>Carousel</description>

         <offline-allowed/>

         <shortcut>

             <desktop/>

         </shortcut>

     </information>

     <security>

         <all-permissions/>

     </security>

     <resources>

         <j2se version=”1.5+”/>

         <property name=”jnlp.packEnabled” value=”true”/>

         <property name=”jnlp.versionEnabled” value=”true”/>

         <extension name=”JavaFX Runtime” href=”http://dl.javafx.com/

 javafx-rt.jnlp”/>

         <jar href=”Carousel.jar” main=”true”/>

     </resources>

     <application-desc main-class=”carousel.Main”/>

 </jnlp>

Step 4: You need to change: CodeBase with what is required(means where you
uploaded the file, you need to upload jar file and jnlp(modified
file). In my case it is : http://blogs.sun.com/vaibhav/resources/.
this is where we upload file in Sun blog

Step 5: So, after change :

<?xml version="1.0" encoding="UTF-8"?>

 <jnlp spec="1.0+" codebase="http://blogs.sun.com/vaibhav/resources/”

 href=”Carousel.jnlp”>

     <information>

         <title>Carousel</title>

         <vendor>Vaibhav Choudhary</vendor>

         <homepage href=”http://blogs.sun.com/vaibhav/“/>

         <description>Carousel</description>

         <offline-allowed/>

         <shortcut>

             <desktop/>

         </shortcut>

     </information>

     <security>

         <all-permissions/>

     </security>

     <resources>

         <j2se version=”1.5+”/>

         <property name=”jnlp.packEnabled” value=”true”/>

         <property name=”jnlp.versionEnabled” value=”true”/>

         <extension name=”JavaFX Runtime” href=”http://dl.javafx.com/

 javafx-rt.jnlp”/>

         <jar href=”Carousel.jar” main=”true”/>

     </resources>

     <application-desc main-class=”carousel.Main”/>

 </jnlp>

Step 6: Look at the href: http://dl.javafx.com/javafx-rt.jnlp, this will take
care of the responsible jar or jnlp files which is required by JavaFX
Runtime. Just a word of caution, look at your lib folder as well,
which will be there in your dist directory along with jnlp and jar
files. If it has something, then upload that as well in lib/files(most
of the time it will be empty). But if you have used Java Production
Suite, there will be files like javafx-fxd.jar files :).

Step 7: In blog now just add a line(in html) :

<p style="width: 500px;"><a href="blogs.sun.com/vaibhav/resource/

 Carousel.jnlp"><img border="0" src="http://java.sun.com/products/jfc/

 tsc/sightings/images/webstart.small.jpg” /></a></p>

That’s it !

If liked it, then why not share!

Ah, finally I got JNLP working on my blog, thanks to Sergey and Vikram. I am posting some of my samples with JNLP as we can use as repository for JavaFX samples :). These all are old samples but just with JNLP, so that we can run and see the effect. 

1. Spring Motion : We can create n no. of instance of Spring class. Detail is here. This example deals with Motion, Gradient and Physics Equations.

2. 3D Button Effect:  This example is about PressButton and 3D shadow effect. Detail is here. Basic deals with Shadow Effect, Gradient, and Animation.

3. Glowing Stars in Sky: This example I have created with JavaFX Production Suite. So, we made a home in Photoshop and imported that in JavaFX and then star animation is written in JavaFX. Detail is here. This sample deals with JavaFX Production Suite, Animation, Timelines and Shapes.

4. Colliding Balls: This we have blogged some 4-5 days back. This is again a physics motion with a transparent window. Detail is here. Sample deals with Motion, Equation, Timelines and Gradient. Initial positions and colors are random, so can be wired at sometime + style: StageStyle.TRANSPARENT has been used, so we will not see any frame and so close button will be missing, please press Ctrl + F4 to close the application :). I guess, the good practice is to write esc. key event and call FX.exit().

5. Image Depth support in JavaFX:  Image depth setting or in some language we call it Z-Ordering is supported in JavaFX too. Last to last blog is about that, so here is detail. This sample basically deals with toFront and toBack API of Node and Animation(nothing cool in terms of Animation :D). 

6. Pendulum Motion with Gravity Controller: This is just the last blog. Detail is here. This sample deals with Motion, Gradient and Complex Equations, Binding Feature. I have changed the code little from the prev. blog. Now, it is transparent, so it will give us a better look

Feel free to share your experience. I hope all JNLP should work, if not please let me know. Some more I will add soon, actually all these are older samples, just tried to make repoistory, so that easy to find :).

If liked it, then why not share!