Arbeiten mit Bildern

AppStudio Framework enthält zahlreiche Funktionen zum Extrahieren von Informationen aus Bildern und Ändern der Informationen in der App.

Bildobjekte

Bilder können in einer App unter Verwendung eines Bildobjekts angezeigt werden, das dann weitere Parameter zur Änderung der Bilddarstellung unterstützen kann. In der Eigenschaft source wird der Speicherort des anzuzeigenden Bildes bereitgestellt, während in anderen Eigenschaften die Art der Bilddarstellung angegeben wird. Mit dem folgenden Codebeispiel wird ein bestimmtes Bild so angezeigt, dass das Seitenverhältnis beibehalten wird und die Ausrichtung am horizontalen und vertikalen Mittelpunkt des Layoutelements erfolgt, in dem es sich befindet:

Mit diesem Codebeispiel wird ein bestimmtes Bild so angezeigt, dass das Seitenverhältnis beibehalten wird und die Ausrichtung am horizontalen und vertikalen Mittelpunkt des Layoutelements erfolgt, in dem es sich befindet.

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

Für komplexere Arbeiten mit Bildern stellt die ImageObject-Komponente eine Reihe von Werkzeugen zur Überprüfung der Eigenschaften eines Bildes oder zur Transformation eines Bildes bereit. ImageObject speichert standardmäßig ein eigenes Bild. Das folgende Codebeispiel zeigt, wie ImageObject mit einem angezeigten Bild verbunden wird, das an anderer Stelle bereitgestellt wird:

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

In diesem Codebeispiel wird die ImageObject-Funktion rotate in zwei Schaltflächen verwendet, um das Bild in beide Richtungen um neunzig Grad zu drehen.

    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 enthält mehrere Funktionen mit ähnlichen Namen, die sich in der Regel nur durch die Zeitform unterscheiden, z. B. mirror und mirrored. Diese wirkt sich unterschiedlich auf das Verhalten aus. Funktionen, deren Namen in der Gegenwartsform stehen, nehmen die Änderungen direkt am vorhandenen Bildobjekt vor, während die Funktionen mit Namen in der Vergangenheitsform die Änderungen an einer Kopie des Bildobjekts durchführen.

Exif-Metadaten

Bilder können auch Exif-Metadaten enthalten, eine Reihe von Tags mit Informationen über das Bild selbst. Ein Großteil dieser Metadaten wird in Fotos, die mit modernen Kameras aufgenommen werden, automatisch bereitgestellt. Sie können GPS-Informationen zu der Position enthalten, an der das Bild aufgenommen wurde. Das AppStudio-Framework kann diese Tags mithilfe der ExifInfo-Komponente lesen und in die Tags schreiben.

Es kann mit den folgenden Exif-Tag-Typen arbeiten:

  • Bild-Tags wie Auflösung, Erstellungsdatum und -zeit sowie Beschreibung
  • Erweiterte Tags wie Lichtquelle, Belichtungszeit und -modus
  • GPS-Tags wie Breitengrad, Geschwindigkeit und Kartendatum

Im folgenden Codebeispiel wird veranschaulicht, wie Exif-Tags angezeigt werden, die aus einem über das Dialogfeld "Datei" ausgewählten Bild stammen und anschließend umgeschrieben werden können. In dem Beispiel werden der Breitengrad, der Längengrad und die Höhe verwendet. Es kann jedoch geändert werden, um andere Metadaten zu berücksichtigen.

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