diff --git a/packages/flet/lib/src/controls/dropdown.dart b/packages/flet/lib/src/controls/dropdown.dart index 7fdebd3cc6..df3bb3de42 100644 --- a/packages/flet/lib/src/controls/dropdown.dart +++ b/packages/flet/lib/src/controls/dropdown.dart @@ -280,6 +280,7 @@ class _DropdownControlState extends State { helperText: widget.control.getString("helper_text"), menuStyle: menuStyle, inputDecorationTheme: inputDecorationTheme, + inputFormatters: inputFormatters.isEmpty ? null : inputFormatters, onSelected: widget.control.disabled ? null : (String? selection) { @@ -291,7 +292,6 @@ class _DropdownControlState extends State { ); var didAutoFocus = false; - if (!didAutoFocus && autofocus) { didAutoFocus = true; SchedulerBinding.instance.addPostFrameCallback((_) { diff --git a/packages/flet/lib/src/controls/page.dart b/packages/flet/lib/src/controls/page.dart index 7edb16519f..f2180429c8 100644 --- a/packages/flet/lib/src/controls/page.dart +++ b/packages/flet/lib/src/controls/page.dart @@ -341,8 +341,7 @@ class _PageControlState extends State with WidgetsBindingObserver { var appStatus = context .select((backend) => (isLoading: backend.isLoading, error: backend.error)); - var appStartupScreenMessage = - backend.appStartupScreenMessage ?? ""; + var appStartupScreenMessage = backend.appStartupScreenMessage ?? ""; var formattedErrorMessage = backend.formatAppErrorMessage(appStatus.error); @@ -432,6 +431,18 @@ class _PageControlState extends State with WidgetsBindingObserver { ? control.getCupertinoTheme("dark_theme", context, Brightness.dark) : control.getCupertinoTheme("theme", context, Brightness.dark); + var materialTheme = themeMode == ThemeMode.dark || + ((themeMode == null || themeMode == ThemeMode.system) && + brightness == Brightness.dark) + ? darkTheme + : lightTheme; + + Widget scaffoldMessengerBuilder(BuildContext context, Widget? child) { + return Theme( + data: materialTheme ?? lightTheme ?? ThemeData(), + child: ScaffoldMessenger(child: child ?? const SizedBox.shrink())); + } + var showSemanticsDebugger = control.getBool("show_semantics_debugger", false)!; @@ -442,6 +453,7 @@ class _PageControlState extends State with WidgetsBindingObserver { showSemanticsDebugger: showSemanticsDebugger, title: windowTitle, theme: cupertinoTheme, + builder: scaffoldMessengerBuilder, supportedLocales: localeConfiguration.supportedLocales, locale: localeConfiguration.locale, localizationsDelegates: localizationsDelegates, @@ -454,6 +466,7 @@ class _PageControlState extends State with WidgetsBindingObserver { routeInformationParser: _routeParser, title: windowTitle, theme: cupertinoTheme, + builder: scaffoldMessengerBuilder, localizationsDelegates: localizationsDelegates, supportedLocales: localeConfiguration.supportedLocales, locale: localeConfiguration.locale, @@ -503,14 +516,12 @@ class _PageControlState extends State with WidgetsBindingObserver { var backend = FletBackend.of(context); var showAppStartupScreen = backend.showAppStartupScreen ?? false; - var appStartupScreenMessage = - backend.appStartupScreenMessage ?? ""; + var appStartupScreenMessage = backend.appStartupScreenMessage ?? ""; var appStatus = context.select( (backend) => (isLoading: backend.isLoading, error: backend.error)); - var formattedErrorMessage = - backend.formatAppErrorMessage(appStatus.error); + var formattedErrorMessage = backend.formatAppErrorMessage(appStatus.error); var views = widget.control.children("views"); List> pages = []; diff --git a/sdk/python/examples/controls/pagelet/__init__.py b/sdk/python/examples/controls/pagelet/__init__.py new file mode 100644 index 0000000000..e69de29bb2 diff --git a/sdk/python/examples/controls/pagelet/basic.py b/sdk/python/examples/controls/pagelet/basic.py index c0ffd5d230..53784803cb 100644 --- a/sdk/python/examples/controls/pagelet/basic.py +++ b/sdk/python/examples/controls/pagelet/basic.py @@ -4,32 +4,28 @@ def main(page: ft.Page): + page.horizontal_alignment = ft.MainAxisAlignment.CENTER + page.vertical_alignment = ft.CrossAxisAlignment.CENTER + async def handle_show_drawer(e: ft.Event[ft.FloatingActionButton]): await pagelet.show_drawer() - async def handle_show_end_drawer(): + async def handle_show_end_drawer(e: ft.Event[ft.Button]): await pagelet.show_end_drawer() await asyncio.sleep(3) await pagelet.close_end_drawer() page.add( pagelet := ft.Pagelet( - width=400, - height=400, + width=500, + height=500, appbar=ft.AppBar( - title=ft.Text("Pagelet AppBar Title"), - bgcolor=ft.Colors.AMBER_ACCENT, - ), - content=ft.Container( - ft.Column( - [ - ft.Text("Pagelet Body"), - ft.Button("Show end drawer", on_click=handle_show_end_drawer), - ] - ), - padding=ft.Padding.all(16), + title=ft.Text("Pagelet AppBar"), + center_title=True, + bgcolor=ft.Colors.RED_500, ), - bgcolor=ft.Colors.AMBER_100, + content=ft.Text("Pagelet Body"), + bgcolor=ft.Colors.SURFACE_CONTAINER_HIGHEST, bottom_appbar=ft.BottomAppBar( bgcolor=ft.Colors.BLUE, shape=ft.CircularRectangleNotchShape(), @@ -71,13 +67,13 @@ async def handle_show_end_drawer(): ], ), floating_action_button=ft.FloatingActionButton( - content="Open", + icon=ft.Icons.ADD, shape=ft.CircleBorder(), - on_click=handle_show_drawer, ), floating_action_button_location=ft.FloatingActionButtonLocation.CENTER_DOCKED, ) ) -ft.run(main) +if __name__ == "__main__": + ft.run(main) diff --git a/sdk/python/examples/controls/pagelet/media/basic.png b/sdk/python/examples/controls/pagelet/media/basic.png deleted file mode 100644 index 62e4ef5115..0000000000 Binary files a/sdk/python/examples/controls/pagelet/media/basic.png and /dev/null differ diff --git a/sdk/python/examples/controls/responsive_row/basic.py b/sdk/python/examples/controls/responsive_row/basic.py index 9992683baa..d91cbaddaa 100644 --- a/sdk/python/examples/controls/responsive_row/basic.py +++ b/sdk/python/examples/controls/responsive_row/basic.py @@ -18,34 +18,59 @@ def handle_page_resize(e: ft.PageResizeEvent): content=ft.Text("Column 1"), padding=5, bgcolor=ft.Colors.YELLOW, - col={"xs": 12, "md": 6, "lg": 3}, + col={ + ft.ResponsiveRowBreakpoint.XS: 12, + ft.ResponsiveRowBreakpoint.MD: 6, + ft.ResponsiveRowBreakpoint.LG: 3, + }, ), ft.Container( content=ft.Text("Column 2"), padding=5, bgcolor=ft.Colors.GREEN, - col={"xs": 12, "md": 6, "lg": 3}, + col={ + ft.ResponsiveRowBreakpoint.XS: 12, + ft.ResponsiveRowBreakpoint.MD: 6, + ft.ResponsiveRowBreakpoint.LG: 3, + }, ), ft.Container( content=ft.Text("Column 3"), padding=5, bgcolor=ft.Colors.BLUE, - col={"xs": 12, "md": 6, "lg": 3}, + col={ + ft.ResponsiveRowBreakpoint.XS: 12, + ft.ResponsiveRowBreakpoint.MD: 6, + ft.ResponsiveRowBreakpoint.LG: 3, + }, ), ft.Container( content=ft.Text("Column 4"), padding=5, bgcolor=ft.Colors.PINK_300, - col={"xs": 12, "md": 6, "lg": 3}, + col={ + ft.ResponsiveRowBreakpoint.XS: 12, + ft.ResponsiveRowBreakpoint.MD: 6, + ft.ResponsiveRowBreakpoint.LG: 3, + }, ), ], ), ft.ResponsiveRow( - run_spacing={"xs": 10}, + run_spacing={ft.ResponsiveRowBreakpoint.XS: 10}, controls=[ - ft.TextField(label="TextField 1", col={"md": 4}), - ft.TextField(label="TextField 2", col={"md": 4}), - ft.TextField(label="TextField 3", col={"md": 4}), + ft.TextField( + label="TextField 1", + col={ft.ResponsiveRowBreakpoint.MD: 4}, + ), + ft.TextField( + label="TextField 2", + col={ft.ResponsiveRowBreakpoint.MD: 4}, + ), + ft.TextField( + label="TextField 3", + col={ft.ResponsiveRowBreakpoint.MD: 4}, + ), ], ), pw, diff --git a/sdk/python/examples/controls/responsive_row/custom_breakpoint.py b/sdk/python/examples/controls/responsive_row/custom_breakpoint.py new file mode 100644 index 0000000000..bab9f64b5f --- /dev/null +++ b/sdk/python/examples/controls/responsive_row/custom_breakpoint.py @@ -0,0 +1,102 @@ +import flet as ft + + +def main(page: ft.Page): + page.title = "ResponsiveRow with custom breakpoints" + page.padding = 16 + + breakpoints = { + "phone": 0, + "tablet": 640, + "desktop": 1000, + } + + sorted_breakpoints = sorted(breakpoints.items(), key=lambda item: item[1]) + + breakpoint_labels = { + name: ft.Text(f"{name}: \u2265 {value}px", weight=ft.FontWeight.W_500) + for name, value in sorted_breakpoints + } + + width_label = ft.Text() + breakpoint_label = ft.Text() + + def update_status(_=None): + width = ( + (page.window.width if page.window and page.window.width else None) + or page.width + or 0 + ) + width_label.value = f"Page width: {width:.0f}px" + active_breakpoint = max( + (bp for bp, min_width in breakpoints.items() if width >= min_width), + key=lambda bp: breakpoints[bp], + default="phone", + ) + breakpoint_label.value = f"Active breakpoint: {active_breakpoint}" + for name, label in breakpoint_labels.items(): + is_active = name == active_breakpoint + label.color = ft.Colors.BLUE_700 if is_active else None + label.weight = ft.FontWeight.W_700 if is_active else ft.FontWeight.W_400 + label.update() + width_label.update() + breakpoint_label.update() + + page.on_resize = update_status + + page.add( + ft.Text("Resize the window to see custom breakpoints in action."), + ft.Text("Cards switch column spans at phone, tablet, and desktop widths."), + ft.Column( + [ + ft.Text( + "Custom breakpoints (min widths):", + weight=ft.FontWeight.W_600, + ), + ft.Column(list(breakpoint_labels.values()), spacing=2), + ], + spacing=6, + ), + ft.ResponsiveRow( + breakpoints=breakpoints, + columns={"phone": 4, "tablet": 8, "desktop": 12}, + spacing=10, + run_spacing=10, + controls=[ + ft.Container( + content=ft.Text("Card 1", size=16, weight=ft.FontWeight.W_600), + alignment=ft.Alignment.CENTER, + bgcolor=ft.Colors.AMBER_200, + height=90, + col={"phone": 4, "tablet": 4, "desktop": 3}, + ), + ft.Container( + content=ft.Text("Card 2", size=16, weight=ft.FontWeight.W_600), + alignment=ft.Alignment.CENTER, + bgcolor=ft.Colors.GREEN_200, + height=90, + col={"phone": 4, "tablet": 4, "desktop": 3}, + ), + ft.Container( + content=ft.Text("Card 3", size=16, weight=ft.FontWeight.W_600), + alignment=ft.Alignment.CENTER, + bgcolor=ft.Colors.BLUE_200, + height=90, + col={"phone": 4, "tablet": 4, "desktop": 3}, + ), + ft.Container( + content=ft.Text("Card 4", size=16, weight=ft.FontWeight.W_600), + alignment=ft.Alignment.CENTER, + bgcolor=ft.Colors.PINK_200, + height=90, + col={"phone": 4, "tablet": 4, "desktop": 3}, + ), + ], + ), + width_label, + breakpoint_label, + ) + update_status() + + +ft.run(main) diff --git a/sdk/python/packages/flet/docs/controls/menubar.md b/sdk/python/packages/flet/docs/controls/menubar.md index fb055d02f8..6d93acfe65 100644 --- a/sdk/python/packages/flet/docs/controls/menubar.md +++ b/sdk/python/packages/flet/docs/controls/menubar.md @@ -16,7 +16,7 @@ example_images: ../examples/controls/menu_bar/media --8<-- "{{ examples }}/nested_submenus.py" ``` -{{ image(example_images + "/nested_submenus.gif", alt="nested-submenus", width="80%") }} +{{ image(example_images + "/nested_submenus.gif", width="80%") }} {{ class_members(class_name) }} diff --git a/sdk/python/packages/flet/docs/controls/pagelet.md b/sdk/python/packages/flet/docs/controls/pagelet.md index 5d6c6deb4f..a824569939 100644 --- a/sdk/python/packages/flet/docs/controls/pagelet.md +++ b/sdk/python/packages/flet/docs/controls/pagelet.md @@ -1,22 +1,22 @@ --- class_name: flet.Pagelet examples: ../../examples/controls/pagelet -example_images: ../examples/controls/pagelet/media +example_images: ../test-images/examples/core/golden/macos/pagelet --- -{{ class_summary(class_name) }} +{{ class_summary(class_name, example_images + "/image_for_docs.png", image_caption="Basic Pagelet") }} ## Examples [Live example](https://flet-controls-gallery.fly.dev/layout/pagelet) -### Pagelet example +### Basic example ```python --8<-- "{{ examples }}/basic.py" ``` -{{ image(example_images + "/basic.png", alt="basic", width="80%") }} +{{ image(example_images + "/basic.png", width="80%") }} {{ class_members(class_name) }} diff --git a/sdk/python/packages/flet/docs/controls/responsiverow.md b/sdk/python/packages/flet/docs/controls/responsiverow.md index e719b4a44b..e321ca2455 100644 --- a/sdk/python/packages/flet/docs/controls/responsiverow.md +++ b/sdk/python/packages/flet/docs/controls/responsiverow.md @@ -19,4 +19,11 @@ example_images: ../examples/controls/responsive_row/media {{ image(example_images + "/basic.gif", alt="basic", width="80%") }} +### Custom breakpoints + +```python +--8<-- "{{ examples }}/custom_breakpoint.py" +``` + + {{ class_members(class_name) }} diff --git a/sdk/python/packages/flet/docs/controls/segment.md b/sdk/python/packages/flet/docs/controls/segment.md new file mode 100644 index 0000000000..82d83b5900 --- /dev/null +++ b/sdk/python/packages/flet/docs/controls/segment.md @@ -0,0 +1,5 @@ +--- +class_name: flet.Segment +--- + +{{ class_all_options(class_name) }} diff --git a/sdk/python/packages/flet/docs/controls/segmentedbutton.md b/sdk/python/packages/flet/docs/controls/segmentedbutton.md index f1767bc23e..30c59806ce 100644 --- a/sdk/python/packages/flet/docs/controls/segmentedbutton.md +++ b/sdk/python/packages/flet/docs/controls/segmentedbutton.md @@ -2,7 +2,6 @@ class_name: flet.SegmentedButton examples: ../../examples/controls/segmented_button example_images: ../test-images/examples/material/golden/macos/segmented_button -segment_class_name: flet.Segment --- {{ class_summary(class_name, example_images + "/image_for_docs.png", image_caption="Basic segmented button") }} @@ -17,9 +16,7 @@ segment_class_name: flet.Segment --8<-- "{{ examples }}/single_multiple_selection.py" ``` -{{ image(example_images + "/single_multiple_selection.png", alt="basic", width="80%") }} +{{ image(example_images + "/single_multiple_selection.png", width="80%") }} {{ class_members(class_name) }} - -{{ class_all_options(segment_class_name) }} diff --git a/sdk/python/packages/flet/integration_tests/controls/core/golden/macos/pagelet/basic.png b/sdk/python/packages/flet/integration_tests/controls/core/golden/macos/pagelet/basic.png new file mode 100644 index 0000000000..590056900d Binary files /dev/null and b/sdk/python/packages/flet/integration_tests/controls/core/golden/macos/pagelet/basic.png differ diff --git a/sdk/python/packages/flet/integration_tests/controls/core/golden/macos/pagelet/cupertino_adaptive.png b/sdk/python/packages/flet/integration_tests/controls/core/golden/macos/pagelet/cupertino_adaptive.png new file mode 100644 index 0000000000..64f24b93e4 Binary files /dev/null and b/sdk/python/packages/flet/integration_tests/controls/core/golden/macos/pagelet/cupertino_adaptive.png differ diff --git a/sdk/python/packages/flet/integration_tests/controls/core/test_pagelet.py b/sdk/python/packages/flet/integration_tests/controls/core/test_pagelet.py index ed643d9511..e88027e4b7 100644 --- a/sdk/python/packages/flet/integration_tests/controls/core/test_pagelet.py +++ b/sdk/python/packages/flet/integration_tests/controls/core/test_pagelet.py @@ -1,28 +1,38 @@ -# @pytest.mark.asyncio(loop_scope="module") -# async def test_pagelet_basic(flet_app: ftt.FletTestApp, request): -# await flet_app.assert_control_screenshot( -# request.node.name, -# ft.Pagelet( -# ft.Container(bgcolor=ft.Colors.AMBER, content=ft.Text("Pagelet Content")) -# ), -# ) +import pytest +import flet as ft +import flet.testing as ftt -# @pytest.mark.asyncio(loop_scope="module") -# async def test_pagelet_basic(flet_app: ftt.FletTestApp, request): -# flet_app.page.enable_screenshots = True -# flet_app.resize_page(400, 300) -# flet_app.page.add( -# ft.Pagelet( -# ft.Container(bgcolor=ft.Colors.AMBER, content=ft.Text("Pagelet Content")) -# ), -# ) -# await flet_app.tester.pump_and_settle() +@pytest.mark.asyncio(loop_scope="module") +async def test_basic(flet_app: ftt.FletTestApp, request): + await flet_app.assert_control_screenshot( + request.node.name, + ft.Pagelet( + appbar=ft.AppBar(title="Pagelet AppBar"), + content=ft.Text("Pagelet Content"), + width=350, + height=300, + ), + ) -# flet_app.assert_screenshot( -# "pagelet_basic", -# await flet_app.page.take_screenshot( -# pixel_ratio=flet_app.screenshots_pixel_ratio -# ), -# ) + +@pytest.mark.asyncio(loop_scope="module") +async def test_cupertino_adaptive(flet_app: ftt.FletTestApp, request): + flet_app.page.platform = ft.PagePlatform.MACOS + await flet_app.assert_control_screenshot( + request.node.name, + ft.Pagelet( + adaptive=True, + width=350, + height=300, + appbar=ft.AppBar(title="Pagelet AppBar"), + content=ft.Text("Pagelet Content"), + navigation_bar=ft.NavigationBar( + destinations=[ + ft.NavigationBarDestination(icon=ft.Icons.ADD, label="New"), + ft.NavigationBarDestination(icon=ft.Icons.INBOX, label="Inbox"), + ], + ), + ), + ) diff --git a/sdk/python/packages/flet/integration_tests/controls/material/golden/macos/snack_bar/cupertino_page.png b/sdk/python/packages/flet/integration_tests/controls/material/golden/macos/snack_bar/cupertino_page.png new file mode 100644 index 0000000000..6435c56056 Binary files /dev/null and b/sdk/python/packages/flet/integration_tests/controls/material/golden/macos/snack_bar/cupertino_page.png differ diff --git a/sdk/python/packages/flet/integration_tests/controls/material/test_snack_bar.py b/sdk/python/packages/flet/integration_tests/controls/material/test_snack_bar.py index d8e34ea181..d1abb86374 100644 --- a/sdk/python/packages/flet/integration_tests/controls/material/test_snack_bar.py +++ b/sdk/python/packages/flet/integration_tests/controls/material/test_snack_bar.py @@ -59,3 +59,22 @@ async def test_custom_action(flet_app: ftt.FletTestApp, request): pixel_ratio=flet_app.screenshots_pixel_ratio ), ) + + +@pytest.mark.asyncio(loop_scope="module") +async def test_cupertino_page(flet_app: ftt.FletTestApp, request): + flet_app.page.enable_screenshots = True + flet_app.resize_page(500, 300) + flet_app.page.platform = ft.PagePlatform.MACOS + flet_app.page.adaptive = True + flet_app.page.update() + + flet_app.page.show_dialog(ft.SnackBar("Snackbar in cupertino page.")) + await flet_app.tester.pump_and_settle() + + flet_app.assert_screenshot( + request.node.name, + await flet_app.page.take_screenshot( + pixel_ratio=flet_app.screenshots_pixel_ratio + ), + ) diff --git a/sdk/python/packages/flet/integration_tests/examples/core/golden/macos/pagelet/basic.png b/sdk/python/packages/flet/integration_tests/examples/core/golden/macos/pagelet/basic.png new file mode 100644 index 0000000000..5a2bfb9814 Binary files /dev/null and b/sdk/python/packages/flet/integration_tests/examples/core/golden/macos/pagelet/basic.png differ diff --git a/sdk/python/packages/flet/integration_tests/examples/core/golden/macos/pagelet/image_for_docs.png b/sdk/python/packages/flet/integration_tests/examples/core/golden/macos/pagelet/image_for_docs.png new file mode 100644 index 0000000000..51fb142dc3 Binary files /dev/null and b/sdk/python/packages/flet/integration_tests/examples/core/golden/macos/pagelet/image_for_docs.png differ diff --git a/sdk/python/packages/flet/integration_tests/examples/core/test_pagelet.py b/sdk/python/packages/flet/integration_tests/examples/core/test_pagelet.py new file mode 100644 index 0000000000..040c8b5f3c --- /dev/null +++ b/sdk/python/packages/flet/integration_tests/examples/core/test_pagelet.py @@ -0,0 +1,38 @@ +import pytest + +import flet as ft +import flet.testing as ftt +from examples.controls.pagelet import basic + + +@pytest.mark.asyncio(loop_scope="function") +async def test_image_for_docs(flet_app_function: ftt.FletTestApp, request): + flet_app_function.page.theme_mode = ft.ThemeMode.LIGHT + await flet_app_function.assert_control_screenshot( + request.node.name, + ft.Pagelet( + width=350, + height=300, + appbar=ft.AppBar(title="Pagelet AppBar", bgcolor=ft.Colors.BLUE), + content=ft.Text("Pagelet Content"), + navigation_bar=ft.NavigationBar( + destinations=[ + ft.NavigationBarDestination(icon=ft.Icons.ADD, label="New"), + ft.NavigationBarDestination(icon=ft.Icons.INBOX, label="Inbox"), + ], + ), + ), + ) + + +@pytest.mark.parametrize( + "flet_app_function", + [{"flet_app_main": basic.main}], + indirect=True, +) +@pytest.mark.asyncio(loop_scope="function") +async def test_basic(flet_app_function: ftt.FletTestApp): + flet_app_function.assert_screenshot( + "basic", + await flet_app_function.take_page_controls_screenshot(), + ) diff --git a/sdk/python/packages/flet/mkdocs.yml b/sdk/python/packages/flet/mkdocs.yml index ee2f3985c9..f4129fd400 100644 --- a/sdk/python/packages/flet/mkdocs.yml +++ b/sdk/python/packages/flet/mkdocs.yml @@ -430,7 +430,9 @@ nav: - Rive: rive/index.md - SafeArea: controls/safearea.md - SearchBar: controls/searchbar.md - - SegmentedButton: controls/segmentedbutton.md + - SegmentedButton: + - controls/segmentedbutton.md + - Segment: controls/segment.md - SelectionArea: controls/selectionarea.md - Semantics: controls/semantics.md - SemanticsService: controls/semanticsservice.md diff --git a/sdk/python/packages/flet/src/flet/controls/core/responsive_row.py b/sdk/python/packages/flet/src/flet/controls/core/responsive_row.py index 02e30e7227..8cb7c8e46f 100644 --- a/sdk/python/packages/flet/src/flet/controls/core/responsive_row.py +++ b/sdk/python/packages/flet/src/flet/controls/core/responsive_row.py @@ -76,7 +76,14 @@ class ResponsiveRow(LayoutControl, AdaptiveControl): } ) """ - TBD + Defines the minimum widths (in px) for each breakpoint key used by responsive + properties such as [`col`][flet.Control.], [`spacing`][flet.ResponsiveRow.], + and [`run_spacing`][flet.ResponsiveRow.]. + + Keys can be [`ResponsiveRowBreakpoint`][flet.] values or custom strings. + Breakpoint names in responsive values must match the names used here. + + The default mirrors Bootstrap breakpoints. """ def clean(self): diff --git a/sdk/python/packages/flet/src/flet/controls/types.py b/sdk/python/packages/flet/src/flet/controls/types.py index 225767c16e..57d00de325 100644 --- a/sdk/python/packages/flet/src/flet/controls/types.py +++ b/sdk/python/packages/flet/src/flet/controls/types.py @@ -197,15 +197,41 @@ def __post_init__(self): class ResponsiveRowBreakpoint(Enum): """ - Breakpoints for responsive design. + Breakpoint names used by [`ResponsiveRow`][flet.] and responsive + properties such as [`Control.col`][flet.Control.]. + + To define custom breakpoints, see [`ResponsiveRow.breakpoints`][flet.]. """ XS = "xs" + """ + Extra small screens. Default min width: `0` px. + """ + SM = "sm" + """ + Small screens. Default min width: `576` px. + """ + MD = "md" + """ + Medium screens. Default min width: `768` px. + """ + LG = "lg" + """ + Large screens. Default min width: `992` px. + """ + XL = "xl" + """ + Extra-large screens. Default min width: `1200` px. + """ + XXL = "xxl" + """ + Double extra-large screens. Default min width: `1400` px. + """ Number = Union[int, float]