fixed page/window resizing bug.(flet ui)

This commit is contained in:
aedhcarrick 2022-12-28 12:24:51 -06:00
parent 8c0079485f
commit 4f6dbd7ecd
7 changed files with 154 additions and 14 deletions

View File

@ -22,6 +22,23 @@ class AssetManager(ft.Container):
self.dragbar.content.width = self.page.vertical_divider_width
self.dragbar.content.color = self.page.tertiary_color
def on_page_change(self):
self.width = self.page.left_panel_width
self.bgcolor = self.page.primary_color
self.padding = self.page.container_padding
self.margin = self.page.container_margin
self.set_tab_text_size(self.page.text_size)
self.set_tab_bgcolor(self.page.secondary_color)
self.set_tab_padding(self.page.container_padding)
self.set_tab_margin(self.page.container_margin)
self.dragbar.content.width = self.page.vertical_divider_width
self.dragbar.content.color = self.page.tertiary_color
if self.page.active_layer is not None:
self.page.active_layer.handle.color = self.page.tertiary_color
def add_image_as_layer(self, image):
return self.layer_panel.add_image_as_layer(image)

View File

@ -13,9 +13,9 @@ class Canvas(ft.Container):
self.padding = self.page.container_padding
self.margin = self.page.container_margin
self.overlay.tools.center = self.page.icon_size
self.overlay.tools.zoom_in = self.page.icon_size
self.overlay.tools.zoom_out = self.page.icon_size
self.overlay.tools.center.icon_size = self.page.icon_size
self.overlay.tools.zoom_in.icon_size = self.page.icon_size
self.overlay.tools.zoom_out.icon_size = self.page.icon_size
self.overlay.size_display.content.color = self.page.text_color
self.overlay.size_display.content.size = self.page.text_size
@ -23,8 +23,22 @@ class Canvas(ft.Container):
self.center_canvas()
self.refresh_canvas()
def on_page_change(self):
self.bgcolor = self.page.secondary_color
self.padding = self.page.container_padding
self.margin = self.page.container_margin
self.overlay.tools.center.icon_size = self.page.icon_size
self.overlay.tools.zoom_in.icon_size = self.page.icon_size
self.overlay.tools.zoom_out.icon_size = self.page.icon_size
self.overlay.size_display.content.color = self.page.text_color
self.overlay.size_display.content.size = self.page.text_size
self.refresh_canvas()
def refresh_canvas(self):
self.image_stack.refresh_stack()
self.align_canvas()
self.overlay.refresh_canvas_overlay()
def set_current_tool(self, tool):

View File

@ -7,7 +7,6 @@ import flet as ft
from scripts import flet_utils
class Messages(ft.Container):
def setup(self):
self.height = self.page.bottom_panel_height
@ -23,6 +22,21 @@ class Messages(ft.Container):
self.dragbar.content.height = self.page.divider_height
self.dragbar.content.color = self.page.tertiary_color
def on_page_change(self):
self.height = self.page.bottom_panel_height
self.bgcolor = self.page.primary_color
self.padding = self.page.container_padding
self.margin = self.page.container_margin
self.set_tab_text_size(self.page.text_size)
self.set_tab_bgcolor(self.page.secondary_color)
self.set_tab_padding(self.page.container_padding)
self.set_tab_margin(self.page.container_margin)
self.dragbar.content.height = self.page.divider_height
self.dragbar.content.color = self.page.tertiary_color
def set_tab_text_size(self, size):
for tab in self.tabs:
tab.tab_content.size = size
@ -63,6 +77,7 @@ class Messages(ft.Container):
message_list.controls.append(msg)
self.prune_messages()
message_list = ft.ListView(
spacing = 4,
auto_scroll = True,

View File

@ -30,6 +30,25 @@ class PropertyManager(ft.Container):
self.page.refresh_canvas_preview()
self.refresh_canvas_properties()
def on_page_change(self):
self.width = self.page.right_panel_width
self.bgcolor = self.page.primary_color
self.padding = self.page.container_padding
self.margin = self.page.container_margin
self.set_tab_text_size(self.page.text_size)
self.set_tab_bgcolor(self.page.secondary_color)
self.set_tab_padding(self.page.container_padding)
self.set_tab_margin(self.page.container_margin)
self.dragbar.content.width = self.page.vertical_divider_width
self.dragbar.content.color = self.page.tertiary_color
self.property_panel.preview.width = self.page.right_panel_width
self.property_panel.preview_dragbar.content.content.height = self.page.divider_height
self.property_panel.preview_dragbar.content.content.color = self.page.tertiary_color
self.property_panel.canvas_properties_divider.content.height = self.page.divider_height
self.property_panel.canvas_properties_divider.content.color = self.page.tertiary_color
self.property_panel.layer_properties_divider.content.height = self.page.divider_height
self.property_panel.layer_properties_divider.content.color = self.page.tertiary_color
def set_tab_text_size(self, size):
for tab in self.tabs:
tab.tab_content.size = size

View File

@ -29,6 +29,26 @@ class TitleBar(ft.Container):
self.settings_button.icon_size = self.page.titlebar_height * 0.5
self.settings_button.on_click = self.page.open_settings
def on_page_change(self):
self.width = self.page.width
self.height = self.page.titlebar_height
self.title.size = self.page.titlebar_height * 0.5
self.title.color = self.page.tertiary_color
self.prompt.text_size = max(12, self.page.titlebar_height * 0.25)
self.prompt.focused_border_color = self.page.tertiary_color
self.layout_menu.controls[0].text_size = self.page.text_size
self.theme_switcher.size = self.page.titlebar_height
self.theme_switcher.icon_size = self.page.titlebar_height * 0.5
self.theme_switcher.tooltip = f"Click to change between the light and dark themes. Current {'(Light theme)' if self.page.theme_mode == 'light' else '(Dark theme)'}"
self.settings_button.size = self.page.titlebar_height
self.settings_button.icon_size = self.page.titlebar_height * 0.5
title = ft.Text(
value = " Sygil ",
text_align = 'center',
@ -92,6 +112,8 @@ option_list = ft.Row(
alignment = 'end'
)
# TitleBar == ft.Container
titlebar = TitleBar(
content = ft.Row(
controls = [

View File

@ -73,6 +73,27 @@ class ToolManager(ft.Container):
self.dragbar.width = self.page.vertical_divider_width
self.dragbar.color = self.page.tertiary_color
def on_page_change(self):
self.width = self.page.tool_manager_width
self.bgcolor = self.page.primary_color
self.padding = self.page.container_padding
self.margin = self.page.container_margin
self.toolbox.bgcolor = self.page.secondary_color
self.toolbox.padding = self.page.container_padding
self.toolbox.margin = self.page.container_margin
self.tool_divider.height = self.page.divider_height
self.tool_divider.color = self.page.tertiary_color
self.tool_properties.bgcolor = self.page.secondary_color
self.tool_properties.padding = self.page.container_padding
self.tool_properties.margin = self.page.container_margin
self.dragbar.width = self.page.vertical_divider_width
self.dragbar.color = self.page.tertiary_color
def resize_tool_manager(self, e: ft.DragUpdateEvent):
self.page.tool_manager_width = max(50, self.page.tool_manager_width + e.delta_x)
tool_manager.width = self.page.tool_manager_width
@ -86,12 +107,20 @@ class ToolManager(ft.Container):
def enable_tools(self):
for tool in self.toolbox.content.controls:
try:
if tool.on_click == tool_select:
tool.disabled = False
except AttributeError:
continue # is divider
self.update()
def disable_tools(self):
for tool in self.toolbox.content.controls:
try:
if tool.on_click == tool_select:
tool.disabled = True
except AttributeError:
continue # is divider
self.update()
def clear_tools(self):

View File

@ -87,13 +87,6 @@ def main(page: ft.Page):
page.change_theme_mode = change_theme_mode
# layouts
def set_layout(e):
page.current_layout = e.control.value
page.update()
page.set_layout = set_layout
# tools
page.tool_manager = tool_manager
@ -119,6 +112,7 @@ def main(page: ft.Page):
page.set_current_tool = set_current_tool
# asset manager
page.asset_manager = asset_manager
page.active_layer = None
@ -199,6 +193,36 @@ def main(page: ft.Page):
page.refresh_layers = refresh_layers
# layouts
def set_layout(e):
page.current_layout = e.control.value
page.update()
page.set_layout = set_layout
def on_page_change(e):
page.titlebar.on_page_change()
page.tool_manager.on_page_change()
page.asset_manager.on_page_change()
page.canvas.on_page_change()
page.messages.on_page_change()
page.property_manager.on_page_change()
full_page.width = page.width
full_page.height = page.height
page.update()
page.on_resize = on_page_change
def on_window_change(e):
if e.data == 'minimize' or e.data == 'close':
return
else:
page.on_page_change(e)
page.on_window_event = on_window_change
# settings
def load_settings():
settings = flet_utils.get_user_settings_from_config()
@ -419,4 +443,4 @@ def main(page: ft.Page):
page.update()
ft.app(target=main, route_url_strategy="path", port= 8505, assets_dir="assets", upload_dir="assets/uploads")
ft.app(target=main, route_url_strategy="path", port=8505, assets_dir="assets", upload_dir="assets/uploads")