At Gluon, we’re proud to deliver the open-source Devoxx conference planner, branded MyDevoxx. This project is an end-to-end Java project, meaning that the iOS and Android mobile apps are all created using a 100% Java codebase. The Gluon Mobile toolset automatically converts a Java client project into a native app for iOS and Android. The MyDevoxx project is hosted at GitHub and we hope developers can learn from, and contribute to, it.
On Thursday Mar 23, Johan Vos and Eugene Ryzhikov will talk about this project at Devoxx US, see here.
Developing a cross-platform conference scheduler for Devoxx poses a number of challenges, and requires an end-to-end solution. In the next weeks, we will go deeper in some of the specific aspects, but briefly, the interesting elements of this development include:
1. Rendering UI components.
With JavaFX, the Java platform contains a cross-platform API for rendering user interfaces. This is a high-performance, modern UI toolkit with hardware acceleration and an excellent, highly productive API. The MyDevoxx project leverages a number of standard JavaFX Controls, e.g. buttons, drop-down boxes, selectors,…
2. Rendering mobile-specific UI components.
While most of the UI concepts used in desktop applications can be used on mobile as well, there are some mobile specific restrictions and opportunities that require a more mobile-specific approach. This is where the Glisten components of Gluon Mobile come into the picture. Gluon Mobile defines a number of mobile specific controls, e.g. the NavigationDrawer. These controls follow the JavaFX custom controls patterns, and they provide functionality that is specific to mobile devices. As a consequence, existing JavaFX developers can easily use these controls in mobile projects.
Apart from providing custom controls, Gluon Mobile styles all existing JavaFX Components and adapts the styling to the mobile devices. Since JavaFX is using CSS for styling controls, this restyling is possible without requiring code changes to the standard JavaFX projects.
Applications can still override the Gluon Mobile CSS, by providing specific stylesheets. This really allows for a application-specific branding. The stylesheets used in the MyDevoxx project are located on GitHub and they contain a generic part (common.css) and some more specific parts.
3. Rendering custom UI components.
Using JavaFX, it is possible for developers to create their own custom controls. The MyDevoxx project contains such a custom control, the circular selector that is shown when starting the app, and that allows to select which Devoxx Conference you would like to view. A custom control typically follow a model-view approach, where the view is defined in a skin. The control is defined in com.devoxx.control.CircularSelector
and the skin is defined in com.devoxx.control.skin.CircularSelectorSkin
.
4. Retrieve remote data.
The Devoxx schedule is available as a REST endpoint. Data should not be retrieved every time the app is started, and in case there is no Internet connectivity, a cached version should be used. This is where Gluon Connect provide API’s for. The com.devoxx.model.DevoxxService
shows how to combine data that is added as a resource to the application (using the standard approach for reading resources in Java projects), stored to a local data storage, and retrieved from a remote Rest Endpoint.
5. Dealing with users.
Users should be able to create their schedule, both when they are on the Devoxx website as well as when they are using the mobile app. Hence, the mobile app and its backend should know which user is currently logged in. For this task, Gluon Mobile connects with Gluon CloudLink, which allows authentication of users via existing or custom social networks. For the MyDevoxx app, users can authenticate via Twitter, GitHub or Facebook. Once they are successfully authenticated, all operations (e.g. scheduling sessions and voting) can be coupled to their account.
6. Dealing with notifications.
In some cases (e.g. a session is about to start, or the session is about to end and you are requested to vote), users need to be made aware of a possible action. Typically, this is done by using notifications on mobile devices, and this is also what MyDevoxx is doing. This is achieved using the open-source project Charm-Down, which is bundled with Gluon Mobile. An example of this can be found in com.devoxx.util.DevoxxNotifications
.
7. Remote functionality.
The Devoxx Mobile app is not a standalone client application. There is much interaction going on with back-end systems. As already discussed, the Devoxx schedule is retrieved from a public REST endpoint. But there is more data interaction. When a user schedules a session, or when he votes for a session, some specific back-end API’s are called. Since the back-end protocols might change, and since we want to test the client independent from the back-end and vice versa, the client and server development is decoupled. On the client, we use Remote Functions, a component that allows to call “remote functions” from the client. On Gluon CloudLink, these remote functions and their parameters are combined with contextual information, and they trigger external functions.
In short, the MyDevoxx app was made with incredible ease through the combination of Gluon Mobile and Gluon CloudLink. We have more success stories like this in the works, as well as deep dives into the MyDevoxx app.