These pages contain documentation about each of the custom controls which are provided for use with Teamstudio Unplugged
The aim of the Controls is that you will be able to quickly build a mobile application to deploy onto Teamstudio Unplugged, which runs on iOS and Android devices. We assume that you have used XPages before, but the actual use of the Controls is not difficult, so you shouldn't need to have massive experience of mobile or web development to be able to create an application.
The full issues list for 3.4 can be viewed here.
In version 3 of the Controls we have significantly changed how things work, we've got new CSS, new JavaScript, more efficient native scrolling support and had a general overhaul of the Controls. So if you're upgrading an application we highly recommend that you replace all of the Controls, Stylesheets, Files etc. It might mean a little work to re-compile your XPages but will make life easier in the long run.
We have also released a new Restyler tool which will allow you to create your own custom themes by changing colours, fonts and other CSS settings without having to make any code changes. For more details, please visit the Restyler website.
These Controls will work for "normal" Mobile Web Development as well, so they can be accessed via the web browsers on your iPhone, iPad, or Android device.
Detailed usage instructions for each control are available from the menu on each page.
Upgrading your application from a previous version of the Controls Library can be made easier by following some of our guidelines.
We also provide some generic classes which you can use in static HTML .
You will be building two types of XPage, firstly the "Main" page which will handle the application layout. All of the other pages are going to be requested via Ajax so we only need to include the content section for those.
The main XPage is going to control the display of the page including the header, views list and footer. The XML below show an example of the main page you'll want to create:
As well as including Unpheader, UnpNavigator, UnpScrollableArea, UnpFlatView, and UnpFooter Controls you will always want to include the unplugged.css file.
You'll notice the <div> called "content" which is used as a placeholder into which we can load the sub XPages using Ajax.
Continuing the example above, when the user clicks the By Date link we want to load a new Sub XPage and insert the contents of it into the "content" container. This sub page is simply going to use the UnpScrollableArea and UnpFlatView Controls and doesn't need the header or footer as they have already been loaded on the UnpMain XPage.
This is the XML required for the UnpDate XPage: