Dataframe view now has zebra stripes on every line (#7434)

### What

This PR adds zebra stripes to all dataframe view lines. Before, when a
row was extend to show instances (#7400), those additional lines weren't
striped. Also, the alternating colour is now a bit more visible.

<img width="1789" alt="image"
src="https://github.com/user-attachments/assets/95da89a8-d132-4b10-97fd-4f2ce20f40bc">


### Checklist
* [x] I have read and agree to [Contributor
Guide](https://github.com/rerun-io/rerun/blob/main/CONTRIBUTING.md) and
the [Code of
Conduct](https://github.com/rerun-io/rerun/blob/main/CODE_OF_CONDUCT.md)
* [x] I've included a screenshot or gif (if applicable)
* [x] I have tested the web demo (if applicable):
* Using examples from latest `main` build:
[rerun.io/viewer](https://rerun.io/viewer/pr/7434?manifest_url=https://app.rerun.io/version/main/examples_manifest.json)
* Using full set of examples from `nightly` build:
[rerun.io/viewer](https://rerun.io/viewer/pr/7434?manifest_url=https://app.rerun.io/version/nightly/examples_manifest.json)
* [x] The PR title and labels are set such as to maximize their
usefulness for the next release's CHANGELOG
* [x] If applicable, add a new check to the [release
checklist](https://github.com/rerun-io/rerun/blob/main/tests/python/release_checklist)!
* [x] If have noted any breaking changes to the log API in
`CHANGELOG.md` and the migration guide

- [PR Build Summary](https://build.rerun.io/pr/7434)
- [Recent benchmark results](https://build.rerun.io/graphs/crates.html)
- [Wasm size tracking](https://build.rerun.io/graphs/sizes.html)

To run all checks from `main`, comment on the PR with `@rerun-bot
full-check`.

crates/viewer/re_space_view_dataframe/src/dataframe_ui.rs

@@ -2,7 +2,7 @@ use std::collections::BTreeMap;
 use std::ops::Range;
 
 use anyhow::Context;
-use egui::{NumExt as _, Ui};
+use egui::NumExt as _;
 use itertools::Itertools;
 
 use re_chunk_store::{ColumnDescriptor, LatestAtQuery, RowId};
@@ -235,36 +235,8 @@ impl<'a> egui_table::TableDelegate for DataframeTableDelegate<'a> {
     fn cell_ui(&mut self, ui: &mut egui::Ui, cell: &egui_table::CellInfo) {
         re_tracing::profile_function!();
 
-        //TODO(ab): paint subcell as well
-        if cell.row_nr % 2 == 1 {
-            // Paint stripes
-            ui.painter()
-                .rect_filled(ui.max_rect(), 0.0, ui.visuals().faint_bg_color);
-        }
-
         debug_assert!(cell.row_nr < self.num_rows, "Bug in egui_table");
 
-        egui::Frame::none()
-            .inner_margin(egui::Margin::symmetric(Self::LEFT_RIGHT_MARGIN, 0.0))
-            .show(ui, |ui| {
-                self.cell_ui_impl(ui, cell);
-            });
-    }
-
-    fn row_top_offset(&self, _ctx: &egui::Context, _table_id: egui::Id, row_nr: u64) -> f32 {
-        self.expanded_rows.row_top_offset(row_nr)
-    }
-
-    fn default_row_height(&self) -> f32 {
-        re_ui::DesignTokens::table_line_height()
-    }
-}
-
-impl DataframeTableDelegate<'_> {
-    /// Draw the content of a cell.
-    fn cell_ui_impl(&mut self, ui: &mut Ui, cell: &egui_table::CellInfo) {
-        re_tracing::profile_function!();
-
         let display_data = match &self.display_data {
             Ok(display_data) => display_data,
             Err(err) => {
@@ -315,22 +287,30 @@ impl DataframeTableDelegate<'_> {
         }
 
         let instance_count = column.instance_count(batch_row_idx);
-        let row_expansion = self.expanded_rows.additional_lines_for_row(cell.row_nr);
+        let additional_lines = self.expanded_rows.additional_lines_for_row(cell.row_nr);
+
+        let is_row_odd = self.expanded_rows.is_row_odd(cell.row_nr);
 
-        // Iterate over the lines for this cell. The initial `None` value corresponds to the summary
-        // line.
-        let instance_indices = std::iter::once(None)
-            .chain((0..instance_count).map(Option::Some))
-            .take(row_expansion as usize + 1);
+        // Iterate over the top line (the summary, thus the `None`), and all additional lines.
+        // Note: we must iterate over all lines regardless of the actual number of instances so that
+        // the zebra stripes are properly drawn.
+        let instance_indices = std::iter::once(None).chain((0..additional_lines).map(Option::Some));
 
         {
-            re_tracing::profile_scope!("subcells");
+            re_tracing::profile_scope!("lines");
 
             // how the line is drawn
             let line_content = |ui: &mut egui::Ui,
                                 expanded_rows: &mut ExpandedRows<'_>,
                                 line_index: usize,
                                 instance_index: Option<u64>| {
+                // Draw the alternating background color.
+                let is_line_odd = is_row_odd ^ (line_index % 2 == 1);
+                if is_line_odd {
+                    ui.painter()
+                        .rect_filled(ui.max_rect(), 0.0, ui.visuals().faint_bg_color);
+                }
+
                 // This is called when data actually needs to be drawn (as opposed to summaries like
                 // "N instances" or "N more…").
                 let data_content = |ui: &mut egui::Ui| {
@@ -344,20 +324,33 @@ impl DataframeTableDelegate<'_> {
                     );
                 };
 
-                line_ui(
-                    ui,
-                    expanded_rows,
-                    line_index,
-                    instance_index,
-                    instance_count,
-                    cell,
-                    data_content,
-                );
+                // Draw the cell content with some margin.
+                egui::Frame::none()
+                    .inner_margin(egui::Margin::symmetric(Self::LEFT_RIGHT_MARGIN, 0.0))
+                    .show(ui, |ui| {
+                        line_ui(
+                            ui,
+                            expanded_rows,
+                            line_index,
+                            instance_index,
+                            instance_count,
+                            cell,
+                            data_content,
+                        );
+                    });
             };
 
             split_ui_vertically(ui, &mut self.expanded_rows, instance_indices, line_content);
         }
     }
+
+    fn row_top_offset(&self, _ctx: &egui::Context, _table_id: egui::Id, row_nr: u64) -> f32 {
+        self.expanded_rows.row_top_offset(row_nr)
+    }
+
+    fn default_row_height(&self) -> f32 {
+        re_ui::DesignTokens::table_line_height()
+    }
 }
 
 /// Draw a single line in a table.

crates/viewer/re_space_view_dataframe/src/expanded_rows.rs

@@ -101,6 +101,21 @@ impl<'a> ExpandedRows<'a> {
             + row_nr as f32 * self.row_height
     }
 
+    /// Returns whether the first line of the specified row is odd.
+    ///
+    /// This depends on how many additional lines the rows before have.
+    pub(crate) fn is_row_odd(&self, row_nr: u64) -> bool {
+        let total_lines = self
+            .cache
+            .expanded_rows
+            .range(0..row_nr)
+            .map(|(_, additional_lines)| *additional_lines)
+            .sum::<u64>()
+            + row_nr;
+
+        total_lines % 2 == 1
+    }
+
     /// Return by how many additional lines this row is expended.
     pub(crate) fn additional_lines_for_row(&self, row_nr: u64) -> u64 {
         self.cache.expanded_rows.get(&row_nr).copied().unwrap_or(0)

crates/viewer/re_ui/src/design_tokens.rs

@@ -130,6 +130,9 @@ impl DesignTokens {
         // let floating_color = get_aliased_color(&json, "{Alias.Color.Surface.Floating.value}");
         let floating_color = get_global_color(&self.json, "{Global.Color.Grey.250}");
 
+        // For table zebra stripes.
+        egui_style.visuals.faint_bg_color = get_global_color(&self.json, "{Global.Color.Grey.150}");
+
         // Used as the background of text edits, scroll bars and others things
         // that needs to look different from other interactive stuff.
         // We need this very dark, since the theme overall is very, very dark.