How to use the front camera and Ubuntu camera in ubuntu mobile phones

How to use the front camera and Ubuntu camera in ubuntu mobile phones

We can see the usage of Camera in the Ubuntu qml api documentation, but it does not write any method for calling the front-end Camera. For some applications, the use of front-end Camera is important. We must use Qt C ++ code to implement this function. In this article, we will introduce how to use the front camera in the Ubuntu mobile phone.

1) create a basic QML Application




In this way, a project containing plugin is generated.
2) Add CameraSelector to the project to select a camera.
To be able to call some APIs of Camera, we add the following CameraSelector class to plugin:

#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);}

We add the "MultiMedia" Library to the cmakelists.txt in your backendpoint to call 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 QtCreatoradd_custom_target(FrontCamerabackend-qmldir ALL    COMMAND cp ${CMAKE_CURRENT_SOURCE_DIR}/modules/FrontCamera/qmldir ${CMAKE_CURRENT_BINARY_DIR}/FrontCamera    DEPENDS ${QMLFILES})# Install plugin fileinstall(TARGETS FrontCamerabackend DESTINATION ${QT_IMPORTS_DIR}/FrontCamera/)install(FILES   modules/FrontCamera/qmldir DESTINATION ${QT_IMPORTS_DIR}/FrontCamera/)

Add the following sentence to backend. cpp:

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

To use Camera, we make the following changes to our FrontCamera. qml:

import QtQuick 2.0import Ubuntu.Components 1.1import FrontCamera 1.0import 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        }    }}

Run our application:



Source code for the entire project in: git clone https://gitcafe.com/ubuntu/frontcamera.git