implement image metadata display using a table

img-ui/src/main/java/module-info.java

@@ -18,7 +18,7 @@ module dev.nuculabs.imagetagger.ui {
     requires org.apache.commons.lang3;
 
     opens dev.nuculabs.imagetagger.ui to javafx.fxml, javafx.graphics;
-    opens dev.nuculabs.imagetagger.ui.controls to javafx.fxml, javafx.graphics;
+    opens dev.nuculabs.imagetagger.ui.controls to javafx.fxml, javafx.graphics, javafx.base;
     opens dev.nuculabs.imagetagger.ui.pages to javafx.fxml, javafx.graphics;
     exports dev.nuculabs.imagetagger.ui;
 }

img-ui/src/main/kotlin/dev/nuculabs/imagetagger/ui/MainPage.kt

@@ -43,16 +43,13 @@ class MainPage : Application() {
         // Set up the stage.
         stage.title = "Image Tagger"
         stage.scene = scene
-        stage.minWidth = 640.0
+        stage.minWidth = 960.0
         stage.minHeight = 760.0
         // Whe the main window is hidden we exit the application.
         stage.setOnHidden {
             Platform.exit()
         }
 
-        // Add menu bar
-        // (scene.root as BorderPane).children.add(ApplicationMenuBar(mainPageController))
-
         stage.show()
     }
 

img-ui/src/main/kotlin/dev/nuculabs/imagetagger/ui/controls/ImageTagsEntryControl.kt

@@ -2,11 +2,13 @@ package dev.nuculabs.imagetagger.ui.controls
 
 import dev.nuculabs.imagetagger.core.AnalyzedImage
 import dev.nuculabs.imagetagger.ui.alerts.ErrorAlert
-import org.apache.commons.lang3.SystemUtils
+import javafx.collections.FXCollections
+import javafx.collections.ObservableList
 import javafx.fxml.FXML
 import javafx.fxml.FXMLLoader
 import javafx.scene.control.Button
 import javafx.scene.control.Label
+import javafx.scene.control.TableView
 import javafx.scene.control.TextArea
 import javafx.scene.image.Image
 import javafx.scene.image.ImageView
@@ -15,6 +17,7 @@ import javafx.scene.input.ClipboardContent
 import javafx.scene.input.MouseEvent
 import javafx.scene.layout.HBox
 import javafx.scene.layout.VBox
+import org.apache.commons.lang3.SystemUtils
 import java.awt.Desktop
 import java.io.File
 import java.io.IOException
@@ -43,7 +46,7 @@ class ImageTagsEntryControl(private val image: AnalyzedImage) : HBox() {
     /**
      * Holds the tags.
      */
-    private var tags: List<String> = ArrayList();
+    private var tags: List<String> = ArrayList()
 
     /**
      * Sets the default image tags display mode.
@@ -69,22 +72,7 @@ class ImageTagsEntryControl(private val image: AnalyzedImage) : HBox() {
     private lateinit var metadataVbox: VBox
 
     @FXML
-    private lateinit var metadataAuthor: Label
-
-    @FXML
-    private lateinit var metadataCamera: Label
-
-    @FXML
-    private lateinit var metadataLens: Label
-
-    @FXML
-    private lateinit var metadataISO: Label
-
-    @FXML
-    private lateinit var metadataAperture: Label
-
-    @FXML
-    private lateinit var metadataShutterSpeed: Label
+    private lateinit var metadataTableView: TableView<ImageTagsEntryModel>
 
     init {
         val resource = ImageTagsEntryControl::class.java.getResource("image-tags-entry.fxml")
@@ -171,12 +159,24 @@ class ImageTagsEntryControl(private val image: AnalyzedImage) : HBox() {
      */
     private fun setMetadata() {
         val imageMetadata = image.metadata()
-        metadataAuthor.text = "Author: ${imageMetadata.artist}"
-        metadataCamera.text = "Camera: ${imageMetadata.cameraBrand} ${imageMetadata.cameraModel}"
-        metadataLens.text = "Lens: ${imageMetadata.lensModel}"
-        metadataISO.text = "ISO: ${imageMetadata.iso}"
-        metadataAperture.text = "Aperture: ${imageMetadata.aperture}"
-        metadataShutterSpeed.text = "Shutter Speed: ${imageMetadata.shutterSpeed}"
+        val metadataValues = listOf(
+            ImageTagsEntryModel("Author", imageMetadata.artist),
+            ImageTagsEntryModel("Brand", imageMetadata.cameraBrand),
+            ImageTagsEntryModel("Model", imageMetadata.cameraModel),
+            ImageTagsEntryModel("Lens", imageMetadata.lensModel),
+            ImageTagsEntryModel("ISO", imageMetadata.iso),
+            ImageTagsEntryModel("Aperture", imageMetadata.aperture),
+            ImageTagsEntryModel("Shutter Speed", imageMetadata.shutterSpeed),
+        ).filterNot { it.getValue() == "Unknown" }
+        val data: ObservableList<ImageTagsEntryModel> = FXCollections.observableArrayList(
+            metadataValues
+        )
+        if (data.size == 0) {
+            metadataVbox.isVisible = false
+            return
+        }
+        metadataTableView.items = data
+
     }
 
 

img-ui/src/main/kotlin/dev/nuculabs/imagetagger/ui/controls/ImageTagsEntryModel.kt

@@ -0,0 +1,38 @@
+@file:Suppress("unused")
+
+package dev.nuculabs.imagetagger.ui.controls
+
+import javafx.beans.property.SimpleStringProperty
+import javafx.beans.property.StringProperty
+
+/**
+ * ImageTagsEntryModel represents a metadata and it's associated value.
+ */
+class ImageTagsEntryModel(metadata: String, value: String) {
+    private val metadata: StringProperty = SimpleStringProperty(metadata)
+    private val value: StringProperty = SimpleStringProperty(value)
+
+    fun getMetadata(): String {
+        return metadata.get()
+    }
+
+    fun setMetadata(metadata: String) {
+        this.metadata.set(metadata)
+    }
+
+    fun metadataProperty(): StringProperty {
+        return metadata
+    }
+
+    fun getValue(): String {
+        return value.get()
+    }
+
+    fun setValue(value: String) {
+        this.value.set(value)
+    }
+
+    fun valueProperty(): StringProperty {
+        return value
+    }
+}

img-ui/src/main/resources/dev/nuculabs/imagetagger/ui/controls/image-tags-entry.fxml

@@ -6,11 +6,13 @@
 
 <?import javafx.scene.image.ImageView?>
 <?import org.kordamp.ikonli.javafx.FontIcon?>
-<fx:root type="javafx.scene.layout.HBox" xmlns:fx="http://javafx.com/fxml" stylesheets="@image-tags-entry.css">
-    <StackPane prefWidth="244" prefHeight="244">
+<?import javafx.scene.control.cell.PropertyValueFactory?>
+<fx:root type="javafx.scene.layout.HBox" xmlns:fx="http://javafx.com/fxml" stylesheets="@image-tags-entry.css"
+         minHeight="250">
+    <StackPane minWidth="244" prefWidth="244" prefHeight="244">
         <ImageView fx:id="imageView"/>
     </StackPane>
-    <VBox>
+    <VBox minWidth="300" >
         <padding>
             <Insets bottom="5.0" left="5.0" right="5.0" top="5.0"/>
         </padding>
@@ -20,17 +22,6 @@
                 <Label text="Tags:"/>
                 <TextArea fx:id="predictedImageTags" editable="false" wrapText="true" prefColumnCount="20"/>
             </VBox>
-            <VBox fx:id="metadataVbox">
-                <padding>
-                    <Insets left="10.0" top="35.0"/>
-                </padding>
-                <Label fx:id="metadataAuthor" text="Author: " />
-                <Label fx:id="metadataCamera" text="Camera:" />
-                <Label fx:id="metadataLens" text="Lens:" />
-                <Label fx:id="metadataISO" text="ISO:" />
-                <Label fx:id="metadataAperture" text="Aperture" />
-                <Label fx:id="metadataShutterSpeed" text="Shutter Speed" />
-            </VBox>
         </HBox>
         <HBox>
             <padding>
@@ -43,5 +34,20 @@
             </Button>
         </HBox>
     </VBox>
-
+    <VBox fx:id="metadataVbox" VBox.vgrow="ALWAYS">
+        <TableView fx:id="metadataTableView" minWidth="400" maxWidth="Infinity" VBox.vgrow="ALWAYS">
+            <columns>
+                <TableColumn text="Metadata">
+                    <cellValueFactory>
+                        <PropertyValueFactory property="metadata"/>
+                    </cellValueFactory>
+                </TableColumn>
+                <TableColumn text="Value">
+                    <cellValueFactory>
+                        <PropertyValueFactory property="value"/>
+                    </cellValueFactory>
+                </TableColumn>
+            </columns>
+        </TableView>
+    </VBox>
 </fx:root>