A cards-based UI for mobile and desktop IBM XPages apps, built on top of Bootcards and Bootstrap. Created by @mattwhite, @sives and @jackherbert.
XControls is a new set of Controls for IBM Domino XPage developers working on new XPages apps and on app modernisation projects. It is effectively a re-write of the Teamstudio Unplugged Controls project, but adding full support for PC browser-based user interfaces as well as mobile interfaces.
XControls is built with Bootstrap 3.x and the Bootcards project. It enables XPage developers to create controls that are responsive, optimizing to the device whether it be a smartphone, a tablet or a PC. There are three key design goals for XControls:
We think Cards are the design pattern for mobile of the future. The near future that is. Cards are appearing already on sites and apps like Twitter, Google Now, Spotify, Pinterest and Amazon. To kickstart your (and our) projects we decided to use Bootcards: a Cards-based UI framework built on top of Bootstrap and then extend it to work with IBM XPages so that you can quickly create applications that look good and work well across all devices.
Want to read more about cards? Try one of these links:
Bootcards includes stylesheets to give your apps a native look, whether that's on iOS, Android or desktop. Try opening the demo app with multiple devices and see the difference!
The demo app is a sampler that shows all of the different controls that we offer in the XControls project, from listing data in views, viewing and editing documents to working with file attachments and rich text.
The XControls are a work in progress, but we have a stable release available. You can download it directly from the GitHub repository or from the OpenNTF download page.
Want to help or want to know more? Drop us a note.
The XControls project is tested using BrowserStack.
The simplest way to get started is to download the latest release from the OpenNTF download page. Open the template in Domino Designer and then copy all of the resources, custom controls and XPages into your application.
To add XControls to your application you'll need to include the resources from our standard template. Once you've got them, have a look at some of the sample pages. Every page will need the UnpBootResources control that includes all of the CSS and JavaScript you'll use. But then there are many combinations of how to put pages together after that.