Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Developer
Bluenoser
Posts: 259
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Camera QML

I am trying to adapt the code from one of the cascade samples. barcodereader. When I compile my app, all I get is a black screen. This tells me it is failing on the QML code. I have compared the code for what I used and I don't see any QML errors. Can someone take a look?

 

I have added LIBS += -lbbcascadesmultimedia to the project file as that was the only thing that the barcodereader added and it works fine.

 

import bb.cascades 1.0
import bb.cascades.multimedia 1.0
import bb.multimedia 1.0

Page {
    Container {
        
        Camera {
            id: qrcodeCamera
            
            onCameraOpened: {
                getSettings(qrcodeCameraSettings)
                qrcodeCameraSettings.focusMode = CameraFocusMode.ContinuousAuto
                qrcodeCameraSettings.shootingMode = CameraShootingMode.Stabilization
                applySettings(qrcodeCameraSettings)
                
                qrcodeCamera.startViewfinder()
            }
            
            onViewFinderStarted: {
                qrcodeDetector.camera = qrcodeCamera
            }
            
            attachedObjects: [
                CameraSettings {
                    id: qrcodeCameraSettings
                }
            ]
        }
        Label {
            id: resultLabel
        }
    }
    attachedObjects: [
        BarcodeDetector {
            id: qrcodeDetector
                
            formats: BarcodeFormat.QrCode
            onBarcodeDetected: {
                if(resultLabel.text != data) {
                    resultLabel = data;
                }
           }
        }
    ]
}

 

Please use plain text.
Developer
javayoung
Posts: 313
Registered: ‎05-31-2010
My Device: Alpha 10, Bold 9900, Storm 9530, Tour 9630, Curve 9320, Curve 8900
My Carrier: All

Re: Camera QML

Yes, this situation is sometimes happened. You can close the black screen then build and run it on device again. The application will be running properly. I can see the barcode reader line in the middle of screen after run it again.




p(^_^)q
Good good study, day day up
Please use plain text.
Developer
Bluenoser
Posts: 259
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Re: Camera QML

I have gotten the sample that I took the code from to work, but the code I posted does not work and I don't know why so I asking for help.

 

Thanks

Please use plain text.
Retired
PBernhardt
Posts: 749
Registered: ‎12-16-2008
My Device: BlackBerry Z30
My Carrier: Bell

Re: Camera QML

You need to call camera.open() at some point. For example:

 

    Page {
        onCreationCompleted: {
            if (camera.allCamerasAccessible) {
                camera.open(CameraUnit.Rear);
            }
        }

 

Paul Bernhardt
Application Development Consultant
BlackBerry
@PBernhardt

Did this answer your question? Please accept this post as the solution.
Found a bug? Report it to the Developer Issue Tracker
Please use plain text.
Developer
oniongarlic
Posts: 72
Registered: ‎10-19-2012
My Device: Playbook, BB10DevAlphaB
My Carrier: Sonera, Saunalahti

Re: Camera QML

Have you checked that you request the required permissions in your bar file ?
Please use plain text.
Developer
Bluenoser
Posts: 259
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Re: Camera QML

Making Progress

 

Camera works, but it never detects the QRCode.

 

import bb.cascades 1.0
import bb.cascades.multimedia 1.0
import bb.multimedia 1.0

Page {

    Container {
        
        Camera {
            id: qrcodeCamera
//            objectName: "qrcodeCamera"
            preferredWidth: 768.0
            preferredHeight: 768.0

            onCameraOpened: {
                getSettings(qrcodeCameraSettings)
                qrcodeCameraSettings.focusMode = CameraFocusMode.ContinuousAuto
                qrcodeCameraSettings.shootingMode = CameraShootingMode.Stabilization
                applySettings(qrcodeCameraSettings)
                
                qrcodeCamera.startViewfinder()
            }
            
            onViewfinderStarted: {
                qrcodeDetector.camera = qrcodeCamera
            }
            
            attachedObjects: [
                CameraSettings {
                    id: qrcodeCameraSettings
                }
            ]
        }
        Label {
            text: "QRCode Results"
        }
        Label {
            id: resultData
            multiline: true
         }
        
    }
    onCreationCompleted: {
        // Check to see if any cameras are currently accessible.
        if (qrcodeCamera.allCamerasAccessible) {
            // Open the rear camera.
            qrcodeCamera.open(CameraUnit.Rear);
        }
    }
    attachedObjects: [
        BarcodeDetector {
            id: qrcodeDetector
            formats: BarcodeFormat.Any
            onBarcodeDetected: {
                if (resultData.text != data) {
                    resultData.text = data;
                    scannedSound.play()
                }
           }
        },
        SystemSound {
            id: scannedSound
            sound: SystemSound.GeneralNotification
        }
    ]
}

 

Please use plain text.
Developer
Bluenoser
Posts: 259
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Re: Camera QML

[ Edited ]

I cannot figure out the problem. The camera works, but it never detects the bar code. I even just copied to code as much as possible from the app that does work. I used the cascades sample barcodereader. I even copied the all the make files and the permissions are identical.

 

Here is the code that works.

 

/* Copyright (c) 2012 Research In Motion Limited.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

import bb.cascades 1.0
import bb.cascades.multimedia 1.0
import bb.multimedia 1.0

Page {
    id: page

    Container {
        background: Color.Black

        layout: DockLayout {}

        //! [0]
        // The camera preview control
        Camera {
            id: camera
            preferredWidth: 768.0
            preferredHeight: 768.0


//            horizontalAlignment: HorizontalAlignment.Fill
//            verticalAlignment: VerticalAlignment.Fill

            onCameraOpened: {
                // Apply some settings after the camera was opened successfully
                getSettings(cameraSettings)
                cameraSettings.focusMode = CameraFocusMode.ContinuousAuto
                cameraSettings.shootingMode = CameraShootingMode.Stabilization
                applySettings(cameraSettings)

                // Start the view finder as it is needed by the barcode detector
                camera.startViewfinder()
            }

            onViewfinderStarted: {
                // Setup the barcode detector with the camera object now
                barcodeDetector.camera = camera
            }

            attachedObjects: [
                CameraSettings {
                    id: cameraSettings
                }
            ]
        }
        //! [0]

        // The overlay image
        ImageView {
            horizontalAlignment: HorizontalAlignment.Fill
            verticalAlignment: VerticalAlignment.Fill

            imageSource: "asset:///images/overlay.png"
        }

        // The area at the top that shows the results
        Container {
            id: resultArea

            horizontalAlignment: HorizontalAlignment.Fill
            verticalAlignment: VerticalAlignment.Top

            layout: DockLayout {}

            visible: false

            ImageView {
                horizontalAlignment: HorizontalAlignment.Fill
                verticalAlignment: VerticalAlignment.Fill

                imageSource: "asset:///images/result_background.png"
            }

            Label {
                id: resultLabel

                horizontalAlignment: HorizontalAlignment.Center
                verticalAlignment: VerticalAlignment.Center

                textStyle {
                    base: SystemDefaults.TextStyles.TitleText
                    color: Color.White
                    textAlign: TextAlign.Center
                }

                multiline: true
            }
        }

        // The upper cover image
        ImageView {
            id: topCover

            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Top

            imageSource: "asset:///images/top_cover.png"

            onTouch: {
                if (event.isDown())
                    startupAnimation.play()
            }
        }

        // The lower cover image
        ImageView {
            id: bottomCover

            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Bottom

            imageSource: "asset:///images/bottom_cover.png"

            onTouch: {
                if (event.isDown())
                    startupAnimation.play()
            }
        }

        // The startup animation that slides out the cover images
        animations: ParallelAnimation {
            id: startupAnimation

            SequentialAnimation {
                target: topCover
                TranslateTransition {
                    fromY: 0
                    toY: -640
                    duration: 1250
                    easingCurve: StockCurve.QuarticInOut
                }
            }
            SequentialAnimation {
                target: bottomCover
                TranslateTransition {
                    fromY: 0
                    toY: 680
                    duration: 1250
                    easingCurve: StockCurve.QuarticInOut
                }
            }

            //! [1]
            onStarted: {
                camera.open()
            }
            //! [1]

            onEnded: {
                // Work around a bug temporarily
                camera.open()
            }
        }
    }

    //! [2]
    attachedObjects: [
        BarcodeDetector {
            id: barcodeDetector
            
            formats: BarcodeFormat.Any
            onBarcodeDetected: {
                if (resultLabel.text != data) {
                    resultLabel.text = data;
                    resultArea.visible = true;
                    scannedSound.play()
                }
            }
        },
        SystemSound {
            id: scannedSound

            sound: SystemSound.GeneralNotification
        }
    ]
    //! [2]
}

 Here is my code which doesn't work. I copied the code directly from the working example.

 

import bb.cascades 1.0
import bb.cascades.multimedia 1.0
import bb.multimedia 1.0

Page {

    Container {
        
        Camera {
            id: camera
            preferredWidth: 768.0
            preferredHeight: 768.0


//            horizontalAlignment: HorizontalAlignment.Fill
//            verticalAlignment: VerticalAlignment.Fill

            onCameraOpened: {
                // Apply some settings after the camera was opened successfully
                getSettings(cameraSettings)
                cameraSettings.focusMode = CameraFocusMode.ContinuousAuto
                cameraSettings.shootingMode = CameraShootingMode.Stabilization
                applySettings(cameraSettings)

                // Start the view finder as it is needed by the barcode detector
                camera.startViewfinder()
            }

            onViewfinderStarted: {
                // Setup the barcode detector with the camera object now
                barcodeDetector.camera = camera
            }

            attachedObjects: [
                CameraSettings {
                    id: cameraSettings
                }
            ]
        }
        Container {
            id: resultArea
            visible: false
            horizontalAlignment: HorizontalAlignment.Fill
            Label {
                    text: "QRCode Results"
            }
            Label {
                id: resultLabel
                multiline: true
            }
        }
        
    }
    onCreationCompleted: {
        // Check to see if any cameras are currently accessible.
        if (camera.allCamerasAccessible) {
            // Open the rear camera.
            camera.open();
        }
    }
    attachedObjects: [
        BarcodeDetector {
            id: barcodeDetector
            
            formats: BarcodeFormat.Any
            onBarcodeDetected: {
                if (resultLabel.text != data) {
                    resultLabel.text = data;
                    resultArea.visible = true;
                    scannedSound.play()
                }
            }
        },
        SystemSound {
            id: scannedSound

            sound: SystemSound.GeneralNotification
        }
    ]
}

 I just don't get it..

Please use plain text.
Developer
Bluenoser
Posts: 259
Registered: ‎04-04-2012
My Device: BlackBerry Z30/Z10/Z10LE/Q10/PlayBook

Re: Camera QML

[ Edited ]

OK. I was able to get it working.. sort of.. You have to open the camera twice to get it to scan a qrcode. And the second camera open cannot be with the onCreationCompleted. I had to do a camera.open() on the onCreationCompleted and another camera.open() in a button. This has to be a bug.

 

Please use plain text.