如何在Ubuntu手机中使用前置照相机

我们可以在Ubuntu QML的API文档中看到Camera的用法，但是里面没有写到任何的前置Camera的调用方法。对于一些应用来说，前置Camera的使用是重要的。我们必须使用Qt C++代码来实现这个功能。在这篇文章中，我们来介绍如何使用Ubuntu手机中的前置照相机。

１）创建一个最基本的QML应用

   

   

这样我们就生成了一个含有plugin的项目。

２）在项目中加入CameraSelector来选择照相机

为了能够调用Camera的一些API，我们在plugin中加入如下的CameraSelector类：

#ifndef CAMERA_SELECTOR_H
#define CAMERA_SELECTOR_H

#include <QObject>
#include <QCamera>
#include <QVideoDeviceSelectorControl>

class CameraSelector : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QObject* cameraObject READ cameraObject WRITE setCameraObject)
    Q_PROPERTY(int selectedCameraDevice READ selectedCameraDevice WRITE setSelectedCameraDevice)

public:
    QObject* cameraObject() const;
    void setCameraObject(QObject *cam);

    int selectedCameraDevice() const;
    void setSelectedCameraDevice(const int cameraId);

private:
    QCamera *m_camera;
    QVideoDeviceSelectorControl *m_deviceSelector;
};

#endif // CAMERA_SELECTOR_H

#include "cameraselector.h"

#include <QMediaService>

void CameraSelector::setCameraObject(QObject *cam)
{
    // get the QCamera from the declarative camera's mediaObject property.
    m_camera = qvariant_cast<QCamera*>(cam->property("mediaObject"));

    // get the video device selector control
    QMediaService *service = m_camera->service();
    m_deviceSelector = qobject_cast<QVideoDeviceSelectorControl*>(service->requestControl(QVideoDeviceSelectorControl_iid));
}


QObject *CameraSelector::cameraObject() const
{
    return m_camera;
}

int CameraSelector::selectedCameraDevice() const
{
     return 0;
}

void CameraSelector::setSelectedCameraDevice(const int cameraId)
{
    // A camera might already be started, make sure it's unloaded
    m_camera->unload();

    m_deviceSelector->setSelectedDevice(cameraId);
}

我们在“backend”中的CMakeLists.txt中加入“MultiMedia"库以调用QCamera。

include_directories(
    ${CMAKE_CURRENT_SOURCE_DIR}
)

set(
    FrontCamerabackend_SRCS
    modules/FrontCamera/backend.cpp
    modules/FrontCamera/mytype.cpp
    modules/FrontCamera/cameraselector.cpp
)

add_library(FrontCamerabackend MODULE
    ${FrontCamerabackend_SRCS}
)

set_target_properties(FrontCamerabackend PROPERTIES
         LIBRARY_OUTPUT_DIRECTORY FrontCamera)

qt5_use_modules(FrontCamerabackend Gui Qml Quick Multimedia)

# Copy qmldir file to build dir for running in QtCreator
add_custom_target(FrontCamerabackend-qmldir ALL
    COMMAND cp ${CMAKE_CURRENT_SOURCE_DIR}/modules/FrontCamera/qmldir ${CMAKE_CURRENT_BINARY_DIR}/FrontCamera
    DEPENDS ${QMLFILES}
)

# Install plugin file
install(TARGETS FrontCamerabackend DESTINATION ${QT_IMPORTS_DIR}/FrontCamera/)
install(FILES   modules/FrontCamera/qmldir DESTINATION ${QT_IMPORTS_DIR}/FrontCamera/)

同时在backend.cpp中加入如下的句子：

 qmlRegisterType<CameraSelector>(uri, 1, 0, "CameraSelector");

为了使用Camera，我们对我们的FrontCamera.qml做如下的修改：

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

/*!
    \brief MainView with Tabs element.
           First Tab has a single Label and
           second Tab has a single ToolbarAction.
*/

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

    // Note! applicationName needs to match the "name" field of the click manifest
    applicationName: "frontcamera.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(76)

    Page {
        title: i18n.tr("App with backend")

        Button {
            id: activateRearCamera
            text: "Rear Camera"

            onClicked: {
                selector. selectedCameraDevice = 0;
                camera.start();
            }
        }

        Button {
            id: activateFrontCamera
            text: "Front camera"
            anchors.left : activateRearCamera.right
            anchors.leftMargin: units.gu(2)
            onClicked: {
                selector. selectedCameraDevice = 1;
                camera.start();
            }
        }

        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
                }
            }
        }

        CameraSelector {
            id: selector
            cameraObject: camera
        }

        VideoOutput {
            source: camera
            anchors.fill: parent
            focus : visible // to receive focus and capture key events when visible
        }

        Image {
            id: photoPreview
        }
    }
}

运行我们的应用：

  

整个项目的源码在： https://github.com/liu-xiao-guo/frontcamera