admin管理员组文章数量:1321416
I'm trying to develop an app with multiple views. Each view should have a proper theme and theme mode. To solve this problem, I decided to deal with an easier one. I would like to set a page theme and theme mode, and add a container with a different theme mode or a different theme too. I found something similar into Flet references. So, I set the page theme mode to 'LIGHT', the page theme to 'BLUE' and the page dark theme to 'GREEN'. I added a button and a textfield on top of the page to evaluate the rendering. Finally, I added a container with a button and a textfield, setting its theme mode to 'DARK'. Optionally, I would like to set also a different theme to the container. Here is the code:
import flet as ft
def main(page: ft.Page):
page.controls.append(ft.ElevatedButton("Click me!"))
page.controls.append(ft.TextField(hint_text="Enter text"))
page.controls.append(
ft.Container(
content=ft.Column(
[
ft.ElevatedButton("Click me!"),
ft.TextField(hint_text="Enter text"),
]
),
theme_mode=ft.ThemeMode.DARK,
#theme=ft.Theme(color_scheme_seed=ft.colors.RED),
padding=40,
border_radius=10,
border=ft.border.all(3, "red"),
)
)
page.theme_mode = ft.ThemeMode.LIGHT
page.theme=ft.Theme(color_scheme_seed=ft.colors.BLUE)
page.dark_theme=ft.Theme(color_scheme_seed=ft.colors.GREEN)
page.window_height = 700
page.window_width = 500
page.padding=0
page.scroll="auto"
page.window_left = 700
page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
page.vertical_alignment = ft.MainAxisAlignment.CENTER
page.update()
ft.app(target=main)
And this is the output:
As you can see, nothing change into the container. How can I set a different theme mode and a different theme for both the container and its children?
I'm trying to develop an app with multiple views. Each view should have a proper theme and theme mode. To solve this problem, I decided to deal with an easier one. I would like to set a page theme and theme mode, and add a container with a different theme mode or a different theme too. I found something similar into Flet references. So, I set the page theme mode to 'LIGHT', the page theme to 'BLUE' and the page dark theme to 'GREEN'. I added a button and a textfield on top of the page to evaluate the rendering. Finally, I added a container with a button and a textfield, setting its theme mode to 'DARK'. Optionally, I would like to set also a different theme to the container. Here is the code:
import flet as ft
def main(page: ft.Page):
page.controls.append(ft.ElevatedButton("Click me!"))
page.controls.append(ft.TextField(hint_text="Enter text"))
page.controls.append(
ft.Container(
content=ft.Column(
[
ft.ElevatedButton("Click me!"),
ft.TextField(hint_text="Enter text"),
]
),
theme_mode=ft.ThemeMode.DARK,
#theme=ft.Theme(color_scheme_seed=ft.colors.RED),
padding=40,
border_radius=10,
border=ft.border.all(3, "red"),
)
)
page.theme_mode = ft.ThemeMode.LIGHT
page.theme=ft.Theme(color_scheme_seed=ft.colors.BLUE)
page.dark_theme=ft.Theme(color_scheme_seed=ft.colors.GREEN)
page.window_height = 700
page.window_width = 500
page.padding=0
page.scroll="auto"
page.window_left = 700
page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
page.vertical_alignment = ft.MainAxisAlignment.CENTER
page.update()
ft.app(target=main)
And this is the output:
As you can see, nothing change into the container. How can I set a different theme mode and a different theme for both the container and its children?
Share Improve this question asked Jan 22 at 15:58 eljambaeljamba 3852 gold badges3 silver badges16 bronze badges1 Answer
Reset to default 1When running your code with the latest Flet version (0.26.0), I get the following instead:
When I add bgcolor=ft.colors.SURFACE_CONTAINER_HIGHEST
to the inner-Container I get:
If I additionally uncomment the theme you had theme=ft.Theme(color_scheme_seed=ft.colors.RED)
, I get:
Hope it helps!
本文标签: flutterHow to change theme mode of a container and its children in Python FletStack Overflow
版权声明:本文标题:flutter - How to change theme mode of a container and its children in Python Flet - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742035063a2417192.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论