Lavorare con immagini

Il Framework di AppStudio contiene una serie di funzioni tanto per estrarre informazioni dalle immagini quanto per modificarle all'interno dell'app.

Oggetti Image

È possibile visualizzare le immagini in un'app attraverso l'uso di un oggetto Image, che può quindi supportare ulteriori parametri per alterare la visualizzazione dell'immagine. La proprietà source fornisce la destinazione dell'immagine da visualizzare, mentre le altre proprietà descrivono i modi in cui l'immagine sarà visualizzata. Il seguente esempio di codice visualizza un'immagine specifica preservando il suo rapporto di aspetto e la allinea con il centro orizzontale e verticale dell'elemento del layout nel quale risiede:

Questo esempio di codice visualizza un'immagine specifica preservando il suo rapporto di aspetto e la allinea con il centro orizzontale e verticale dell'elemento del layout nel quale risiede.

Image {
    fillMode: Image.PreserveAspectFit
    source: "Example.png"
    horizontalAlignment: Image.AlignHCenter
    verticalAlignment: Image.AlignVCenter
    cache: false
    }
}

Per lavori più complessi con immagini, il componente ImageObject fornisce una serie di strumenti per ispezionare le proprietà di un'immagine o trasformare un'immagine. ImageObject archivia la propria immagine per impostazione predefinita. Il seguente esempio di codice dimostra il collegamento di ImageObject ad un'immagine visualizzata fornita altrove:

    //Create ImageObject instance
    ImageObject {
        id: imageObject
    }
    Image {
	id: displayedImage
        fillMode: Image.PreserveAspectFit
        source: imageObject.url //Set source to URL housed by ImageObject
        horizontalAlignment: Image.AlignHCenter
        verticalAlignment: Image.AlignVCenter
        cache: false
    }
}

Questo esempio di codice usa la funzione rotate di ImageObject in due pulsanti, per ruotare l'immagine di novanta gradi in entrambe le direzioni.

    Button {
        text: "Rotate Left"
        onClicked: {
            imageObject.rotate(-90); //Rotates 90 degrees left
            displayedImage.refresh(); //Refreshes displayed image
        }
    }
    Button {
        text: "Rotate Right"
        onClicked: {
            imageObject.rotate(90); //Rotates 90 degrees right
            displayedImage.refresh(); //Refreshes displayed image
        }
    }

ImageObject contiene una serie di funzioni dai nomi simili, che differiscono normalmente solo nel tempo verbale; ad esempio, mirror e mirrored. In questi casi, vi è una differenza nel tipo di risposta. Le funzioni dal nome al presente modificano direttamente l'oggetto immagine esistente, mentre le funzioni con i nomi al passato effettuano modifiche su una copia dell'oggetto immagine.

Metadati Exif

Le immagini possono anche includere metadati Exif, una serie di tag che contengono informazioni sull'immagine stessa. Molti di questi metadati vengono forniti automaticamente nelle foto scattate da fotocamere moderne e possono includere informazioni del GPS per descrivere il luogo in cui si è scattata l'immagine. Il Framework di AppStudio può leggere e scrivere su questi tag usando il componente ExifInfo.

Il Framework di AppStudio funziona con i tre tipi di tag Exif seguenti:

• Tag immagine, come la risoluzione, la data e ora di creazione e la descrizione
• Tag estesi, come la fonte di illuminazione, la velocità dell'otturatore e il modo di esposizione
• Tag GPS, come la latitudine, la velocità e il dato mappa

Il seguente esempio di codice mostra come visualizzare i tag Exif di un'immagine selezionata attraverso una finestra di dialogo di un file, che può poi essere scritta nuovamente. Questo esempio usa la latitudine, la longitudine e l'altitudine ma è possibile modificarla per altri metadati.

    FileDialog { //Creates a platform-agnostic file choosing dialog
        id: loadDialog
        title: "Load Image"
        selectExisting: true
        selectMultiple: false
        nameFilters: [ "Image files (*.jpg *.png)", "All readable formats (All files (*)" ]
        folder: Qt.platform.os == "ios"
                ? "file:assets-library://"
                : AppFramework.standardPaths.standardLocations(StandardPaths.PicturesLocation)[0]
                    onAccepted: {
                        exifInfo.load(fileUrl);
                    }
    }
    ExifInfo { //Instantiates ExifInfo
    id: exifInfo
    }
    ColumnLayout {
        anchors {
            fill: parent
            margins: 10
        }
        TextField {
            text: exifInfo.gpsLatitude
            font.bold: true
        }
        TextField {
            text: exifInfo.gpsLongitude
            font.bold: true
        }
        TextField {
            text: exifInfo.gpsAltitude
            font.bold: true
        }
        Button {
        	text: "Load"
        	onClicked: {
        	    loadDialog.open();
        	}
	}
}