Show image format (resolution etc) of image blobs

crates/store/re_types/src/datatypes/image_format_ext.rs

@@ -130,3 +130,20 @@ impl ImageFormat {
         }
     }
 }
+
+impl std::fmt::Display for ImageFormat {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        if let Some(pixel_format) = self.pixel_format {
+            write!(f, "{} {}×{}", pixel_format, self.width, self.height)
+        } else {
+            write!(
+                f,
+                "{} {} {}×{}",
+                self.color_model(),
+                self.datatype(),
+                self.width,
+                self.height
+            )
+        }
+    }
+}

crates/viewer/re_component_ui/src/image_format.rs

@@ -1,23 +1,11 @@
-use re_types::components::ImageFormat;
-use re_viewer_context::{MaybeMutRef, UiLayout, ViewerContext};
+use re_ui::UiLayout;
+use re_viewer_context::{MaybeMutRef, ViewerContext};
 
 pub fn edit_or_view_image_format(
     _ctx: &ViewerContext<'_>,
     ui: &mut egui::Ui,
-    value: &mut MaybeMutRef<'_, ImageFormat>,
+    format: &mut MaybeMutRef<'_, re_types::components::ImageFormat>,
 ) -> egui::Response {
     // TODO(#7100): need a ui for editing this!
-    let value = value.as_ref();
-    let label = if let Some(pixel_format) = value.pixel_format {
-        format!("{} {}×{}", pixel_format, value.width, value.height)
-    } else {
-        format!(
-            "{} {} {}×{}",
-            value.color_model(),
-            value.datatype(),
-            value.width,
-            value.height
-        )
-    };
-    UiLayout::List.data_label(ui, label)
+    UiLayout::List.data_label(ui, format.as_ref().to_string())
 }

crates/viewer/re_data_ui/src/blob.rs

@@ -129,6 +129,12 @@ pub fn blob_preview_and_save_ui(
             .ok();
 
         if let Some(image) = &image {
+            if !ui_layout.is_single_line() {
+                ui.list_item_flat_noninteractive(
+                    PropertyContent::new("Image format").value_text(image.format.to_string()),
+                );
+            }
+
             let colormap = None; // TODO(andreas): Rely on default here for now.
             image_preview_ui(ctx, ui, ui_layout, query, entity_path, image, colormap);
         } else {