Praca z obrazami

Środowisko AppStudio Framework zawiera tablicę funkcji służących do rozpakowywania informacji z obrazów i ich modyfikowania w aplikacji.

Obiekty obrazów

Obrazy można wyświetlać w aplikacji przy użyciu obiektu Image, który może następnie obsługiwać dalsze parametry pozwalające na zmianę sposobu wyświetlania obrazu. Właściwość source udostępnia lokalizację obrazu do wyświetlenia, podczas gdy inne właściwości opisują sposoby wyświetlania obrazu. Następujący przykładowy kod powoduje wyświetlenie konkretnego obrazu w sposób zachowujący jego proporcje i dopasowany do pionowego i poziomego środka elementu kompozycji, w którym się znajduje:

Ten przykładowy kod powoduje wyświetlenie konkretnego obrazu w sposób zachowujący jego proporcje i dopasowany do pionowego i poziomego środka elementu kompozycji, w którym się znajduje.

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

Na potrzeby wykonywania bardziej złożonych operacji na obrazach komponent ImageObject udostępnia pewną liczbę narzędzi służących do sprawdzania właściwości obrazu lub jego przekształcania. Komponent ImageObject domyślnie przechowuje własny obraz. Następujący przykładowy kod demonstruje połączenie komponentu ImageObject z wyświetlonym obrazem udostępnionym w innym miejscu:

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

Ten przykładowy kod używa funkcji rotate komponentu ImageObject w dwóch przyciskach do obracania obrazu o 90 stopni w dowolnym kierunku.

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

Komponent ImageObject zawiera pewną liczbę funkcji o podobnych nazwach, zwykle różniących się tylko czasem, na przykład mirror i mirrored. W tych przypadkach istnieje różnica w zachowaniu. Funkcje o nazwach w czasie teraźniejszym wprowadzają zmiany bezpośrednio w istniejącym obiekcie obrazu, podczas gdy funkcje o nazwach w czasie przeszłym wprowadzają zmiany w kopii obiektu obrazu.

Metadane Exif

Obrazy mogą również zawierać metadane Exif, czyli szereg znaczników zawierających informacje o samym obrazie. Wiele z tych metadanych jest dostarczanych automatycznie w zdjęciach wykonywanych przez nowoczesne aparaty. Mogą one zawierać informacje systemu GPS opisujące lokalizację, w której wykonano zdjęcie. Środowisko AppStudio Framework może odczytywać te znaczniki i w nich zapisywać za pomocą komponentu ExifInfo.

Środowisko AppStudio Framework może pracować z następującymi trzema typami znacznika Exif:

• Znaczniki obrazów, takie jak rozdzielczość, data i czas utworzenia oraz opis
• Znaczniki rozszerzone, takie jak źródło światła, czas naświetlania i tryb ekspozycji
• Znaczniki systemu GPS, takie jak szerokość geograficzna, prędkość i układ odniesienia mapy

W następującym przykładowym kodzie przedstawiono sposób wyświetlania znaczników Exif pobranych z obrazu wybranego w oknie dialogowym pliku, który można następnie ponownie zapisać. W tym przykładzie używana jest szerokość geograficzna, długość geograficzna i wysokość, ale można go zmodyfikować pod kątem innych metadanych.

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