Datatable scrolling faq (#2477)

* Add FAQ about DataTable scrolling. Related issues: #2458 * Write concisely. * Update questions/datatable-doesnt-scroll.question.md Co-authored-by: Will McGugan <[email protected]> * Remove example. * Add recommendation. --------- Co-authored-by: Will McGugan <[email protected]>
Textualize · May 4, 2023 · cbd68b2 · cbd68b2
1 parent 38592c3
commit cbd68b2
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 86 deletions.
diff --git a/FAQ.md b/FAQ.md
@@ -2,16 +2,17 @@
 <!-- Do not edit by hand! -->
 
 # Frequently Asked Questions
-- [Does Textual support images?](#does-textual-support-images)
-- [How can I fix ImportError cannot import name ComposeResult from textual.app ?](#how-can-i-fix-importerror-cannot-import-name-composeresult-from-textualapp-)
-- [How can I select and copy text in a Textual app?](#how-can-i-select-and-copy-text-in-a-textual-app)
-- [How can I set a translucent app background?](#how-can-i-set-a-translucent-app-background)
-- [How do I center a widget in a screen?](#how-do-i-center-a-widget-in-a-screen)
-- [How do I pass arguments to an app?](#how-do-i-pass-arguments-to-an-app)
-- [Why do some key combinations never make it to my app?](#why-do-some-key-combinations-never-make-it-to-my-app)
-- [Why doesn't Textual look good on macOS?](#why-doesn't-textual-look-good-on-macos)
-- [Why doesn't Textual support ANSI themes?](#why-doesn't-textual-support-ansi-themes)
-- [Why doesn't the `DataTable` scroll programmatically?](#why-doesn't-the-`datatable`-scroll-programmatically)
+- [Frequently Asked Questions](#frequently-asked-questions)
+  - [Does Textual support images?](#does-textual-support-images)
+  - [How can I fix ImportError cannot import name ComposeResult from textual.app ?](#how-can-i-fix-importerror-cannot-import-name-composeresult-from-textualapp-)
+  - [How can I select and copy text in a Textual app?](#how-can-i-select-and-copy-text-in-a-textual-app)
+  - [How can I set a translucent app background?](#how-can-i-set-a-translucent-app-background)
+  - [How do I center a widget in a screen?](#how-do-i-center-a-widget-in-a-screen)
+  - [How do I pass arguments to an app?](#how-do-i-pass-arguments-to-an-app)
+  - [Why do some key combinations never make it to my app?](#why-do-some-key-combinations-never-make-it-to-my-app)
+  - [Why doesn't Textual look good on macOS?](#why-doesnt-textual-look-good-on-macos)
+  - [Why doesn't Textual support ANSI themes?](#why-doesnt-textual-support-ansi-themes)
+  - [Why doesn't the `DataTable` scroll programmatically?](#why-doesnt-the-datatable-scroll-programmatically)
 
 <a name="does-textual-support-images"></a>
 ## Does Textual support images?
@@ -235,44 +236,9 @@ There is currently a light and dark version of the design system, but more are p
 <a name="why-doesn't-the-`datatable`-scroll-programmatically"></a>
 ## Why doesn't the `DataTable` scroll programmatically?
 
-If it looks like the scrolling in your `DataTable` is broken, it may be because your `DataTable` does not have its height set, which means it is using the default value of `height: auto`.
-In turn, this means that the `DataTable` itself does not have a scrollbar and, hence, it cannot scroll.
-
-If it looks like your `DataTable` has scrollbars, those might belong to the container(s) of the `DataTable`, which in turn makes it look like the scrolling of the `DataTable` is broken.
-
-To see the difference, try running the app below with and without the comment in the attribute `TableApp.CSS`.
-Press <kbd>E</kbd> to scroll the `DataTable` to the end.
-If the `CSS` is commented out, the `DataTable` does not have a scrollbar and, therefore, there is nothing to scroll.
-
-<details>
-<summary>Example app.</summary>
-
-```py
-from textual.app import App, ComposeResult
-from textual.widgets import DataTable
-
-
-class TableApp(App):
-    # CSS = "DataTable { height: 100% }"
-
-    def compose(self) -> ComposeResult:
-        yield DataTable()
-
-    def on_mount(self) -> None:
-        table = self.query_one(DataTable)
-        table.add_column("n")
-        table.add_rows([(n,) for n in range(300)])
-
-    def key_e(self) -> None:
-        self.query_one(DataTable).action_scroll_end()
-
-
-app = TableApp()
-if __name__ == "__main__":
-    app.run()
-```
-
-</details>
+If scrolling in your `DataTable` is _apparently_ broken, it may be because your `DataTable` is using the default value of `height: auto`.
+This means that the table will be sized to fit its rows without scrolling, which may cause the *container* (typically the screen) to scroll.
+If you would like the table itself to scroll, set the height to something other than `auto`, like `100%`.
 
 <hr>
 

diff --git a/questions/datatable-doesnt-scroll.question.md b/questions/datatable-doesnt-scroll.question.md
@@ -5,41 +5,6 @@ alt_titles:
   - "Datatable cursor goes off screen and doesn't scroll."
 ---
 
-If it looks like the scrolling in your `DataTable` is broken, it may be because your `DataTable` does not have its height set, which means it is using the default value of `height: auto`.
-In turn, this means that the `DataTable` itself does not have a scrollbar and, hence, it cannot scroll.
-
-If it looks like your `DataTable` has scrollbars, those might belong to the container(s) of the `DataTable`, which in turn makes it look like the scrolling of the `DataTable` is broken.
-
-To see the difference, try running the app below with and without the comment in the attribute `TableApp.CSS`.
-Press <kbd>E</kbd> to scroll the `DataTable` to the end.
-If the `CSS` is commented out, the `DataTable` does not have a scrollbar and, therefore, there is nothing to scroll.
-
-<details>
-<summary>Example app.</summary>
-
-```py
-from textual.app import App, ComposeResult
-from textual.widgets import DataTable
-
-
-class TableApp(App):
-    # CSS = "DataTable { height: 100% }"
-
-    def compose(self) -> ComposeResult:
-        yield DataTable()
-
-    def on_mount(self) -> None:
-        table = self.query_one(DataTable)
-        table.add_column("n")
-        table.add_rows([(n,) for n in range(300)])
-
-    def key_e(self) -> None:
-        self.query_one(DataTable).action_scroll_end()
-
-
-app = TableApp()
-if __name__ == "__main__":
-    app.run()
-```
-
-</details>
+If scrolling in your `DataTable` is _apparently_ broken, it may be because your `DataTable` is using the default value of `height: auto`.
+This means that the table will be sized to fit its rows without scrolling, which may cause the *container* (typically the screen) to scroll.
+If you would like the table itself to scroll, set the height to something other than `auto`, like `100%`.