diff --git a/CHANGELOG.md b/CHANGELOG.md index f8596ce2..b631ea87 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ # M2 (TBD) * Swing interoperability support (Compose in Swing frame) * Implemented desktop "ActualDialog" and "ActualPopup" (GH-19, GH-81) + * Support of [XML vector images](https://developer.android.com/guide/topics/graphics/vector-drawable-resources) * Support for Gradle 6.6 and 6.7 (GH-66) * Support macOS 10.13 and 10.14 (GH-76) * Support letter spacing in text (GH-82) diff --git a/tutorials/Image_And_Icons_Manipulations/README.md b/tutorials/Image_And_Icons_Manipulations/README.md index 8662b0d7..67169512 100755 --- a/tutorials/Image_And_Icons_Manipulations/README.md +++ b/tutorials/Image_And_Icons_Manipulations/README.md @@ -337,3 +337,34 @@ fun asImageAsset(image: BufferedImage): ImageAsset { ``` ![Tray icon](tray_icon.png) + +## Loading XML vector images +Compose for Desktop supports XML vector images. +XML vector images are came from [Android world](https://developer.android.com/guide/topics/graphics/vector-drawable-resources). +We implented it on desktop so we can use common resources in a crossplatform application. + +SVG files can be converted to XML with [Android Studio](https://developer.android.com/studio/write/vector-asset-studio#svg) or with [third-party tools](https://www.google.com/search?q=svg+to+xml). +Suppose we have a XML image that is placed in the `resources/images` directory in our project. + +SVG example: ![SVG](compose.svg) + +Converted XML: [compose.xml](compose.xml) + +```kotlin +import androidx.compose.desktop.Window +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.vectorXmlResource + +fun main() { + Window { + Image( + vectorXmlResource("images/compose.xml"), + modifier = Modifier.fillMaxSize() + ) + } +} +``` + +![Loading XML vector images](loading_xml_vector_images.png) \ No newline at end of file diff --git a/tutorials/Image_And_Icons_Manipulations/compose.svg b/tutorials/Image_And_Icons_Manipulations/compose.svg new file mode 100644 index 00000000..c0247db6 --- /dev/null +++ b/tutorials/Image_And_Icons_Manipulations/compose.svg @@ -0,0 +1,169 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/tutorials/Image_And_Icons_Manipulations/compose.xml b/tutorials/Image_And_Icons_Manipulations/compose.xml new file mode 100644 index 00000000..c9799927 --- /dev/null +++ b/tutorials/Image_And_Icons_Manipulations/compose.xml @@ -0,0 +1,41 @@ + + + + + + + + + + + + diff --git a/tutorials/Image_And_Icons_Manipulations/loading_xml_vector_images.png b/tutorials/Image_And_Icons_Manipulations/loading_xml_vector_images.png new file mode 100644 index 00000000..4a7e4122 Binary files /dev/null and b/tutorials/Image_And_Icons_Manipulations/loading_xml_vector_images.png differ