Friday, 15 January 2010

objective


The actual purpose of this program is to have a bidirectional update of all the 24 light points. Meaning that if you change something on the UI this will be reflected as a change in the embedded program state. If you change a state via the in house buttons this must also be reflect a change in the UI state. On the picture you can see the prototype based on sliders I build already and that I will describe in depth in this blog.


So finally I will have the possibility to change all my house lights whit only using one device (UI) connected via Wifi. 


Pretty challenging isn't it ?

the stage

Welcome in my first blog on the final trios user interface. I will cut the program into small pieces and explain the functionalities and also some of the related program language features and pitfalls. I will reduce the blog sizes to a minimum to obtain a clear and simple layout. 


The target device will be a HTC HD with a touch display of 480 x 800 pixels. Although a requirement is that all the java/javaFx code written can run on every platform profile using only the native javaFx that now is ported with an early access 1.2.1 on windows mobile. My IDE used is netbeans still my favorite.


Wouldn't it be a great idea to start with the main screen ? Well yes without it we don't have a UI ;-)

def SCREENWIDTH = 480;
def SCREENHEIGTH = 800;



var mainStage = Stage {
            title: "TriosView"
            scene: Scene {
                fill: Color.BLACK
                width: SCREENWIDTH
                height: SCREENHEIGTH
                content: []
            }
}

Basically the code snippet above is all you need. Notice that the content sequence is empty for now but will be filled as we go along in this blog. If you run that of course you get an empty black screen of 480 pixels width and 800 pixels height. Exactly our target screen size. I used two def (constants) to define the screen size but this can also be done using the Screen properties:


 width: Screen.primary.visualBounds.width
 height: Screen.primary.visualBounds.height

So the minimum you need to have is a Stage and a Scene than you have the basic UI components in javaFx to build the UI.