alihan/textual
1
0
Fork 0
mirror of https://github.com/Textualize/textual.git synced 2025-10-17 02:38:12 +03:00
Code Issues Packages Projects Releases Wiki Activity

Button docs, change container utilities

Browse Source
This commit is contained in:
Darren Burns
2022-09-14 15:15:10 +01:00
parent 29b6c9a2e3
commit 1b53a9e9a4
4 changed files with 51 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
docs/examples/widgets/button.css
View File

@@ -1,3 +1,12 @@
Button {
margin: 1 2;
}
Horizontal > Vertical {
width: 24;
}
.header {
margin: 1 0 0 2;
text-style: bold;
}

26
docs/examples/widgets/button.py
View File

@@ -1,14 +1,28 @@
from textual import layout
from textual.app import App, ComposeResult
from textual.widgets import Button
from textual.widgets import Button, Static
class ButtonsApp(App):
def compose(self) -> ComposeResult:
yield Button("Default", id="foo")
yield Button("Disabled", disabled=True)
yield Button.success("Success!")
yield Button.warning("Warning!")
yield Button.error("Error!")
yield layout.Horizontal(
layout.Vertical(
Static("Standard Buttons", classes="header"),
Button("Default"),
Button("Primary!", variant="primary"),
Button.success("Success!"),
Button.warning("Warning!"),
Button.error("Error!"),
),
layout.Vertical(
Static("Disabled Buttons", classes="header"),
Button("Default", disabled=True),
Button("Primary!", variant="primary", disabled=True),
Button.success("Success!", disabled=True),
Button.warning("Warning!", disabled=True),
Button.error("Error!", disabled=True),
),
)
def on_button_pressed(self, _event: Button.Pressed) -> None:
self.app.bell()

13
docs/widgets/button.md
View File

@@ -10,7 +10,8 @@ when it has focus.
## Example
Clicking any of the buttons in the example app below will result in a ring of the terminal bell.
The example below shows each button variant, and its disabled equivalent.
Clicking any of the non-disabled buttons in the example app below will result in a ring of the terminal bell.
=== "Output"
@@ -31,11 +32,11 @@ Clicking any of the buttons in the example app below will result in a ring of th
## Reactive Attributes
| Name | Type | Default | Description |
|------------|--------|-------------|------------------------------------------------------------------------------------------------------------------------|
| `label` | `str` | `""` | The text that appears inside the button. |
| `variant` | `str` | `"default"` | Semantic styling variant. One of `default`, `primary`, `success`, `warning`, `error`. |
| `disabled` | `bool` | `False` | Whether the button is disabled or not. Disabled buttons cannot be clicked, and are styled in a way that suggests this. |
| Name | Type | Default | Description |
|------------|--------|-------------|-----------------------------------------------------------------------------------------------------------------------------------|
| `label` | `str` | `""` | The text that appears inside the button. |
| `variant` | `str` | `"default"` | Semantic styling variant. One of `default`, `primary`, `success`, `warning`, `error`. |
| `disabled` | `bool` | `False` | Whether the button is disabled or not. Disabled buttons cannot be focused or clicked, and are styled in a way that suggests this. |
## Events

26
src/textual/layout.py
View File

@@ -6,35 +6,39 @@ class Container(Widget):
DEFAULT_CSS = """
Container {
layout: vertical;
layout: vertical;
overflow: auto;
}
}
"""
class Vertical(Container):
class Vertical(Widget):
"""A container widget to align children vertically."""
# Blank CSS is important, otherwise you get a clone of Container
DEFAULT_CSS = ""
DEFAULT_CSS = """
Vertical {
layout: vertical;
overflow-y: auto;
}
"""
class Horizontal(Container):
class Horizontal(Widget):
"""A container widget to align children horizontally."""
DEFAULT_CSS = """
Horizontal {
layout: horizontal;
}
layout: horizontal;
overflow-x: hidden;
}
"""
class Center(Container):
class Center(Widget):
"""A container widget to align children in the center."""
DEFAULT_CSS = """
Center {
layout: center;
layout: center;
}
"""