To install the Toolbar plugin, use the Cordova command line interface.
Prerequisites
Set up the development environment.
Create your Cordova project.
Add your OS platforms.
Procedure
Add the Toolbar plugin by entering the following at the command prompt, or terminal:
cordova plugin add kapsel-plugin-toolbar --searchpath
KAPSEL_HOME/plugins
Note KAPSEL_HOME=C:\SAP\MobileSDK3\KapselSDK .
Update the activity theme in the Android manifest file. For Android, the following message
is shown in the output for the pluginadd command.
For Android you need to modify the activity theme in the AndroidManifest.xml to be android:theme="@android:style/Theme.Holo".
The minSdkVersion must also be changed to at least 11.
To change the theme, modify the AndroidManifest.xml file for your
application to change
<activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/app_name" android:name="LogonDemo" android:theme="@android:style/Theme.Black.NoTitleBar">
to
<activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/app_name" android:name="LogonDemo" android:theme="@android:style/Theme.Holo">
Add a method to handle adding and removing toolbar items depending on the state of the
application. For example:
function addToolbarMenuItems(screenID) {
sap.Toolbar.clear();
if (screenID == "LoadingDiv") {
//Do not add any toolbar items.
}
else if (screenID == "LockedDiv") {
sap.Toolbar.addItem({"label" : "UnLock", "icon" : "ic_action_not_secure", "showAsAction" : sap.Toolbar.SHOW_AS_ACTION_ALWAYS }, function() {unlock();});
}
else if (screenID == "MainDiv") {
sap.Toolbar.addItem({"label" : "Read", "icon" : "ic_action_refresh", "showAsAction" : sap.Toolbar.SHOW_AS_ACTION_ALWAYS | sap.Toolbar.SHOW_AS_ACTION_WITH_TEXT }, function() {clearTable();read();});
if (applicationContext == null) {
sap.Toolbar.addItem({"label" : "Register", "icon" : "ic_action_add_person", "showAsAction" : sap.Toolbar.SHOW_AS_ACTION_ALWAYS }, function() {register();});
}
else {
sap.Toolbar.addItem({"label" : "UnRegister", "icon" : "no_icon", "showAsAction" : sap.Toolbar.SHOW_AS_ACTION_WITH_TEXT }, function() {unRegister();});
}
sap.Toolbar.addItem({"label" : "Lock", "icon" : "ic_action_secure", "showAsAction" : sap.Toolbar.SHOW_AS_ACTION_ALWAYS }, function() {lock();});
}
}
(Optional) To see a list of installed plugins in your Cordova project, open a
command prompt or terminal window, navigate to your Cordova project folder, and
enter:
cordova plugins
The Cordova command line interface returns a JSON array showing installed
plugins, for
example:
[ 'cordova-plugin-camera',
'cordova-plugin-device-motion',
'cordova-plugin-file' ]
This
example shows that the Cordova project has the Cordova core Camera,
Accelerator (device-motion), and File plugins installed.
Modify the files in the Cordova project's www folder as
appropriate for your project.
Execute the following command to copy the files in the Cordova project's
www folder to the platform directories:
cordova prepare android
cordova prepare ios
cordova prepare windows
Use an integrated development environment to deploy and run the project.
Note If you are using an iOS device, ensure to add the "clienthubEntitlements" to the Keychain
Groups in the Entitlement section in Xcode.
If you have added icons, perform a clean command to ensure the new icons appear.