Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Weird behavior when switching the view between Image and Camera



  • Trying to switch the view between camera and image, but the results are pretty weird

    ToolBarTest.qml
    @
    import QtQuick 2.0

    Item{
    id:root
    height: 800; width: 144

    signal fullScreen()
    signal camera()
    signal photo()
    
    Column{
        id: toolBarColumn
    
        anchors.fill: root
        spacing: 10
        
        Rectangle{
    
            width: 144
            height: 70
            color: "blue"
    
            Text{
                text: "fullScreen"
            }
    
            MouseArea{
                anchors.fill: parent
    
                onClicked: {
                    fullScreen()
                }
            }
        }
    
        Rectangle{
    
            width: 144
            height: 70
            color: "blue"
    
            Text{
                text: "camera"
            }
    
            MouseArea{
                anchors.fill: parent
    
                onClicked: {
                    camera()
                }
            }
        }
    
        Rectangle{
    
            width: 144
            height: 70
            color: "blue"
    
            Text{
                text: "photo"
            }
    
            MouseArea{
                anchors.fill: parent
    
                onClicked: {
                    photo()
                }
            }
        }
    }
    

    }

    @

    PhotoTest.qml
    @
    import QtQuick 2.0
    import QtMultimedia 5.0

    Rectangle{
    id: root

    width: 480
    height: 320
    color: "black"
    state: "PHOTO"
    
    property alias source: largeImage.source
    
    property var theID: largeImage
    
    QtObject{
        id: param
    
        property var theID: largeImage
    }
    
    Image{
        id : largeImage
        anchors.fill: parent
        cache: false
        fillMode: Image.PreserveAspectFit
        smooth: true
    }
    
    Camera{
        id: camera
    }
    
    VideoOutput {
        id: videoOutput
    
        anchors.fill: parent
        source: camera
    }
    
    states:[
        State {
            name: "PHOTO"
            StateChangeScript{
                script:{
                    camera.stop()
                    param.theID = largeImage
                }
            }
    
            PropertyChanges { target: largeImage; opacity: 1}
            PropertyChanges { target: videoOutput; opacity: 0}
        },
        State {
            name: "CAMERA"
            StateChangeScript{
                script:{
                    camera.captureMode = Camera.CaptureStillImage
                    camera.start()
                    param.theID = videoOutput
                }
            }
    
            PropertyChanges {target: largeImage; opacity: 0}
            PropertyChanges { target: videoOutput; opacity: 1}
        }
    ]
    

    }

    @

    main.qml
    @
    import QtQuick 2.0

    Rectangle {
    id: root

    width: 800
    height: 480
    
    QtObject{
        id: param
    
        property string previousFullScreenState
    }
    
    ToolBarTest{
        id: toolBarTest
    
        onFullScreen: {
            param.previousFullScreenState = root.state
            root.state = "FULLSCREEN"
        }
    
        onPhoto: {
            root.state = "PHOTO"
        }
    
        onCamera: {
            root.state = "CAMERA"
        }
    }
    
    PhotoTest{
        id: photoTest
    
        anchors.left: toolBarTest.right
        width: parent.width - toolBarTest.width
    
        source: "/Users/yyyy/Downloads/1359170070532.jpg"
    
        MouseArea{
            anchors.fill: parent
    
            onClicked: {
                if(root.state == "FULLSCREEN"){
                    root.state = param.previousFullScreenState
                }
            }
        }
    }
    
    states: [
        State {
            name: "PHOTO"
    
            PropertyChanges { target: photoTest; state: "PHOTO"}
            PropertyChanges { target: toolBarTest; width: 144}
        },
        State {
            name: "CAMERA"
    
            PropertyChanges { target: photoTest; state: "CAMERA"}
            PropertyChanges { target: toolBarTest; width: 144}
        },
        State {
            name: "FULLSCREEN"
    
            PropertyChanges { target: toolBarTest; width: 0}
        }
    ]
    

    }
    @

    Once the state is "CAMERA" and I click on the "fullScreen" button
    The photoTest.qml do not show me the fullsize of the camera but
    the fullsize of the photo, what is happening?What kind of error do I make?

    Qt version : 5.1Beta
    os : mac osx 10.8.3
    compiler: clang 3.2



  • I explicit specified the state of "FULLSCREEN" in main.qml as

    @
    State {
    name: "FULLSCREEN"

            PropertyChanges { target: photoTest; state: param.fullScreenPreviousState == "PHOTO" ? "PHOTO" : "CAMERA"} //new conditon
            PropertyChanges { target: toolBarTest; width: 0}
        }
    

    @

    We have to explicit specify all of the conditions of different components when changing state?


Log in to reply