diff --git a/docs/guide/animation.md b/docs/guide/animation.md index dd649454e..7768594d8 100644 --- a/docs/guide/animation.md +++ b/docs/guide/animation.md @@ -1,11 +1,11 @@ # Animation -Ths chapter discusses how to use Textual's animation system. +Ths chapter discusses how to use Textual's animation system to create visual effects such as movement, blending, and fading. ## Animating styles -Textual's animator can change an attribute from one value to another in fixed increments over a period of time. You can apply this to [styles](styles.md) such `offset` to move widgets around the screen, and `opacity` to create fading effects. +Textual's animator can change an attribute from one value to another in fixed increments over a period of time. You can apply animations to [styles](styles.md) such `offset` to move widgets around the screen, and `opacity` to create fading effects. Apps and widgets both have an [animate][textual.app.App.animate] method which will animate properties on those objects. Additionally, `styles` objects have an identical `animate` method which will animate styles. @@ -55,7 +55,14 @@ For instance, if you animate a value at 0 to 10 with a speed of 2, it will compl The easing function determines the journey a value takes on its way to the target value. It could move at a constant pace, or it might start off slow then accelerate towards its final value. -Textual supports a number of [easing functions](https://easings.net/). Run the following from the command prompt to preview them. +Textual supports a number of [easing functions](https://easings.net/). + +
+--8<-- "docs/images/animation/animation.excalidraw.svg" +
+ + +Run the following from the command prompt to preview them. ```bash textual easing diff --git a/docs/guide/devtools.md b/docs/guide/devtools.md index e6bb72ac6..fa835bba3 100644 --- a/docs/guide/devtools.md +++ b/docs/guide/devtools.md @@ -6,8 +6,6 @@ See [getting started](../getting_started.md#installation) for details. - - Textual comes with a command line application of the same name. The `textual` command is a super useful tool that will help you to build apps. Take a moment to look through the available sub-commands. There will be even more helpful tools here in the future. diff --git a/docs/guide/styles.md b/docs/guide/styles.md index 1b382d1cf..30c50057c 100644 --- a/docs/guide/styles.md +++ b/docs/guide/styles.md @@ -2,7 +2,6 @@ In this chapter will explore how you can apply styles to your application to create beautiful user interfaces. - ## Styles object Every Textual widget class provides a `styles` object which contains a number of attributes. These attributes tell Textual how the widget should be displayed. Setting any of these attributes will update the screen accordingly.