From 352c9ebef7747f7f05107e89327c29602bf7a49c Mon Sep 17 00:00:00 2001 From: Will McGugan Date: Thu, 27 Apr 2023 11:23:02 +0100 Subject: [PATCH 1/2] Add progress bar to gallery --- CHANGELOG.md | 2 +- docs/widget_gallery.md | 11 +++++++++++ docs/widgets/progress_bar.md | 25 ++++++++++--------------- 3 files changed, 22 insertions(+), 16 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 79b319a6e0..b035cbc797 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,7 +5,7 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](http://keepachangelog.com/) and this project adheres to [Semantic Versioning](http://semver.org/). -## Unrelased +## Unreleased ### Added diff --git a/docs/widget_gallery.md b/docs/widget_gallery.md index 7a9d40e290..52d3c0094f 100644 --- a/docs/widget_gallery.md +++ b/docs/widget_gallery.md @@ -158,6 +158,17 @@ Display placeholder content while you are designing a UI. ```{.textual path="docs/examples/widgets/placeholder.py"} ``` +## ProgressBar + +A configurable progress bar with ETA and percentage. + +[ProgressBar reference](./widgets/progress_bar.md){ .md-button .md-button--primary } + + +```{.textual path="docs/examples/widgets/progress_bar.py" press="tab,5,0,tab,enter"} +``` + + ## RadioButton A simple radio button. diff --git a/docs/widgets/progress_bar.md b/docs/widgets/progress_bar.md index 1544686a67..28d87c91d9 100644 --- a/docs/widgets/progress_bar.md +++ b/docs/widgets/progress_bar.md @@ -106,27 +106,22 @@ Refer to the [section below](#styling-the-progress-bar) for more information. ## Reactive Attributes -| Name | Type | Default | Description | -|------|------|---------|-------------| -| `percentage` | `float | None` | `None` | The read-only percentage of progress that has been made. This is `None` if the `total` hasn't been set. | -| `progress` | `float` | `0` | The number of steps of progress already made. | -| `total` | `float | None` | `None` | The total number of steps that we are keeping track of. | - -## Messages - -- [ProgressBar.Completed][textual.widgets.ProgressBar.Completed] -- [ProgressBar.Started][textual.widgets.ProgressBar.Started] +| Name | Type | Default | Description | +| ------------ | ------- | ------- | --------------------------------------------- | +| `percentage` | `float | None` | `None` | The read-only percentage of progress that has been made. This is `None` if the `total` hasn't been set. | +| `progress` | `float` | `0` | The number of steps of progress already made. | +| `total` | `float | None` | `None` | The total number of steps that we are keeping track of. | ## Styling the Progress Bar The progress bar is composed of three sub-widgets that can be styled independently: -| Widget name | ID | Description | -|-------------|----|-------------| -| `Bar` | `#bar` | The bar that visually represents the progress made. | -| `PercentageStatus` | `#percentage` | [Label](./label.md) that shows the percentage of completion. | -| `ETAStatus` | `#eta` | [Label](./label.md) that shows the estimated time to completion. | +| Widget name | ID | Description | +| ------------------ | ------------- | ---------------------------------------------------------------- | +| `Bar` | `#bar` | The bar that visually represents the progress made. | +| `PercentageStatus` | `#percentage` | [Label](./label.md) that shows the percentage of completion. | +| `ETAStatus` | `#eta` | [Label](./label.md) that shows the estimated time to completion. | ### Bar Component Classes From fbcfb8a0aa8cbee804465109633786f52d5d355d Mon Sep 17 00:00:00 2001 From: Will McGugan Date: Thu, 27 Apr 2023 11:27:25 +0100 Subject: [PATCH 2/2] table fix --- docs/widget_gallery.md | 2 +- docs/widgets/progress_bar.md | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/widget_gallery.md b/docs/widget_gallery.md index 52d3c0094f..fe4ea065dd 100644 --- a/docs/widget_gallery.md +++ b/docs/widget_gallery.md @@ -160,7 +160,7 @@ Display placeholder content while you are designing a UI. ## ProgressBar -A configurable progress bar with ETA and percentage. +A configurable progress bar with ETA and percentage complete. [ProgressBar reference](./widgets/progress_bar.md){ .md-button .md-button--primary } diff --git a/docs/widgets/progress_bar.md b/docs/widgets/progress_bar.md index 28d87c91d9..560d9d8df9 100644 --- a/docs/widgets/progress_bar.md +++ b/docs/widgets/progress_bar.md @@ -106,11 +106,11 @@ Refer to the [section below](#styling-the-progress-bar) for more information. ## Reactive Attributes -| Name | Type | Default | Description | -| ------------ | ------- | ------- | --------------------------------------------- | -| `percentage` | `float | None` | `None` | The read-only percentage of progress that has been made. This is `None` if the `total` hasn't been set. | -| `progress` | `float` | `0` | The number of steps of progress already made. | -| `total` | `float | None` | `None` | The total number of steps that we are keeping track of. | +| Name | Type | Default | Description | +| ------------ | ------- | ------- | ------------------------------------------------------------------------------------------------------- | +| `percentage` | `float | None` | The read-only percentage of progress that has been made. This is `None` if the `total` hasn't been set. | +| `progress` | `float` | `0` | The number of steps of progress already made. | +| `total` | `float | None` | The total number of steps that we are keeping track of. | ## Styling the Progress Bar