Cascades Development

[peter9477]

---

Ebscer wrote:

The documentation hints that a QML approach is possible, but I have yet to get that to work.

---

I've just got this working in QML... rather surprised how easy it turned out to be, given that I'd attempted this earlier and got nowhere.  igosoft's examples were a big help in distilling it down to something simple that works.

First, in the C++, you need to register the classes:

#include <bb/cascades/SceneCover>
#include <bb/cascades/AbstractCover>

...

// could put these in a custom namespace but I like having
// them in bb.cascades by default
qmlRegisterType<SceneCover>("bb.cascades", 1, 0, "SceneCover");
qmlRegisterUncreatableType<AbstractCover>("bb.cascades", 1, 0, "AbstractCover", "");

Then in your application, add a .qml file for your cover object. I based this directly on igosoft's.

import bb.cascades 1.0

SceneCover {
    property alias extraText: bottomText.text

    content: Container {
        layout: DockLayout {}

        ImageView {
            imageSource: "cover_image.png"
            verticalAlignment: VerticalAlignment.Center
            horizontalAlignment: HorizontalAlignment.Center
        }

        Label {
            text: "Small text at top"
            verticalAlignment: VerticalAlignment.Top
            horizontalAlignment: HorizontalAlignment.Center
            textStyle.fontSize: FontSize.XSmall
            textStyle.color: Color.Black
        }

        Label {
            id: bottomText
            text: ""
            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Bottom
            textStyle.fontSize: FontSize.XLarge
            textStyle.color: Color.Black
        }
    }
}

In the main QML file:

Page { // or whatever
...

    attachedObjects: [
        AppCover {
            id: appCover

            extraText: '[' + time_left + ']';
        }
    ]
...

    onCreationCompleted: {
        Application.setCover(appCover);
    }
}

In this particular app, I have a QTimer which is updating the "time_left" property periodically, and every 30s as igosoft says, it gets updated in the SceneCover.

As also noted, I assume this needs run_when_backgrounded, though in this particular app I already need that for other reasons.  I'm thinking there are apps which can respond (e.g. to invocation requests) without run_when_backgrounded, but I'm wondering if those would work properly with a QML-based SceneCover. I think one of the RIM guys mentioned a while back that the QML engine would basically be disabled without run_when_backgrounded, so unless the app were temporarily moved out of the "stopped" partition when it was responding to an invocation (which is quite possible) then changes to the cover made from QML would not work in those cases. I'm sure I'll be testing that in the next few weeks at some point anyway...

[peter9477]

I should also note that this appeared to be messing up my clean shutdown, with one of those apparently spurious "Application did not respond to exit" dialogs, until I added "Application.setCover(none)" in my onManualExit handler. Maybe that will be unnecessary after the next beta.

[MedNez]

Hm,

(Sorry to keep bugging you with these questions on a similiar line...!)

I've tried to implement this and it half works - it was giving me the application slayed message too, so I implemented my own onManualExit handler and sorted that out.

However instead of showing my cover, it almost bizarrely resamples whatever screen is available, so it shows the top left corner of the screen that was minimised. If I comment out Application.setCover(appCover) it just minimises the screen properly.

The order of the code also seems to matter:

// whatever
onCreationCompleted: {
    navPane.push(screen);
    Application.thumbnail.connect(thumbnailed);
    Application.setCover(appCover);
    Application.onManualExit(exitApp);
    Application.setAutoExit(false);
}

Anything affter the Application.onManualExit doesn't work -- if I add the navPane.push after that nothing works. 

Ergh... just when I thought I had it!

my appCover is defined as:

SceneCover {
    id: appCover
}

And SceneCover.qml has a simple layout:

SceneCover {
   layout: AbsoluteLayout {}
   // one background image
}

The background image is just a solid colour png to test it. But it doesn't load it, as I said, and just weirdly resamples the screen...

[peter9477]

Have you checked your log output (slog2info) for any errors arising from that?

You don't show the details of the // one background image, but are you specifying it with the "content: " property label in front, or just sticking an ImageView in there or something? I got errors when I didn't explicitly specify content: ...

[MedNez]

Nope No errors. 

And sorry, full code context:

SceneCover.qml:

import bb.cascades 1.0

SceneCover {
    
    content: Container {
        layout: AbsoluteLayout{}
        
        ImageView {
            imageSource: "asset:///images/backgrounds/cover.png"
        }
        
    }   
    
}

In main.qml, the main page container has this:

attachedObjects: [
    SceneCover {
        id: appCover  
    },
    // other attached things
]

 Followed by:

onCreationCompleted: {
    
    navPane.push(levelSelect);
    navPane.push(homeScreen);
    
    Application.setCover(appCover);

    Application.thumbnail.connect(thumbnailed);
    
    Application.onManualExit(exitApp);
    Application.setAutoExit(false);
    
} 

And for full disclosure:

exitApp() is defined at the root of the page as:

function exitApp()
{
    Application.resetCover();
    exitApplication();   
}
    

And thumbnailed() just pushes a screen, which works fine.

I suppose a few questions:

1. Have I got the SceneCover stuff correct? (They are defined properly in my app.cpp file). 

2. Have I got the app exiting correct? 

[peter9477]

Oh... you named it SceneCover.qml ?

I'm guessing that's going to be a problem... rename the file, fix up the attachedObjects reference to it, and try that instead. You likely shouldn't be using the same name as the SceneCover class for your custom component based on it. Check my example...

[MedNez]

Aha! That worked. You really should write the docs on this! They do need updating!

For anyone else trying to follow this in future, I also changed my onManualExit() handling function to the following:

myExitFunction() 
{
    Application.setCover(0);
    Application.quit();
}

I changed it from setCover(none) to setCover(0) based on the documentation which specifies 0 as the default value.

You are a champion!

[bcs925]

Would it be too much to ask for someone to make a "Hello Scene Cover" example? 

No offense to igosoft but the sample he posted has lots of other stuff in there.  And I just can't get it working in one of my existing project, only works when I use a full example and delete out the stuff I know I don't want.  Pretty much I'd like to see a new project (with the generic hello world that comes in a blank Cascades new project) plus whatever additional code it take to call in a Scene Cover and have the Scene Cover be it own QML page? (even if it just a another label saying "Hello Active Frame"l).

[MedNez]

Done!

If Peter doesn't mind, I wouldn't mind just getting a 2nd pair of eyes on it before I post to Github? I will send him the code momentarily

[MedNez]

Code is done (and checked by Peter and I've tested it again) and ready to upload as a community sample... now I just have to figure out how to use Github!