added a sort of screen selector bar at the top of each screen

textual1/app.py

@@ -24,12 +24,13 @@ import SubSonic
 os.environ['PYGAME_HIDE_SUPPORT_PROMPT'] = "hide"
 import pygame
 
-from rich.table import Table, Column
+from rich.text import Text
 
 from textual import on, events, work
+from textual.binding import Binding
 from textual.reactive import reactive
 from textual.app import App, ComposeResult, RenderResult
-from textual.widgets import Footer, Header, OptionList, DataTable, ProgressBar, Label, Input
+from textual.widgets import Footer, Header, OptionList, DataTable, ProgressBar, Label, Input, Placeholder
 from textual.widget import Widget
 from textual.containers import Horizontal, Vertical, Container
 from textual.screen import Screen
@@ -145,6 +146,12 @@ class Artists(Screen):
 
     def compose(self) -> ComposeResult:
         yield Header(icon='')
+        with Horizontal(id="headerbs"):
+            yield Label(Text("F1 ", style="bold orange").append_text(Text("Player", style="white")), classes="headerb")
+            yield Label(Text("* F2 ", style="bold orange").append_text(Text("Artists", style="white")), classes="headerb")
+            yield Label(Text("F3 ", style="bold orange").append_text(Text("Albums", style="white")), classes="headerb")
+            yield Label(Text("F4 ", style="bold orange").append_text(Text("Favourites", style="white")), classes="headerb")
+            yield Label(Text("F5 ", style="bold orange").append_text(Text("Playlists", style="white")), classes="headerb")
         with Vertical(id="artistContainer"):
             yield Input(placeholder="Search")
             yield OptionList(id="Artists")
@@ -180,6 +187,12 @@ class Albums(Screen):
 
     def compose(self) -> ComposeResult:
         yield Header(icon='')
+        with Horizontal(id="headerbs"):
+            yield Label(Text("F1 ", style="bold orange").append_text(Text("Player", style="white")), classes="headerb")
+            yield Label(Text("F2 ", style="bold orange").append_text(Text("Artists", style="white")), classes="headerb")
+            yield Label(Text("* F3 ", style="bold orange").append_text(Text("Albums", style="white")), classes="headerb")
+            yield Label(Text("F4 ", style="bold orange").append_text(Text("Favourites", style="white")), classes="headerb")
+            yield Label(Text("F5 ", style="bold orange").append_text(Text("Playlists", style="white")), classes="headerb")
         with Vertical(id="albumContainer"):
             yield Input(placeholder="Search", id="albumSearchBar")
             yield DataTable(id="albumList")
@@ -219,6 +232,12 @@ class Playlists(Screen):
 
     def compose(self) -> ComposeResult:
         yield Header(icon="")
+        with Horizontal(id="headerbs"):
+            yield Label(Text("F1 ", style="bold orange").append_text(Text("Player", style="white")), classes="headerb")
+            yield Label(Text("F2 ", style="bold orange").append_text(Text("Artists", style="white")), classes="headerb")
+            yield Label(Text("F3 ", style="bold orange").append_text(Text("Albums", style="white")), classes="headerb")
+            yield Label(Text("F4 ", style="bold orange").append_text(Text("Favourites", style="white")), classes="headerb")
+            yield Label(Text("* F5 ", style="bold orange").append_text(Text("Playlists", style="white")), classes="headerb")
         yield DataTable()
         yield Footer()
 
@@ -322,6 +341,12 @@ class Favourites(Screen):
 
     def compose(self) -> ComposeResult:
         yield Header(icon="")
+        with Horizontal(id="headerbs"):
+            yield Label(Text("F1 ", style="bold orange").append_text(Text("Player", style="white")), classes="headerb")
+            yield Label(Text("F2 ", style="bold orange").append_text(Text("Artists", style="white")), classes="headerb")
+            yield Label(Text("F3 ", style="bold orange").append_text(Text("Albums", style="white")), classes="headerb")
+            yield Label(Text("* F4 ", style="bold orange").append_text(Text("Favourites", style="white")), classes="headerb")
+            yield Label(Text("F5 ", style="bold orange").append_text(Text("Playlists", style="white")), classes="headerb")
         yield DataTable()
         yield Footer()
 
@@ -534,6 +559,12 @@ class MainView(Screen):
 
     def compose(self) -> ComposeResult:
         yield Header(icon="")
+        with Horizontal(id="headerbs"):
+            yield Label(Text("* F1 ", style="bold orange").append_text(Text("Player", style="white")), classes="headerb")
+            yield Label(Text("F2 ", style="bold orange").append_text(Text("Artists", style="white")), classes="headerb")
+            yield Label(Text("F3 ", style="bold orange").append_text(Text("Albums", style="white")), classes="headerb")
+            yield Label(Text("F4 ", style="bold orange").append_text(Text("Favourites", style="white")), classes="headerb")
+            yield Label(Text("F5 ", style="bold orange").append_text(Text("Playlists", style="white")), classes="headerb")
         with Horizontal():
             with Vertical(classes="info", id='info'):
                 yield NowPlaying(id="now-playing")
@@ -561,11 +592,11 @@ class TextualSubpyPlayer(App):
         ("d", "volume_down()", "🕩"),
         ("u", "volume_up()", "🕪"),
         ("F", "star_c_song()", "Star Current Song"),
-        ("f1", "switch_mode('main')", "Overview"),
+        Binding('f1', "switch_mode('main')", 'Overview', show=False),
-        ("f2", "switch_mode('artists')", "Artists"),
+        Binding('f2', "switch_mode('artists')", "Artists", show=False),
-        ("f3", "switch_mode('albums')", "Albums"),
+        Binding('f3', "switch_mode('albums')", "Albums", show=False),
-        ("f4", "switch_mode('favourites')", "Favourites"),
+        Binding('f4', "switch_mode('favourites')", "Favourites", show=False),
-        ("f5", "switch_mode('playlists')", "Playlists")
+        Binding('f5', "switch_mode('playlists')", "Playlists", show=False)
     ]
 
     MODES = {

textual1/main.tcss

@@ -23,3 +23,14 @@
 #artistContainer {
     height: 100%;
 }
+
+.headerb {
+    width: 20%;
+    height: 1;
+    background: #2c2e30;
+    text-align: center;
+}
+
+#headerbs {
+    height: 1;
+}