Creating User Interfaces With MoSync
Which User Interface Solution?
|Library/API||Description||Pros & Cons|
|Vanilla HTML/HTML5||Simple forms, buttons, input fields|
|MAUI C++ Library|
|NativeUI C++ Library|
|Widget C API||Our low-level C-level syscalls and IOCTLs.|
|MAUI screen with MAUI widgets (MoRE)||Widget API screen with native widgets (Android)||An HTML UI, designed using jQTouch (Android)|
Widget C API
The MoSync Widget C API is a C-based API that uses the device’s native widgets, allowing you to create apps that are identical to the ones you create with the platform’s own SDK. It also brings you the power to integrate a web browser and utilize OpenGL in your applications. The NativeUI Widget API is primarily aimed at leading-edge platforms and currently supports Android, iOS (iPhone, iPad, iTouch), and Windows Phone.
Using the Widget API gives distinct advantages when you need:
- Your application to look and feel like other applications on the platform.
- Users to intuitively understand how the app is controlled and behaves.
- The high-performance gained from Widget API’s tight integration with the OS.
- To embed OpenGL or a web browser in your application.
Note that Widget API doesn’t work on MoRE, the MoSync emulator, so you must test and develop your application using the Android emulator, iPhone simulator, the Windows Phone emulator, or use a real device.
NativeUI C++ Library
The NativeUI Library is a high-level C++ wrapper for the C-based Widget API. The Widget base class contains basic functionality and provides methods for managing widgets, like addChild, insertChild, and removeChild, and methods for manipulating widgets like setHeight, setVisible, and fillSpaceVertically.
The NativeUI Library includes a widget manager that handles widget events. This makes it easy to respond to widget events, you can select to receive specific events by setting listeners on widget objects.
MAUI uses custom non-native screens and widgets, enabling you to create application user interfaces that look exactly the same across all platforms. It runs not only on Android and iOS, but also on Windows Mobile, JavaME, Symbian, Moblin, MoRE ( the MoSync emulator ) and all the other platforms MoSync supports.
NativeUI Library, Widget API, and MAUI Together
The Widget API and MAUI are similar to the user interface APIs that you will find in proprietary SDKs. The user interface is structured as a hierarchy of components consisting of containers called screens, and controls called widgets. Different widgets have different functions and properties which can be set in order to customize their appearance or behaviour. Special types of widgets called “layouts” give you control over the positioning of other widgets on the screen. As the user interacts with the widgets, events are sent from the framework library to the application code.
You can use the HTML/CSS user interfaces, the Widget API and/or the NativeUI Library, and MAUI together in the same application, switching between Widget screens and MAUI screens as needed, giving you absolute control over the user interface.
We provide example applications the different UI libraries in the examples folder in the download package. In particular, check out HelloNativeUI, NativeUIDemo, WormholeDemo, WormholeNativeUI, and HelloMAUI. (Read our guide called Importing the Examples to understand how to load and view the examples.)
Our Introduction to MAUI tutorial covers a lot of the basics you need to get started both with MAUI and user interfaces in general.