diff --git a/src/Tools/tim_tool/ui/app-window.slint b/src/Tools/tim_tool/ui/app-window.slint index 2a4cfb17..4e65623d 100644 --- a/src/Tools/tim_tool/ui/app-window.slint +++ b/src/Tools/tim_tool/ui/app-window.slint @@ -1,30 +1,41 @@ component VRAMSegment inherits Rectangle { - in property area_overlap_width; - in property area_overlap_height; + in property img; + in property clip_x; + in property clip_y; width: 64px; height: 256px; - background: #37f560; - - Rectangle { - x: 0px; - y: 0px; - width: area_overlap_width > 64 ? 64px : area_overlap_width*1px; - height: area_overlap_height > 256 ? 256px : area_overlap_height*1px; - background: #d7e609; + clip: true; + Image { + source: img; + x: -root.clip_x*1px; + y: -root.clip_y*1px; } } component VRAMArea inherits Rectangle { - in property display_area_width; - in property display_area_height; + in property img; + in property img_x; + in property img_y; - for idx in 16 : VRAMSegment { - x: mod(idx,8)*(64+1)*1px; - y: floor(idx/8)*(256+1)*1px; + width: (64*16+15)*1px; + height: (256*2+1)*1px; - area_overlap_width: parent.display_area_width - (mod(idx,8)*64); - area_overlap_height: parent.display_area_height - (256*floor(idx/8)); + for idx in 32 : VRAMSegment { + x: root.get_x(idx)*(64px + 1px); + y: root.get_y(idx)*(256px + 1px); + + img: img; + clip_x: (root.get_x(idx)*64) - root.img_x; + clip_y: (root.get_y(idx)*256) - root.img_y; + } + + function get_x(idx: int) -> int { + return mod(idx, 16); + } + + function get_y(idx: int) -> int { + return floor(idx/16); } } @@ -33,9 +44,19 @@ export component MainWindow inherits Window { min-height: 640px; VRAMArea { - x: 0; - y: 0; - display_area_width: 32+64+3; - display_area_height: 256+128; + x: 0px; + y: 0px; + img: @image-url("../../../../examples/PoolBox/assets/AllTheJaby.png"); + img_x: 0; + img_y: 0; + background: #0365f796; + } + VRAMArea { + x: 0px; + y: 0px; + img: @image-url("../../../../examples/PoolBox/assets/IMG_6921.png"); + img_x: 80; + img_y: 80; + background: #ff000076; } } \ No newline at end of file