BasePage
A visual container representing a top-level view in a Flet application.
BasePage serves as the base class for Page and MultiView,
and provides a unified surface for rendering application content, app bars,
navigation elements, dialogs, overlays, and more. It manages one or more
View instances and exposes high-level layout,
scrolling, and theming properties.
Unlike lower-level layout controls (e.g., Column, Container), BasePage represents an entire logical view or screen of the app. It provides direct access to view-level controls such as AppBar, NavigationBar, FloatingActionButton, and supports system-level events like window resizing and media changes.
This class is not intended to be used directly in most apps; instead, use Page or MultiView, which extend this base functionality.
Inherits: AdaptiveControl
Properties
appbar- Gets or sets the top application bar (AppBar or CupertinoAppBar) for the view.auto_scroll- Whether root view should auto-scroll to the end on content changes.bgcolor- Background color of the root view.bottom_appbar- Bottom app bar displayed in the root view.controls- Root view content controls displayed by this page.dark_theme- Customizes the theme of the application when in dark theme mode.decoration- Background decoration of the root view container.drawer- Navigation drawer opened from the leading edge.enable_screenshots- Enable taking screenshots of the entire page withtake_screenshotmethod.end_drawer- Navigation drawer opened from the trailing edge.floating_action_button- Floating action button shown for the root view.floating_action_button_location- Placement of the floating action button in the root view.foreground_decoration- Foreground decoration painted above root view content.height- Page height in logical pixels.horizontal_alignment- Horizontal alignment of root view child controls.locale_configuration- Configures supported locales and the current locale.media- The current environmental metrics of the page or window.navigation_bar- Bottom navigation bar for the root view.overlay- The list of overlay controls rendered above page content.padding- Inner padding for the root view content.scroll- Scroll behavior mode for root view content.services- Service instances attached to the root view lifecycle.show_semantics_debugger- Whether to turn on an overlay that shows the accessibility information reported by the framework.spacing- Default spacing between root view child controls.theme- Customizes the theme of the application when in light theme mode.theme_mode- The page's theme mode.title- Page or window title.vertical_alignment- Vertical alignment of root view child controls.views- A list of views managed by the page.width- Page width in logical pixels.
Events
on_media_change- Called when media has changed.on_resize- Called when a user resizes a browser or native OS window containing Flet app
Methods
add- Adds controls to the page.clean- Remove all root view controls and send update to the client.close_drawer- Close the drawer.close_end_drawer- Close the end drawer.insert- Inserts controls at specific index ofpage.controlslist.pop_dialog- Closes the most recently opened dialog.remove- Removes specific controls frompage.controlslist.remove_at- Remove controls frompage.controlslist at specific index.scroll_to- Moves scroll position to either absoluteoffset, relativedeltaor jump to the control with specifiedscroll_key.show_dialog- Displays a dialog and manages its dismissal lifecycle.show_drawer- Show the drawer.show_end_drawer- Show the end drawer.take_screenshot- Captures a screenshot of the entire page with overlays.update- Push pending updates to the connected client.
Properties
appbarpropertywritable
appbar: Union[AppBar, CupertinoAppBar, None]Gets or sets the top application bar (AppBar or CupertinoAppBar) for the view.
The app bar typically displays the page title and optional actions such as navigation icons, menus, or other interactive elements.
auto_scrollpropertywritable
auto_scroll: boolWhether root view should auto-scroll to the end on content changes.
bottom_appbarpropertywritable
bottom_appbar: Optional[BottomAppBar]Bottom app bar displayed in the root view.
controlspropertywritable
controls: list[BaseControl]Root view content controls displayed by this page.
dark_themeclass-attributeinstance-attribute
dark_theme: Optional[Theme] = NoneCustomizes the theme of the application when in dark theme mode.
decorationpropertywritable
decoration: Optional[BoxDecoration]Background decoration of the root view container.
drawerpropertywritable
drawer: Optional[NavigationDrawer]Navigation drawer opened from the leading edge.
enable_screenshotsclass-attributeinstance-attribute
enable_screenshots: bool = FalseEnable taking screenshots of the entire page with take_screenshot method.
end_drawerpropertywritable
end_drawer: Optional[NavigationDrawer]Navigation drawer opened from the trailing edge.
floating_action_buttonpropertywritable
floating_action_button: Optional[FloatingActionButton]Floating action button shown for the root view.
floating_action_button_locationpropertywritable
floating_action_button_location: Optional[Union[FloatingActionButtonLocation, OffsetValue]]Placement of the floating action button in the root view.
foreground_decorationpropertywritable
foreground_decoration: Optional[BoxDecoration]Foreground decoration painted above root view content.
heightclass-attributeinstance-attribute
height: Optional[Number] = NonePage height in logical pixels.
- This property is read-only.
- To get or set the full window height including window chrome (e.g., title bar and borders) when running a Flet app on desktop, use the height property of flet.Page.window instead.
horizontal_alignmentpropertywritable
horizontal_alignment: CrossAxisAlignmentHorizontal alignment of root view child controls.
locale_configurationclass-attributeinstance-attribute
locale_configuration: Optional[LocaleConfiguration] = NoneConfigures supported locales and the current locale.
mediaclass-attributeinstance-attribute
media: PageMediaData = field(default_factory=(lambda: PageMediaData(padding=(Padding.zero()), view_padding=(Padding.zero()), view_insets=(Padding.zero()), device_pixel_ratio=0, orientation=(Orientation.PORTRAIT), always_use_24_hour_format=False)))The current environmental metrics of the page or window.
This data is updated whenever the platform window or layout changes, such as when rotating a device, resizing a browser window, or adjusting system UI elements like the keyboard or safe areas.
navigation_barpropertywritable
navigation_bar: Optional[Union[NavigationBar, CupertinoNavigationBar]]Bottom navigation bar for the root view.
scrollpropertywritable
scroll: Optional[Union[ScrollMode, Scrollbar]]Scroll behavior mode for root view content.
servicespropertywritable
services: list[Service]Service instances attached to the root view lifecycle.
show_semantics_debuggerclass-attributeinstance-attribute
show_semantics_debugger: Optional[bool] = NoneWhether to turn on an overlay that shows the accessibility information reported by the framework.
themeclass-attributeinstance-attribute
theme: Optional[Theme] = NoneCustomizes the theme of the application when in light theme mode. Currently, a theme can only be automatically generated from a "seed" color. For example, to generate light theme from a green color.
theme_modeclass-attributeinstance-attribute
theme_mode: Optional[ThemeMode] = ThemeMode.SYSTEMThe page's theme mode.
vertical_alignmentpropertywritable
vertical_alignment: MainAxisAlignmentVertical alignment of root view child controls.
viewsclass-attributeinstance-attribute
A list of views managed by the page.
Each View represents a distinct navigation state or screen in the application.
The first view in the list is considered the active one by default.
widthclass-attributeinstance-attribute
width: Optional[Number] = NonePage width in logical pixels.
- This property is read-only.
- To get or set the full window height including window chrome (e.g., title bar and borders) when running a Flet app on desktop, use the width property of flet.Page.window instead.
Events
on_media_changeclass-attributeinstance-attribute
on_media_change: Optional[EventHandler[PageMediaData]] = NoneCalled when media has changed.
on_resizeclass-attributeinstance-attribute
on_resize: Optional[EventHandler[PageResizeEvent]] = NoneCalled when a user resizes a browser or native OS window containing Flet app
def main(page: ft.Page):
def handle_page_size(e):
print("New page size:", page.window.width, page.window_height)
page.on_resize = handle_page_size
Methods
add
add(*controls: Control = ())Adds controls to the page.
Example:
page.add(ft.Text("Hello!"), ft.FilledButton("Button"))
insert
insert(at: int, *controls: Control = ())Inserts controls at specific index of page.controls list.
pop_dialog
pop_dialog()Closes the most recently opened dialog.
This method searches the active dialog stack for the topmost dialog that is currently open, marks it as closed, updates its state, and returns the closed dialog.
Returns:
- Optional[DialogControl] - The closed dialog instance if one was found, otherwise
None.
scroll_toasync
scroll_to(offset: Optional[Number] = None, delta: Optional[Number] = None, scroll_key: Union[ScrollKey, str, int, float, bool, None] = None, duration: Optional[DurationValue] = None, curve: Optional[AnimationCurve] = None)Moves scroll position to either absolute offset, relative delta or jump to the control with specified scroll_key.
See flet.Column.scroll_to for method details and examples.
show_dialog
show_dialog(dialog: DialogControl)Displays a dialog and manages its dismissal lifecycle.
This method adds the specified dialog to the active dialog stack
and renders it on the page.
The on_dismiss handler of the dialog
is temporarily wrapped to ensure the dialog is removed from the stack and
its dismissal event is triggered appropriately.
Parameters:
- dialog (DialogControl) - The dialog instance to display. Must not yet be open.
Raises:
- RuntimeError - If the specified dialog is already open.
show_end_drawerasync
show_end_drawer()Show the end drawer.
Raises:
- ValueError - If no end_drawer is defined.
take_screenshotasync
take_screenshot(pixel_ratio: Optional[Number] = None, delay: Optional[DurationValue] = None)Captures a screenshot of the entire page with overlays.
Parameters:
- pixel_ratio (Optional[Number], default:
None) - A pixel ratio of the captured screenshot. IfNone, device-specific pixel ratio will be used. - delay (Optional[DurationValue], default:
None) - A delay before taking a screenshot. The delay will be 20 milliseconds if not specified.
Returns:
- bytes - Screenshot in PNG format.