In my BB10 application I wish to overlay an ActivityIndicator
in the centre of the current screen to indicate when something (e.g. "loading") is happening.
My current solution is to embed such an indicator in the centre of a custom transparent dialog, as follows:
import bb.cascades 1.4
Dialog {
id: activityDialog
objectName: "activityDialog"
content: Container {
id: activityDialogContainer
horizontalAlignment: HorizontalAlignment.Center
verticalAlignment: VerticalAlignment.Center
// fully transparent background!
background: Color.create(0, 0, 0, 0)
layout: StackLayout {
}
ActivityIndicator {
id: theIndicator
preferredWidth: 500
preferredHeight: 500
}
Label {
id: activityLabel;
objectName: "activityLabel";
text: ""
horizontalAlignment: HorizontalAlignment.Center
verticalAlignment: VerticalAlignment.Center
}
}
onOpened: {
theIndicator.start();
}
onClosed: {
theIndicator.stop();
}
}
I can then simply open the dialog when I want to display the indicator.
The problem is that the dialog then prevents any interaction with the underlying Page
's / NavigationPane
's controls. I understand why. The dialog takes up the whole screen and although transparent still essentially hides any UI of the underlying pane.
How can I overlay an ActivityIndicator
in the centre of the screen without preventing interaction with the underlying panel's controls?
I now realised I simply need to create a DockLayout
around my main Container
and the ActivityIndicator
.