From a797bff7a1770f3f910493576f071b0215ac76c2 Mon Sep 17 00:00:00 2001 From: Jaby Date: Mon, 17 Feb 2025 17:46:59 +0100 Subject: [PATCH] Simple scale concept --- src/Tools/tim_tool/ui/tab/main-tab.slint | 131 +++++++++++--------- src/Tools/tim_tool/ui/vram-components.slint | 21 ++-- 2 files changed, 85 insertions(+), 67 deletions(-) diff --git a/src/Tools/tim_tool/ui/tab/main-tab.slint b/src/Tools/tim_tool/ui/tab/main-tab.slint index 6d7e8c2a..4da26360 100644 --- a/src/Tools/tim_tool/ui/tab/main-tab.slint +++ b/src/Tools/tim_tool/ui/tab/main-tab.slint @@ -1,5 +1,5 @@ import { VRAMArea } from "../vram-components.slint"; -import { Button, ComboBox, GroupBox, StandardListView, LineEdit } from "std-widgets.slint"; +import { Button, ComboBox, GroupBox, StandardListView, LineEdit, ScrollView } from "std-widgets.slint"; struct VRAMImage { img: image, @@ -10,6 +10,7 @@ struct VRAMImage { } export component MainTab inherits Rectangle { + property test_scale: 2; in-out property vram_bg; in-out property <[StandardListViewItem]> vram_files: []; in-out property <[VRAMImage]> vram_images: []; @@ -27,67 +28,79 @@ export component MainTab inherits Rectangle { y: 4px; VerticalLayout { - background_rect := Rectangle { - width: background_image.width + root.get_border_width()*2px; - height: background_image.height + root.get_border_width()*2px; - border-width: root.get_border_width()*1px; - border-color: #404040; - background: #A0A0A0; - background_image := VRAMArea { - x: root.get_border_width()*1px; - y: root.get_border_width()*1px; - img: vram_bg; - img_x: 0; - img_y: 0; - } + ScrollView { + width: rect.width/root.test_scale; + height: rect.height/root.test_scale; + viewport-x: 0; + viewport-y: 0; + viewport-width: rect.width; + viewport-height: rect.height; - for vram_image[i] in root.vram_images: VRAMArea { - x: root.get_border_width()*1px; - y: root.get_border_width()*1px; - img: vram_image.img; - img_x: vram_image.x; - img_y: vram_image.y; - TouchArea { - x: (parent.img_x + self.lines_crossed_x())*1px; - y: (parent.img_y + self.lines_crossed_y())*1px; - width: (parent.img.width + self.lines_crossed_width())*1px; - height: (parent.img.height + self.lines_crossed_height())*1px; - mouse-cursor: grab; - moved => { - self.mouse-cursor = MouseCursor.grabbing; - root.move_vram_image(i, (self.mouse-x - self.pressed-x)/1px, (self.mouse-y - self.pressed-y)/1px); - cur_sel_x.text = parent.img_x; - cur_sel_y.text = parent.img_y; - } - pointer-event(event) => { - if event.kind == PointerEventKind.up { - self.mouse-cursor = MouseCursor.grab; + rect := Rectangle { + width: background_image.width + root.get_border_width()*2px; + height: background_image.height + root.get_border_width()*2px; + border-width: root.get_border_width()*1px; + border-color: #404040; + background: #A0A0A0; + background_image := VRAMArea { + x: root.get_border_width()*1px; + y: root.get_border_width()*1px; + img: vram_bg; + img_x: 0; + img_y: 0; + scale: test_scale; + } + + for vram_image[i] in root.vram_images: VRAMArea { + x: root.get_border_width()*1px; + y: root.get_border_width()*1px; + img: vram_image.img; + img_x: vram_image.x; + img_y: vram_image.y; + scale: test_scale; + + TouchArea { + x: (parent.img_x + self.lines_crossed_x())*1px; + y: (parent.img_y + self.lines_crossed_y())*1px; + width: (parent.img.width + self.lines_crossed_width())*1px; + height: (parent.img.height + self.lines_crossed_height())*1px; + mouse-cursor: grab; + moved => { + self.mouse-cursor = MouseCursor.grabbing; + root.move_vram_image(i, (self.mouse-x - self.pressed-x)/1px, (self.mouse-y - self.pressed-y)/1px); + cur_sel_x.text = parent.img_x; + cur_sel_y.text = parent.img_y; } - - if event.kind == PointerEventKind.down { - cur_sel_x.text = parent.img_x; - cur_sel_y.text = parent.img_y; - cur_sel_img.source = parent.img; - cur_sel_img.visible = true; - vram_files_list.current-item = i; + pointer-event(event) => { + if event.kind == PointerEventKind.up { + self.mouse-cursor = MouseCursor.grab; + } + + if event.kind == PointerEventKind.down { + cur_sel_x.text = parent.img_x; + cur_sel_y.text = parent.img_y; + cur_sel_img.source = parent.img; + cur_sel_img.visible = true; + vram_files_list.current-item = i; + } + } + + // Thanks to Cody the white tiger + function lines_crossed_x() -> int { + return parent.img_x/64; + } + + function lines_crossed_y() -> int { + return parent.img_y/256; + } + + function lines_crossed_width() -> int { + return ((parent.img_x + parent.img.width)/64) - self.lines_crossed_x(); + } + + function lines_crossed_height() -> int { + return ((parent.img_y + parent.img.height)/256) - self.lines_crossed_y(); } - } - - // Thanks to Cody the white tiger - function lines_crossed_x() -> int { - return parent.img_x/64; - } - - function lines_crossed_y() -> int { - return parent.img_y/256; - } - - function lines_crossed_width() -> int { - return ((parent.img_x + parent.img.width)/64) - self.lines_crossed_x(); - } - - function lines_crossed_height() -> int { - return ((parent.img_y + parent.img.height)/256) - self.lines_crossed_y(); } } } diff --git a/src/Tools/tim_tool/ui/vram-components.slint b/src/Tools/tim_tool/ui/vram-components.slint index b7b869df..b39e35f9 100644 --- a/src/Tools/tim_tool/ui/vram-components.slint +++ b/src/Tools/tim_tool/ui/vram-components.slint @@ -3,14 +3,17 @@ component VRAMSegment inherits Rectangle { in property img; in property clip_x; in property clip_y; + in property scale: 1; - width: 64px; - height: 256px; + width: 64px*scale; + height: 256px*scale; clip: true; Image { source: img; - x: -root.clip_x*1px; - y: -root.clip_y*1px; + x: -root.clip_x*1px*scale; + y: -root.clip_y*1px*scale; + width: img.width*1px*scale; + height: img.height*1px*scale; } } @@ -18,17 +21,19 @@ export component VRAMArea inherits Rectangle { in property img; in property img_x; in property img_y; + in property scale: 1; - width: (64*16+15)*1px; - height: (256*2+1)*1px; + width: ((64*16+15)*1px)*scale; + height: ((256*2+1)*1px)*scale; for idx in 32 : VRAMSegment { - x: root.get_x(idx)*(64px + 1px); - y: root.get_y(idx)*(256px + 1px); + x: (root.get_x(idx)*(64px + 1px))*scale; + y: (root.get_y(idx)*(256px + 1px))*scale; img: img; clip_x: (root.get_x(idx)*64) - root.img_x; clip_y: (root.get_y(idx)*256) - root.img_y; + scale: root.scale; } function get_x(idx: int) -> int {