Please take a look at the workflow in ‘Strict’ Mode – explained in detail here.
All works well and looks great on Touch Device and I have tried to minimze the Touch Gestures / Taps you have to do while starting a new Tracking.
Same will also work on a Keyboard Device like Q10 or Q5 – demonstrated in detail for ‘Free’Mode here.
hmmm – there’s a keyboard integrated – can we do it even faster ? Yep !
Type’n’Go TimeTracker:
G → (Alt-n) → G → G → G
That’s all 🙂
Let’s take a look how this works:
At first there’s the HomeScreen:
Typing ‘G‘ will do the same as Tapping on the Action ‘go‘ – if you don’t know which Key to type, tap on the overflow menu (three dots):
Please notice the small shortcut listed in top-right corner. This is only visible on a keyboard device. Developing this is easy:
ActionItem {
id: startStopAction
title: trackedTimeContainer.running ? qsTr("STOP") : qsTr("START")
ActionBar.placement: ActionBarPlacement.OnBar
imageSource: trackedTimeContainer.running ? "asset:///images/stop.png" : "asset:///images/go.png"
onTriggered: {
if (trackedTimeContainer.running) {
pushTimeStopper()
} else {
pushTimeStarter()
}
}
shortcuts: [
Shortcut {
enabled: trackedTimeContainer.running
key: qsTr("s")
},
Shortcut {
enabled: !trackedTimeContainer.running
key: qsTr("g")
}
]
}
This Action is a Toggle between Start and Stop, so there are two different titles, Icons and also ShortCuts.
Important: please don’t only add your shortcut this way:
key: “s”
surround the Key with qsTr() – then you can translate the key into different languages. It’s not an easy task to find unique letters through the app – esp. because there are some default keys already used (and translated) by the System to Edit, Zoom, Delete etc. Take a look at the documentation.
Back to our workflow: ‘G’ opens the next Page where you can select the Category:
If the selected Category is OK we simply type again ‘G‘ to go on. To select another category without moving your fingers to the Icon and Tapping you can type ‘alt n‘ to get this:
The Selection Marker was moved from ‘Working Time’ to ‘Work Readyness’. Typing alt-n again and again the Marker will cycle through all Categories.
Then typing ‘G‘ you can Go On to the next Page – typing ‘U‘ you can cancel (Undo) the workflow.
Shortcuts for ‘G’ and ‘U’ are similar to the Action from HomeScreen:
ActionItem {
title: qsTr("Cancel")
ActionBar.placement: ActionBarPlacement.OnBar
imageSource: "asset:///images/ic_cancel.png"
onTriggered: {
cancelAndBack()
}
shortcuts: [
SystemShortcut {
type: SystemShortcuts.Undo
}
]
},
ActionItem {
title: qsTr("Go On")
imageSource: "asset:///images/ic_next.png"
ActionBar.placement: ActionBarPlacement.OnBar
onTriggered: {
saveAndGoOn()
}
shortcuts: [
Shortcut {
key: qsTr("g")
}
]
}
Only different: ‘U’ (Undo) is a predefined SystemShortcut, where ‘G’ is a custom Shortcut.
Categories are displayed using a ListView with a simple ArrayDataModel. Besides the Category Icon there’s a green Marker Icon, This Marker Icon is only visible if Category Id == selected Id.
Categories will be selected by Tapping on an ImageView and Going On with selected Category from ListView function onTriggered{}:
onTriggered: {
newCategory = categoryDataModel.data(indexPath)
saveAndGoOn()
}
Nothing special.
To enable Shortcuts we have to tell Cascades that the ListView should receive Keys (input.route) and to add shortcuts to the ListView itself:
ListView {
id: categoryList
inputRoute.primaryKeyTarget: true
shortcuts: [
Shortcut {
key: qsTr("Alt + n")
onTriggered: {
toggleCategory()
}
}
]
function toggleCategory(){
if(newCategory < 5){
newCategory +=1
} else {
newCategory = 0
}
}
}
‘G’oing on opens the next Page with details.
Request Focus
There are no or up to three Input Fields on the next Page: Project, Order, Task. It depends from Settings – Categories which fields will be displayed.
To enter data on a Touch Device you simply Tap on the field and enter the data. On a keyboard device it would be nice to enter data immediately without tapping into a field. That’s the reason why we need requestFocus().
Hint: think carefully when to request the focus, because on a Touch device the virtual keyboard will come up and perhaps this is not what user expects. So I’m always testing if working on a Device with a physical keyboard:
bool ApplicationUI::isKeyboardDevice() {
bb::device::HardwareInfo hardware;
return hardware.isPhysicalKeyboardDevice();
}
and here’s the code from QML:
function requestFocusFirstField(){
if(!app.isKeyboardDevice()){
return
}
if(projectContainer.visible){
if(projectText.text.length == 0){
projectText.requestFocus()
return
}
}
if(orderContainer.visible){
if(orderText.text.length == 0){
orderText.requestFocus()
return
}
}
if(taskContainer.visible){
if(taskText.text.length == 0){
taskText.requestFocus()
}
}
}
I’m checking if the field is visible and also if there’s already some text typed.
If visible and field is empty User can start typing immediately.
TimeTracker Shortcuts
TimeTracker only uses less easy-to-remember Shortcuts:
- G:
- Go / Start / Go On
- S:
- Stop / Stop+Go
- U:
- Undo / Cancel
- E:
- Edit
- alt N:
- Next Category / Next Selection
- alt shift R:
- Refresh
- 1,2,3,4:
- Select Tab #1 … #4
- +:
- Add new Record
Hint: to type a ‘1’ on Q10 you have to type ‘alt w’. Adding a Shortcut’1′ to an Action doesn’t work, adding ‘alt w’ works, but then also ‘alt w’ is displayed as shortcut from menu. You can use a trick: define two shortcuts and the first one will be displayed:
shortcuts: [
Shortcut {
key: "1"
},
Shortcut {
key: qsTr("Alt + w")
}
]
Business Users want to be productive
I really recommend every developer to think carefully about using Shortcuts to simplify workflows or speed things up: BlackBerry Business App Users want to be productive !
- Overview (Devices, Orientation, Themes)
- Orientation (Portrait + Landscape vs Square)
- Themes (OS 10.2)
timetracker10.wordpress.com 
You must be logged in to post a comment.