Multiple Photos in Quick Report

5359
15
05-02-2016 07:04 PM
DustinBaumbach
New Contributor II


Hi Esri Team!

I'm trying to customize a quick report application to have users be able to pick or take multiple photos inside of the quick report. I am trying to do this inside of AppStudio for Desktop in QML through Qt Creator. Is there any sample QML code that I may be able to look at to design this functionality into my quick report? Please let me know by contacting me back at dbaumbach@llu.edu or by responding here. It would benefit me tremendously! Sathya Prasad​ or if you know of anyone else that would be more qualified to help.

15 Replies
SathyaPrasad
Esri Contributor

I am currently re-writing quick report app w.r.t UI/UX and feature functionality. One of the new functionality is support for multiple photos. Timeline would be mid June, if you can wait I would recommend. If you cannot wait, then you will have to look at two places in code:

1. Add UI and functionality to select more than one photo in AddPhotoPage.qml.

2. IN QuickReportApp.qml inside of the "addAttachments" function currently it only looks for one file. After the changes for Step 1. you will have an array of file urls, so in this function loop though and add attachment for each photo.

DustinBaumbach
New Contributor II

Hi Sathya Prasad​,

Thank you very much for your response. This is not of urgent need currently and will be able to wait until mid-June for the release. After it is released will I have to go back and recreate my quick report? or is it just a process of updating my app in the AppStudio website? Please let me know.

Thank you,

Dustin

0 Kudos
DustinBaumbach
New Contributor II

Hi Sathya Prasad​. I am checking back in to see what the status was on the multiple photos functionality of quick report? Please let me know if it has been released and how I can go about implementing it into my current quick report application. I would like to do that as soon as possible as we expect a high volume of users for this app during the next 3-4 months. I look forward to hearing from you.

DustinBaumbach
New Contributor II

Hi Sathya Prasad​,

I was just wondering if there was an update to implementing the multiple photos option in quick report apps? Above you mentioned mid June but I noticed that it was not implemented in the AppStudio update. Please let me know how this is going and if there is a place I can follow updates on the status of this implementation. Thank you.

Dustin

0 Kudos
DustinBaumbach
New Contributor II

Hi Sathya Prasad​ Please see previous message above. I'm also wondering if you know anything about a fix to bug ENH-000096769. Please let me know. You may contact me back at dbaumbach@llu.edu if you would like to reply to me personally.

0 Kudos
GarethWalters1
New Contributor II

Dustin Baumbach, here is some code that I have used to implement multiple photo capture.

import QtQuick 2.0

import QtQuick.Layouts 1.1
import QtMultimedia 5.5
import ArcGIS.AppFramework 1.0
import ArcGIS.AppFramework.Controls 1.0
Rectangle {
    color: app.info.propertyValue("accent-color")
    property var filesArray: fileFolder.fileNames()
    Photos_FileFolder {
        id: fileFolder
    }
    ColumnLayout {
        anchors.fill: parent
        spacing:2
        Rectangle {
            id: cameraRect
            color: app.info.propertyValue("accent-color")
            Layout.fillWidth: true
            Layout.fillHeight: true
            Camera {
                id: camera
                captureMode: Camera.CaptureStillImage
                imageProcessing.whiteBalanceMode: CameraImageProcessing.WhiteBalanceFlash
                exposure {
                    exposureCompensation: -1.0
                    exposureMode: Camera.ExposurePortrait
                }
                flash.mode: Camera.FlashRedEyeReduction
                imageCapture.onImageSaved: {
                    filesArray = fileFolder.fileNames();
                    console.log(filesArray[filesArray.length-1])
                    var d = new Date();
                    var formattedPhotoName = app.photoPrefix + "_" + d.getHours() + d.getMinutes() + d.getSeconds() + ".jpg"
                    fileFolder.renameFile(filesArray[filesArray.length-1], formattedPhotoName)
                }
            }
            VideoOutput {
                source: camera
                anchors.fill: parent
                focus : visible // to receive focus and capture key events when visible
            }
            Rectangle {
                anchors{
                    verticalCenter: parent.verticalCenter
                    right: parent.right
                    rightMargin: 5
                }
                color: app.info.propertyValue("secondary-text-color")
                opacity: 0.2
                width: app.info.propertyValue("primary-button-size")
                height: width
                radius: width * 0.5
                Image {
                    source: "../icons/ic_photo_camera_Orange_36pt_2x.png"
                    anchors.centerIn: parent
                    width: parent.width * 0.75
                    height: width
                    opacity: 1
                }
                visible: camera.imageCapture.ready
                MouseArea {
                    anchors.fill: parent
                    onClicked:{
                        camera.imageCapture.captureToLocation( fileFolder.path )
                    }
                }
            }
        }
        Rectangle{
            Layout.preferredHeight: 230
            Layout.maximumHeight: 230
            Layout.fillWidth: true
            color: app.info.propertyValue("divider-color")
            RowLayout {
                anchors.fill: parent
                spacing: 5
                Repeater{
                    id: repeater
                    anchors.fill: parent
                    anchors.margins: 5
                    model: filesArray.reverse()
                    Rectangle {
                        width: 300
                        height: 169
                        color: app.info.propertyValue("default-primary-color")
                        Image {
                            anchors.fill: parent
                            fillMode: Image.PreserveAspectFit
                            source: AppFramework.resolvedPathUrl(fileFolder.file(modelData).path)
                        }
                    }
                }
            }
            Text {
                id: txtCount
                text: fileFolder.fileNames().length == 0 ? "no images yet" : filesArray.length
                font{
                    pointSize: 18
                }
                color: app.info.propertyValue("dark-primary-color")
            }
        }
    }
}

Let me know how yo go.

Cheers,

Gareth

DustinBaumbach
New Contributor II

Hi Gareth Walters​,

Thank you very much for sending this bit of code to me. I appreciate it! This will modify the AddPhotoPage in Qt Creator, correct? Please let me know.

Thank you,

Dustin

0 Kudos
nakulmanocha
Esri Regular Contributor

Hi Dustin,

I put together some code to get the add multiple images or files as attachments to work with the quick report template. I am in a process of doing some final testing. I'll upload it here sometime early next week.

-Nakul

0 Kudos
DustinBaumbach
New Contributor II

Hi Nakul Manocha​,

Thank you very much! I look forward to seeing the code to implement the multiple photos.

Dustin

0 Kudos