more work on canvas(flet ui)

webui/flet/scripts/flet_canvas.py

@@ -18,6 +18,8 @@ class Canvas(ft.Container):
 
 		self.overlay.canvas_size.content.color = self.page.text_color
 		self.overlay.canvas_size.content.size = self.page.text_size
+		self.add_layer_image(self.page.canvas_background)
+		self.center_canvas()
 		self.refresh_canvas()
 
 	def refresh_canvas(self):
@@ -26,9 +28,14 @@ class Canvas(ft.Container):
 	def set_current_tool(self,tool):
 		self.page.current_tool = tool
 
+	def add_layer_image(self, image):
+		self.image_stack.add_layer_image(image)
+		self.update()
+
 	def center_canvas(self):
-		self.image_stack.left = (self.page.workspace_width * 0.5) - (self.page.canvas_size[0] * 0.5),
-		self.image_stack.top = (self.page.workspace_height * 0.5) - (self.page.canvas_size[1] * 0.5),
+		width, height = self.page.get_viewport_size()
+		self.image_stack.left = (width * 0.5) - 2048
+		self.image_stack.top = (height * 0.5) - 2048
 		canvas.update()
 
 	def pan_canvas(self):
@@ -47,34 +54,54 @@ class CanvasOverlay(ft.Stack):
 		self.update()
 
 class ImageStack(ft.GestureDetector):
-	def add_layer_image(self):
-		pass
+	def add_layer_image(self, image):
+		layer_image = LayerImage(
+				mouse_cursor = ft.MouseCursor.GRAB,
+				drag_interval = 50,
+				on_pan_update = self.drag_layer,
+				left = 0,
+				top = 0,
+				width = image.width,
+				height = image.height,
+				content = ft.Image(
+						src_base64 = flet_utils.convert_image_to_base64(image),
+						width = image.width,
+						height = image.height,
+						gapless_playback = True,
+				),
+		)
+		self.content.controls.append(layer_image)
 
-
-class LayerImage(ft.GestureDetector):
-	def center_layer(self):
-		self.left = (self.page.workspace_width * 0.5) - (self.page.canvas_size[0] * 0.5),
-		self.top = (self.page.workspace_height * 0.5) - (self.page.canvas_size[1] * 0.5),
+	def center_layer(self, e):
+		width, height = self.page.get_viewport_size()
+		self.left = (width * 0.5) - (self.width * 0.5),
+		self.top = (height * 0.5) - (self.height * 0.5),
 		canvas.update()
 
-	def drag_layer(self):
+	def drag_layer(self, e):
 		pass
 
-	def resize_layer(self):
+	def resize_layer(self, e):
 		pass
 
-	def draw_on_layer(self):
+	def draw_on_layer(self, e):
 		pass
 
-	def paint_on_layer(self):
+	def paint_on_layer(self, e):
 		pass
 
+class LayerImage(ft.GestureDetector):
+	pass
+
+def pan_canvas(e):
+	canvas.pan_canvas(e)
 
 image_stack = ImageStack(
-		mouse_cursor = ft.MouseCursor.GRAB,
+#		mouse_cursor = ft.MouseCursor.GRAB,
 		drag_interval = 50,
-		on_pan_update = None,
-		on_scroll = None,
+		on_pan_update = pan_canvas,
+		width = 4096,
+		height = 4096,
 		left = 0,
 		top = 0,
 		content = ft.Stack(),
@@ -115,6 +142,11 @@ canvas_tools = ft.Container(
 		),
 		top = 4,
 		right = 4,
+		padding = 4,
+		border_radius = 10,
+		opacity = 0.5,
+		bgcolor = 'black',
+
 )
 
 canvas_tools.zoom_in = zoom_in_button
@@ -135,7 +167,6 @@ canvas = Canvas(
 					image_stack,
 					canvas_overlay,
 				],
-				clip_behavior = None,
 		),
 		clip_behavior = 'antiAlias',
 		alignment = ft.alignment.center,

webui/flet/scripts/flet_messages.py

@@ -63,9 +63,8 @@ class Messages(ft.Container):
 		message_list.controls.append(msg)
 		self.prune_messages()
 
-message_list = ft.Column(
-		spacing = 0,
-		scroll = 'auto',
+message_list = ft.ListView(
+		spacing = 4,
 		auto_scroll = True,
 		controls = [],
 )

webui/flet/scripts/flet_tool_manager.py

@@ -68,8 +68,8 @@ class ToolManager(ft.Container):
 		self.tool_properties.padding = self.page.container_padding
 		self.tool_properties.margin = self.page.container_margin
 
-		self.dragbar.content.width = self.page.vertical_divider_width
-		self.dragbar.content.color = self.page.tertiary_color
+		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)
@@ -176,7 +176,6 @@ tool_manager = ToolManager(
 								tool_properties,
 							],
 							alignment = 'start',
-							horizontal_alignment = 'center',
 							expand = True,
 					),
 					tool_manager_dragbar,
@@ -189,5 +188,5 @@ tool_manager = ToolManager(
 tool_manager.toolbox = toolbox
 tool_manager.tool_divider = tool_divider.content.content
 tool_manager.tool_properties = tool_properties
-tool_manager.dragbar = tool_manager_dragbar
+tool_manager.dragbar = tool_manager_dragbar.content
 

webui/flet/scripts/flet_utils.py

@@ -91,7 +91,7 @@ def get_image_from_uploads(name):
 
 def get_canvas_background(path):
 	image = Image.open(path)
-	image = image.resize((512,512))
+	image = image.resize((4096,4096))
 	image = image.convert("RGBA")
 	return image
 

webui/flet/webui_flet.py

@@ -80,7 +80,6 @@ def main(page: ft.Page):
 	# layouts
 	def set_layout(e):
 		page.current_layout = e.control.value
-		set_property_panel_options()
 		page.update()
 
 	page.set_layout = set_layout
@@ -91,19 +90,16 @@ def main(page: ft.Page):
 
 	# asset manager
 	page.asset_manager = asset_manager
-	page.layer_list = []
-	page.visible_layer_list = []
-	page.active_layer_list = []
 
 	# canvas
 	page.canvas = canvas
 	page.canvas_background = flet_utils.get_canvas_background('webui/flet/assets/images/templategrid_albedo.png')
-	page.canvas_size = (512,512)
+	page.canvas_size = [512,512]
 
 	def get_viewport_size():
 		viewport_width = page.width - (page.tool_manager_width + (page.vertical_divider_width * 3) + page.left_panel_width + page.right_panel_width)
-		viewport_height = page.height - (page.appbar_height * 3) - page.bottom_panel_height
-		return (viewport_width, viewport_height)
+		viewport_height = page.height - (page.titlebar_height * 3) - page.bottom_panel_height
+		return viewport_width, viewport_height
 
 	page.get_viewport_size = get_viewport_size
 
@@ -288,25 +284,6 @@ def main(page: ft.Page):
 
 #	layouts ############################################################
 
-	def set_current_tools():
-		layout = page.current_layout
-		if layout == 'Default':
-			set_tools(default_tools)
-		elif layout == 'Textual Inversion':
-			set_tools(textual_inversion_tools)
-		elif layout == 'Node Editor':
-			set_tools(node_editor_tools)
-		tool_manager.update()
-
-	def set_property_panel_options():
-		layout = page.current_layout
-		if layout == 'Default':
-			set_properties(default_properties)
-		elif layout == 'Textual Inversion':
-			set_properties(textual_inversion_properties)
-		elif layout == 'Node Editor':
-			set_properties(node_editor_properties)
-
 	default_layout = ft.Row(
 			controls = [
 				tool_manager,