如何使用Ubuntu手机平台中的照相机API来存储照片

在前面的一篇文章中“如何在Ubuntu手机中使用前置照相机”，我们可以使用相应的C++代码来控制前后位置的照相机来拍照，但是我们又如何能够把所拍到的照片存储到相应的文件中呢？我们可以使用Qt 5.4版本中的Item所提供的一个新的功能“grabToImage”。这样我们可以很方便地把我们得到的照片存到我们相应的目录中。

在Ubuntu手机平台中，由于安全的原因，我们的应用只可以访问自己所在的可以访问的目录。在这个例程中，我们使用了一些环境的变量来得到我们所需要的存储的目录的位置：

我们整个的代码如下：

import QtQuick 2.0
import Ubuntu.Components 1.1
import QtMultimedia 5.0
import readenv 1.0

/*!
    \brief MainView with a Label and Button elements.
*/

MainView {
    id: root
    // objectName for functional testing purposes (autopilot-qt5)
    objectName: "mainView"

    // Note! applicationName needs to match the "name" field of the click manifest
    applicationName: "camerashot.liu-xiao-guo"

    /*
     This property enables the application to change orientation
     when the device is rotated. The default is false.
    */
    //automaticOrientation: true

    // Removes the old toolbar and enables new features of the new header.
    useDeprecatedToolbar: false

    width: units.gu(100)
    height: units.gu(75)

    Page {
        id: mainPage
        title: i18n.tr("camerashot")

        property string path: ""

        ReadEnv {
            id: env
        }

        Item {
            id: page1
            anchors.fill: parent

            Camera {
                id: camera

                imageProcessing.whiteBalanceMode: CameraImageProcessing.WhiteBalanceFlash

                exposure {
                    exposureCompensation: -1.0
                    exposureMode: Camera.ExposurePortrait
                }

                flash.mode: Camera.FlashRedEyeReduction

                imageCapture {
                    onImageCaptured: {
                        photoPreview.source = preview  // Show the preview in an Image
                    }
                }
            }

            VideoOutput {
                id: video
                source: camera
                anchors.fill: parent
                focus : visible // to receive focus and capture key events when visible
                orientation: -90

                MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        var APP_ID = env.getenv("APP_ID");
                        var app_pkgname = APP_ID.split('_')[0]
                        mainPage.path = env.getenv("XDG_DATA_HOME") +
                                "/" + app_pkgname + "/pic.png";
                        console.log("share path: " + mainPage.path);

                        var a = video.grabToImage(function(result) {
                            result.saveToFile(mainPage.path);
                        }, Qt.size(photoPreview.width, photoPreview.height) );

                        console.log("return result: " + a);

                    }
                }

                Image {
                    id: photoPreview
                }
            }

            Button {
                id: button
                anchors.bottom: parent.bottom
                anchors.right: parent.right

                text: "Show the taken picture"

                onClicked: {
                    pic.visible = true;
                    page1.visible = false;
                    console.log("image path: " + mainPage.path);
                    image.source = "";
                    image.source = "file:///" + mainPage.path;
                }
            }
        }

        Item {
            id: pic

            anchors.fill: parent
            visible: false

            Image {
                id: image
                cache: false
                anchors.fill: parent
            }

            Label {
                text: mainPage.path
            }

            Image {
                anchors.bottom: parent.bottom
                anchors.left: parent.left
                anchors.leftMargin: units.gu(1)
                anchors.bottomMargin: units.gu(1)
                width: units.gu(3)
                height: units.gu(3)

                source: "images/icon-left-arrow.png"
                MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        pic.visible = false
                        page1.visible = true;
                    }
                }
            }
        }

    }
}

整个的设计非常简单。在主界面中我们可以在相机的影像的任何地方进行触屏来拍下我们的照片。我们可以使用“Show the taken picture”按钮来进入下一个页面来显示存储的图片。为了方便设计，我们选择了一个固定的文件名。当然，开发者们可以自己来选择自己的所需要的文件名。

整个项目的源码在: git clone https://gitcafe.com/ubuntu/camerashot.git