use key <kbd>i</kbd> to pop up information screen.

flameshow/render/app.py

@@ -11,7 +11,7 @@
 from textual.widgets import Footer, Static, Tabs, Tab
 
 from flameshow import __version__
-from flameshow.render.framedetail import FrameDetail
+from flameshow.render.framedetail import FrameDetail, InformaionScreen
 from flameshow.render.header import FlameshowHeader
 from flameshow.render.tabs import SampleTabs
 
@@ -58,6 +58,7 @@ class FlameshowApp(App):
         ),
         Binding("ctrl+c,q", "quit", "Quit", show=True, key_display="Q"),
         Binding("o", "debug"),
+        Binding("i", "information_screen", "Toggle view stack", show=True),
     ]
 
     DEFAULT_CSS = """
@@ -125,6 +126,7 @@ def __init__(
             frame=self.root_stack,
             sample_index=self.sample_index,
         )
+        self.show_information_screen = False
 
     def on_mount(self):
         logger.info("mounted")
@@ -228,3 +230,14 @@ def handle_sample_type_changed(self, event: Tabs.TabActivated):
         logger.info("Tab changed: %s", event)
         chosen_index = event.tab.id.split("-")[1]
         self.sample_index = int(chosen_index)
+
+    def action_information_screen(self):
+        if self.show_information_screen:
+            self.pop_screen()
+        else:
+            self.push_screen(
+                InformaionScreen(
+                    self.view_frame, self.sample_index, self.sample_unit
+                )
+            )
+        self.show_information_screen = not self.show_information_screen

flameshow/render/framedetail.py

@@ -3,10 +3,12 @@
 from textual.containers import Vertical, VerticalScroll
 from textual.css.query import NoMatches
 from textual.reactive import reactive
+from textual.screen import Screen
 from textual.widget import Widget
-from textual.widgets import Static
+from textual.widgets import Footer, Static
 
 from flameshow.models import Frame
+from flameshow.render.header import FlameshowHeader
 from flameshow.utils import sizeof
 
 logger = logging.getLogger(__name__)
@@ -392,3 +394,31 @@ def watch_frame(self, new_frame):
     def watch_sample_index(self, new_sample_index):
         logger.info("sample index changed to: %s", new_sample_index)
         self._rerender()
+
+
+class InformaionScreen(Screen):
+    def __init__(
+        self, frame, sample_index, sample_unit, *args, **kwargs
+    ) -> None:
+        super().__init__(*args, **kwargs)
+        self.frame = frame
+        self.sample_index = sample_index
+        self.sample_unit = sample_unit
+
+    def compose(self):
+        center_text = "Stack detail information"
+        yield FlameshowHeader(center_text)
+        content, height = self.frame.render_detail(
+            self.sample_index, self.sample_unit
+        )
+        span_detail = Static(
+            content,
+            id="span-detail",
+        )
+        span_detail.styles.height = height
+        span_stack_container = VerticalScroll(
+            span_detail, id="span-stack-container"
+        )
+        span_stack_container.border_title = self.frame.render_title()
+        yield span_stack_container
+        yield Footer()