mirror of
https://github.com/Textualize/textual.git
synced 2025-10-17 02:38:12 +03:00
Make animation customisable
This commit is contained in:
@@ -18,7 +18,7 @@ class Info(Widget):
|
|||||||
|
|
||||||
def render(self) -> RenderableType:
|
def render(self) -> RenderableType:
|
||||||
prefix = "ℹ️ " if self.emoji else ""
|
prefix = "ℹ️ " if self.emoji else ""
|
||||||
return Padding(f"{prefix}{self.text}", pad=1)
|
return Padding(f"{prefix}{self.text}", pad=0)
|
||||||
|
|
||||||
|
|
||||||
@dataclass
|
@dataclass
|
||||||
@@ -97,6 +97,17 @@ class BasicApp(App):
|
|||||||
inactive_text_opacity=1,
|
inactive_text_opacity=1,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
WidgetDescription(
|
||||||
|
"Change the animation duration and function (animation_duration=1, animation_function='out_quad')",
|
||||||
|
Tabs(
|
||||||
|
tabs,
|
||||||
|
active_tab="one",
|
||||||
|
active_bar_style="#695CC8",
|
||||||
|
inactive_text_opacity=0.2,
|
||||||
|
animation_duration=1,
|
||||||
|
animation_function="out_quad",
|
||||||
|
),
|
||||||
|
),
|
||||||
]
|
]
|
||||||
|
|
||||||
def on_load(self):
|
def on_load(self):
|
||||||
@@ -114,6 +125,7 @@ class BasicApp(App):
|
|||||||
"""Build layout here."""
|
"""Build layout here."""
|
||||||
self.mount(
|
self.mount(
|
||||||
info=Info(
|
info=Info(
|
||||||
|
"\n"
|
||||||
"• The examples below show customisation options for the [#1493FF]Tabs[/] widget.\n"
|
"• The examples below show customisation options for the [#1493FF]Tabs[/] widget.\n"
|
||||||
"• Press keys 1-6 on your keyboard to switch tabs, or click on a tab.",
|
"• Press keys 1-6 on your keyboard to switch tabs, or click on a tab.",
|
||||||
emoji=False,
|
emoji=False,
|
||||||
|
|||||||
@@ -75,8 +75,10 @@ class Tabs(Widget):
|
|||||||
active_tab: str | None = None,
|
active_tab: str | None = None,
|
||||||
active_bar_style: StyleType = "#1BB152",
|
active_bar_style: StyleType = "#1BB152",
|
||||||
inactive_bar_style: StyleType = "#455058",
|
inactive_bar_style: StyleType = "#455058",
|
||||||
tab_padding: int | None = None,
|
|
||||||
inactive_text_opacity: float = 0.5,
|
inactive_text_opacity: float = 0.5,
|
||||||
|
animation_duration: float = 0.3,
|
||||||
|
animation_function: str = "out_cubic",
|
||||||
|
tab_padding: int | None = None,
|
||||||
) -> None:
|
) -> None:
|
||||||
super().__init__()
|
super().__init__()
|
||||||
self.tabs = tabs
|
self.tabs = tabs
|
||||||
@@ -85,9 +87,13 @@ class Tabs(Widget):
|
|||||||
self.active_tab_name = active_tab or tabs[0]
|
self.active_tab_name = active_tab or tabs[0]
|
||||||
self.active_bar_style = active_bar_style
|
self.active_bar_style = active_bar_style
|
||||||
self.inactive_bar_style = inactive_bar_style
|
self.inactive_bar_style = inactive_bar_style
|
||||||
self.bar_offset = float(self.get_tab_index(active_tab) or 0)
|
|
||||||
self.inactive_text_opacity = inactive_text_opacity
|
self.inactive_text_opacity = inactive_text_opacity
|
||||||
|
|
||||||
|
self.bar_offset = float(self.get_tab_index(active_tab) or 0)
|
||||||
|
|
||||||
|
self.animation_function = animation_function
|
||||||
|
self.animation_duration = animation_duration
|
||||||
|
|
||||||
self._used = False
|
self._used = False
|
||||||
self.tab_padding = tab_padding
|
self.tab_padding = tab_padding
|
||||||
|
|
||||||
@@ -97,7 +103,10 @@ class Tabs(Widget):
|
|||||||
def watch_active_tab_name(self, tab_name: str) -> None:
|
def watch_active_tab_name(self, tab_name: str) -> None:
|
||||||
target_tab_index = self.get_tab_index(tab_name)
|
target_tab_index = self.get_tab_index(tab_name)
|
||||||
self.animate(
|
self.animate(
|
||||||
"bar_offset", float(target_tab_index), easing="out_cubic", duration=0.3
|
"bar_offset",
|
||||||
|
float(target_tab_index),
|
||||||
|
easing=self.animation_function,
|
||||||
|
duration=self.animation_duration,
|
||||||
)
|
)
|
||||||
self._used = True
|
self._used = True
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user