diff --git a/src/Tools/tim_tool/src/gui/file_tab.rs b/src/Tools/tim_tool/src/gui/file_tab.rs index 02b1c9c3..4bf68e6f 100644 --- a/src/Tools/tim_tool/src/gui/file_tab.rs +++ b/src/Tools/tim_tool/src/gui/file_tab.rs @@ -21,7 +21,9 @@ impl FileTab { main_window.set_file_tab_enable(false); } - pub fn update_new_load(&self, file_name: Option, image: Image) { + pub fn update_new_loaded_file(&self, file_name: Option, image: Image, palette: Option) { + self.update_palette(palette); + let main_window = self.main_window.borrow(); main_window.set_file_tab_image_data(image); @@ -35,6 +37,25 @@ impl FileTab { main_window.set_file_tab_enable(true); } + pub fn update_palette(&self, palette: Option) { + let main_window = self.main_window.borrow(); + + if let Some(palette) = palette { + let size = palette.size(); + + main_window.set_file_tab_palette_data(palette); + main_window.set_file_tab_palette_width(size.width as i32); + main_window.set_file_tab_palette_height(size.height as i32); + main_window.set_file_tab_palette_visible(true); + } + + else { + main_window.set_file_tab_palette_width(0); + main_window.set_file_tab_palette_height(0); + main_window.set_file_tab_palette_visible(false); + } + } + pub fn get_file_name(&self) -> String { self.main_window.borrow().get_file_tab_image_name().to_string() } @@ -50,6 +71,17 @@ impl FileTab { }); } + pub fn on_update_palette_size(&self, gui_elements: GUIElementsRef, mut function: impl FnMut(&mut GUIElements, &MainWindow, u32, u32) -> Result<(), Error> + 'static) { + let main_window_cloned = self.main_window.clone(); + let gui_cloned = gui_elements.clone(); + + self.main_window.borrow().on_file_tab_update_palette_size(move |width, height| { + if let Err(error) = function(&mut gui_cloned.borrow_mut(), &main_window_cloned.borrow(), width as u32, height as u32) { + display_error("Loadind file failed", &error.to_string()); + } + }); + } + pub fn on_add_image(&self, gui_elements: GUIElementsRef, mut function: impl FnMut(&mut GUIElements, &MainWindow) -> Result<(), Error> + 'static) { let main_window_cloned = self.main_window.clone(); let gui_cloned = gui_elements.clone(); diff --git a/src/Tools/tim_tool/src/gui/main_tab.rs b/src/Tools/tim_tool/src/gui/main_tab.rs index 3647dfe3..84db3017 100644 --- a/src/Tools/tim_tool/src/gui/main_tab.rs +++ b/src/Tools/tim_tool/src/gui/main_tab.rs @@ -4,11 +4,14 @@ use super::{GUIElementsRef, MainWindowRef}; use slint::Model; use std::{rc::Rc, sync::{Arc, Mutex}}; +struct VRAM { + pub file_list: Rc>, + pub image_list: Rc> +} + pub struct MainTab { main_window: MainWindowRef, - mtx: Arc>, - vram_file_list: Rc>, - vram_image_list: Rc>, + vram: Arc>, } impl MainTab { @@ -20,43 +23,63 @@ impl MainTab { main_window.borrow().set_main_tab_vram_file_list(vram_file_list.clone().into()); main_window.borrow().set_main_tab_vram_images(vram_image_list.clone().into()); - MainTab{main_window, mtx: Arc::new(Mutex::new(0)), vram_file_list, vram_image_list} + MainTab{main_window, vram: Arc::new(Mutex::new(VRAM{file_list: vram_file_list, image_list: vram_image_list}))} } pub fn add_new_vram_file(&mut self, file_name: &String, image: slint::Image, image_palette: Option) { - let add_new_image = |file_name: &String, image: slint::Image| { + let vram_data = self.vram.lock().expect("VRAM already locked"); + let add_new_image = |file_name: &String, image: slint::Image, palette_count: i32, is_palette: bool| { let vram_image = VRAMImage{ img: image, x: 0, y: 0, - palette_count: 0, - is_palette: false, + palette_count, + is_palette, }; - self.vram_file_list.push(slint::StandardListViewItem::from(file_name.as_str())); - self.vram_image_list.push(vram_image); + vram_data.file_list.push(slint::StandardListViewItem::from(file_name.as_str())); + vram_data.image_list.push(vram_image); }; - let _lock = self.mtx.lock().unwrap(); - add_new_image(file_name, image); + add_new_image(file_name, image, if image_palette.is_some() {1} else {0}, false); + if let Some(image_palette) = image_palette { + let file_name = " => ".to_owned() + file_name.as_str() + " (Palette)"; + add_new_image(&file_name, image_palette, 0, true); + } } pub fn remove_vram_file(&mut self, idx: usize) -> bool { - let _lock = self.mtx.lock().unwrap(); - - if let Some(element) = self.vram_image_list.iter().skip(idx).next() { - if element.is_palette { - return false; - } - } + let vram_data = self.vram.lock().expect("VRAM already locked"); + let remove_image = |idx: usize| { + vram_data.file_list.remove(idx); + vram_data.image_list.remove(idx); + }; - self.vram_file_list.remove(idx); - self.vram_image_list.remove(idx); + let extras = { + if let Some(element) = vram_data.image_list.iter().skip(idx).next() { + if element.is_palette { + return false; + } + + else { + element.palette_count as usize + } + } + + else { + 0 + } + }; + + for _ in idx..=idx+extras { + remove_image(idx); + } return true; } pub fn move_vram_image(&mut self, idx: usize, dx: i32, dy: i32) { - if let Some(mut vram_info) = self.vram_image_list.row_data(idx) { + let vram_data = self.vram.lock().expect("VRAM already locked"); + if let Some(mut vram_info) = vram_data.image_list.row_data(idx) { vram_info.x += dx; vram_info.y += dy; @@ -77,7 +100,7 @@ impl MainTab { vram_info.y = VRAM_HEIGHT as i32 - vram_img_height; } - self.vram_image_list.set_row_data(idx, vram_info); + vram_data.image_list.set_row_data(idx, vram_info); } } diff --git a/src/Tools/tim_tool/src/logic/mod.rs b/src/Tools/tim_tool/src/logic/mod.rs index c938513f..fd5fc7b3 100644 --- a/src/Tools/tim_tool/src/logic/mod.rs +++ b/src/Tools/tim_tool/src/logic/mod.rs @@ -34,4 +34,14 @@ impl Logic { Err(Error::from_str("No data found for loaded image")) } } + + pub fn change_unadded_tim_palette_size(&mut self, width: u32, height: u32) -> Result, Error> { + if let Some(unadded_tim) = &mut self.unadded_tim { + unadded_tim.change_palette_size(width, height) + } + + else { + Ok(None) + } + } } \ No newline at end of file diff --git a/src/Tools/tim_tool/src/logic/tim.rs b/src/Tools/tim_tool/src/logic/tim.rs index 025eed4e..15a1f6b0 100644 --- a/src/Tools/tim_tool/src/logic/tim.rs +++ b/src/Tools/tim_tool/src/logic/tim.rs @@ -4,7 +4,7 @@ use tool_helper::Error; pub struct TIMInfo { image_data: SharedPixelBuffer, - palette: Option>, + palette: Option, } impl TIMInfo { @@ -48,7 +48,7 @@ impl TIMInfo { _ => {return Err(Error::from_str("Only 4 and 8bit color depth are supported for indexed color images"));} } } - Ok(TIMInfo{image_data, palette: Some(palette_colors)}) + Ok(TIMInfo{image_data, palette: Some(PaletteInfo::new(palette_colors))}) } else { @@ -70,7 +70,51 @@ impl TIMInfo { } } + pub fn change_palette_size(&mut self, width: u32, height: u32) -> Result, Error> { + if let Some(palette) = &mut self.palette { + if width == 0 || height == 0 { + return Err(Error::from_text(format!("{}px x {}px is not a valid size for palette", width, height))); + } + + palette.width = width; + palette.height = height; + Ok(Some(palette.get_image())) + } + + else { + Ok(None) + } + } + pub fn get_slint_images(&self) -> (slint::Image, Option) { - (slint::Image::from_rgba8_premultiplied(self.image_data.clone()), None) + (slint::Image::from_rgba8_premultiplied(self.image_data.clone()), if let Some(palette) = &self.palette { + Some(palette.get_image()) + } else { + None + }) + } +} + +struct PaletteInfo { + data: Vec, + width: u32, + height: u32, +} + +impl PaletteInfo { + pub fn new(data: Vec) -> PaletteInfo { + let width = if data.len() <= 16 {16} else {256}; + PaletteInfo{data, width, height: 1} + } + + pub fn get_image(&self) -> slint::Image { + let mut image_data = SharedPixelBuffer::new(self.width, self.height); + let dst_pixels = image_data.make_mut_slice(); + + for (idx, byte) in dst_pixels.iter_mut().enumerate() { + *byte = if idx < self.data.len() {self.data[idx]} else {Rgba8Pixel::new(0, 0, 0, 0xFF)}; + } + + slint::Image::from_rgba8_premultiplied(image_data.clone()) } } \ No newline at end of file diff --git a/src/Tools/tim_tool/src/main.rs b/src/Tools/tim_tool/src/main.rs index 3506d5a5..d351734e 100644 --- a/src/Tools/tim_tool/src/main.rs +++ b/src/Tools/tim_tool/src/main.rs @@ -43,6 +43,14 @@ fn setup_main_tab(gui_elements_ref: Rc>) { fn setup_file_tab(gui_elements_ref: Rc>, logic_ref: Rc>) { let gui_elements = gui_elements_ref.borrow(); + let logic = logic_ref.clone(); + gui_elements.file_tab.on_update_palette_size(gui_elements_ref.clone(), move |gui_elements, _main_window, width, height| -> Result<(), Error> { + let file_tab = &gui_elements.file_tab; + + file_tab.update_palette(logic.borrow_mut().change_unadded_tim_palette_size(width, height)?); + Ok(()) + }); + let logic = logic_ref.clone(); gui_elements.file_tab.on_browse_file(gui_elements_ref.clone(), move |gui_elements, main_window| -> Result<(), Error> { let file = FileDialog::new() @@ -58,13 +66,13 @@ fn setup_file_tab(gui_elements_ref: Rc>, logic_ref: Rc VRAM_WIDTH as u32 || img_size.height > VRAM_HEIGHT as u32 { return Err(Error::from_text(format!("Image size ({}; {}) is to big for VRAM ({}, {})", img_size.width, img_size.height, VRAM_WIDTH, VRAM_HEIGHT))); } - file_tab.update_new_load(file_name, image); + file_tab.update_new_loaded_file(file_name, image, palette); } Ok(()) diff --git a/src/Tools/tim_tool/ui/app-window.slint b/src/Tools/tim_tool/ui/app-window.slint index a556f9dc..4e00ab32 100644 --- a/src/Tools/tim_tool/ui/app-window.slint +++ b/src/Tools/tim_tool/ui/app-window.slint @@ -13,12 +13,17 @@ export component MainWindow inherits Window { callback move_vram_image <=> main_tab.move_vram_image; // Convert Image values - in-out property file_tab_browse_path <=> file_tab.conv_image_path; - in-out property file_tab_image_data <=> file_tab.conv_image_data; - in-out property file_tab_image_name <=> file_tab.conv_image_name; - in-out property file_tab_enable <=> file_tab.conv_image_enable; - callback file_tab_browse_convert_image <=> file_tab.conv_image_browse_clicked; - callback file_tab_add_convert_image <=> file_tab.conv_image_add_clicked; + in-out property file_tab-browse_path <=> file_tab.conv-image_path; + in-out property file_tab-image_data <=> file_tab.conv-image_data; + in-out property file_tab-palette_data <=> file_tab.conv-palette_data; + in-out property file_tab-palette_width <=> file_tab.conv-palette_width; + in-out property file_tab-palette_height <=> file_tab.conv-palette_height; + in-out property file_tab-palette_visible <=> file_tab.conv-palette_enable; + in-out property file_tab-image_name <=> file_tab.conv-image_name; + in-out property file_tab-enable <=> file_tab.conv-enable_view; + callback file_tab-update_palette_size <=> file_tab.conv-image_update_palette_size; + callback file_tab-browse_convert_image <=> file_tab.conv-image_browse_clicked; + callback file_tab-add_convert_image <=> file_tab.conv-image_add_clicked; title: "TIM Tool 0.1.0"; width: tab_widget.width; diff --git a/src/Tools/tim_tool/ui/tab/file-tab.slint b/src/Tools/tim_tool/ui/tab/file-tab.slint index 58a39df2..958b7070 100644 --- a/src/Tools/tim_tool/ui/tab/file-tab.slint +++ b/src/Tools/tim_tool/ui/tab/file-tab.slint @@ -13,12 +13,17 @@ component ProjectWidget inherits Rectangle { component ConvertImageWidget inherits Rectangle { in-out property image_path; - in-out property image_data; in-out property image_name; - in-out property enable_button: false; + in-out property image_data; + in-out property palette_data; + in-out property palette_width: 0; + in-out property palette_height: 0; + in-out property enable_view: false; + in-out property palette_visible: false; callback browse_clicked(); callback add_clicked(); + callback update_palette_size(int, int); background: #D0D0D0; @@ -48,21 +53,85 @@ component ConvertImageWidget inherits Rectangle { } GroupBox { - title: "Loaded image"; + title: "Loaded image and palette"; VerticalLayout { alignment: start; padding: 4px; HorizontalLayout { alignment: center; Rectangle { - width: 256px; - height: 256px; - background: #000000; + width: 256px + 2*4px; // < Because of border + height: 256px + 2*4px; // < Because of border + background: #404040; + border-color: #808080; + border-width: 4px; Image { - width: 256px; - height: 256px; - source: root.image_data; - image-fit: contain; + width: 256px; + height: 256px; + source: root.image_data; + image-fit: contain; + image-rendering: pixelated; + } + } + Rectangle { + // Fake padding because the padding setting for the HorizontalLayout would not work + width: 4px; + height: 1px; + } + VerticalLayout { + Rectangle { + width: 256px + 2*4px; // < Because of border + height: 256px + 2*4px; // < Because of border + background: #404040; + border-color: #808080; + border-width: 4px; + palette_image := Image { + width: 256px; + height: 256px; + source: root.palette_data; + visible: root.palette_visible; + image-fit: contain; + image-rendering: pixelated; + } + } + HorizontalLayout { + alignment: start; + VerticalLayout { + VerticalLayout { + alignment: center; + Text { + text: "Width: "; + } + } + VerticalLayout { + alignment: center; + Text { + text: "Height: "; + } + } + } + VerticalLayout { + palette_width_edit := LineEdit { + width: 40pt; + input-type: number; + enabled: root.palette_visible; + text: root.palette_width; + + accepted(text) => { + update_palette_size(palette_width_edit.text.to-float(), palette_height_edit.text.to-float()); + } + } + palette_height_edit := LineEdit { + width: 40pt; + input-type: number; + enabled: root.palette_visible; + text: root.palette_height; + + accepted(text) => { + update_palette_size(palette_width_edit.text.to-float(), palette_height_edit.text.to-float()); + } + } + } } } } @@ -84,23 +153,40 @@ component ConvertImageWidget inherits Rectangle { padding: 4px; Button { text: "Add Image"; - enabled: root.enable_button; + enabled: root.enable_view; clicked => {root.add_clicked();} } } } } } + + public function set_palette_image(image: image) { + palette_image.source = image; + palette_image.visible = true; + } + + public function clear_palette_image() { + palette_image.visible = false; + } } export component FileTab inherits Rectangle { - in-out property conv_image_path; - in-out property conv_image_data; - in-out property conv_image_name; - in-out property conv_image_enable; + // TODO: Names are messed up here! + in-out property conv-image_path; + in-out property conv-image_name; + in-out property conv-image_data; + in-out property conv-palette_data; + in-out property conv-palette_width; + in-out property conv-palette_height; + in-out property conv-palette_enable; + in-out property conv-enable_view; + + in-out property state; - callback conv_image_browse_clicked; - callback conv_image_add_clicked; + callback conv-image_update_palette_size(int, int); + callback conv-image_browse_clicked; + callback conv-image_add_clicked; x: 0px; y: 0px; @@ -132,17 +218,25 @@ export component FileTab inherits Rectangle { if root.state == State.Project : ProjectWidget { } if root.state == State.ConvertImage : ConvertImageWidget { - image_path <=> root.conv_image_path; - image_data <=> root.conv_image_data; - image_name <=> root.conv_image_name; - enable_button <=> root.conv_image_enable; + image_path <=> root.conv-image_path; + image_data <=> root.conv-image_data; + palette_data <=> root.conv-palette_data; + palette_width <=> root.conv-palette_width; + palette_height <=> root.conv-palette_height; + palette_visible <=> root.conv-palette_enable; + image_name <=> root.conv-image_name; + enable_view <=> root.conv-enable_view; + + update_palette_size(width, height) => { + root.conv-image_update_palette_size(width, height); + } browse_clicked => { - root.conv_image_browse_clicked(); + root.conv-image_browse_clicked(); } add_clicked => { - root.conv_image_add_clicked(); + root.conv-image_add_clicked(); } } } diff --git a/src/Tools/tim_tool/ui/tab/main-tab.slint b/src/Tools/tim_tool/ui/tab/main-tab.slint index dc3b1a0f..aa2b4202 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 } from "std-widgets.slint"; +import { Button, ComboBox, GroupBox, StandardListView, LineEdit, ScrollView, Slider } from "std-widgets.slint"; struct VRAMImage { img: image, @@ -10,6 +10,7 @@ struct VRAMImage { } export component MainTab inherits Rectangle { + property scale: 1.0; in-out property vram_bg; in-out property <[StandardListViewItem]> vram_files: []; in-out property <[VRAMImage]> vram_images: []; @@ -23,70 +24,116 @@ export component MainTab inherits Rectangle { group := GroupBox { title: "VRAM Layout"; - x: 4px; - y: 4px; + x: 4px; + y: 4px; + width: main_view.width + 2*main_view.x; 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; + main_view := ScrollView { + width: rect.width/root.scale; + height: rect.height/root.scale; + viewport-x: 0; + viewport-y: 0; + viewport-width: rect.width; + viewport-height: rect.height; + + 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: 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: scale; + + TouchArea { + x: ((parent.img_x + self.lines_crossed_x())*1px)*scale; + y: ((parent.img_y + self.lines_crossed_y())*1px)*scale; + width: ((parent.img.width + self.lines_crossed_width())*1px)*scale; + height: ((parent.img.height + self.lines_crossed_height())*1px)*scale; + mouse-cursor: grab; + moved => { + self.mouse-cursor = MouseCursor.grabbing; + root.move_vram_image(i, ((self.mouse-x - self.pressed-x)/scale)/1px, ((self.mouse-y - self.pressed-y)/scale)/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; + } + + 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(); + } + } + } } - 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.display_value = parent.img_x; - cur_sel_y.display_value = parent.img_y; - } - pointer-event(event) => { - if event.kind == PointerEventKind.up { - self.mouse-cursor = MouseCursor.grab; - } + function update_viewport() { + if abs(self.viewport-x) + self.width > self.viewport-width { + self.viewport-x = 0; + } - if event.kind == PointerEventKind.down { - cur_sel_x.display_value = parent.img_x; - cur_sel_y.display_value = parent.img_y; - cur_sel_img.source = parent.img; - } - } + if abs(self.viewport-y) + self.height > self.viewport-height { + self.viewport-y = 0; + } + } + } + HorizontalLayout { + padding: 4px; + VerticalLayout { + alignment: center; + padding-right: 4px; + Text { + text: "Scale: " + round(slider.value) + "%"; + } + } + slider := Slider { + minimum: 100.0; + maximum: 400.0; + step: 1.0; + value: 100.0; - // 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(); - } + changed(value) => { + root.scale = round(value)/100.0; + main_view.update_viewport(); } } } @@ -98,9 +145,16 @@ export component MainTab inherits Rectangle { alignment: start; padding: 4px; vram_files_list := StandardListView { - width: background_image.width/2; + width: background_image.width/root.scale/2; height: 128px; model: root.vram_files; + + current-item-changed(current-item) => { + cur_sel_x.text = root.vram_images[current-item].x; + cur_sel_y.text = root.vram_images[current-item].y; + cur_sel_img.source = root.vram_images[current-item].img; + cur_sel_img.visible = true; + } } HorizontalLayout { padding: 4px; @@ -113,6 +167,9 @@ export component MainTab inherits Rectangle { clicked => { root.remove_file_clicked(vram_files_list.current_item); vram_files_list.current-item = -1; + cur_sel_x.text = 0; + cur_sel_y.text = 0; + cur_sel_img.visible = false; } } } @@ -127,18 +184,53 @@ export component MainTab inherits Rectangle { height: 128px; background: #A0A0A0; cur_sel_img := Image { - width: 128px; - height: 128px; - image-fit: contain; + width: 128px; + height: 128px; + image-fit: contain; + image-rendering: pixelated; } } - cur_sel_x := Text { - in-out property display_value; - text: "X: " + display_value; + HorizontalLayout { + alignment: start; + VerticalLayout { + alignment: center; + Text { + text: "X: "; + } + } + cur_sel_x := LineEdit { + input-type: number; + text: 0; + width: 64pt; + + accepted(text) => { + if(vram_files_list.current-item != -1) { + root.move_vram_image(vram_files_list.current-item, text.to-float() - vram_images[vram_files_list.current-item].x, 0); + self.text = vram_images[vram_files_list.current-item].x; + } + } + } } - cur_sel_y :=Text { - in-out property display_value; - text: "Y: " + display_value; + HorizontalLayout { + alignment: start; + VerticalLayout { + alignment: center; + Text { + text: "Y: "; + } + } + cur_sel_y := LineEdit { + input-type: number; + text: 0; + width: 64pt; + + accepted(text) => { + if(vram_files_list.current-item != -1) { + root.move_vram_image(vram_files_list.current-item, 0, text.to-float() - vram_images[vram_files_list.current-item].y); + self.text = vram_images[vram_files_list.current-item].y; + } + } + } } ComboBox { model: ["4-bit", "16-bit", "24-bit"]; @@ -150,6 +242,33 @@ export component MainTab inherits Rectangle { } } + FocusScope { + key-pressed(event) => { + if(vram_files_list.current-item != -1) { + if(event.text == Key.LeftArrow) { + root.move_vram_image(vram_files_list.current-item, -1, 0); + cur_sel_x.text = vram_images[vram_files_list.current-item].x; + } + + if(event.text == Key.RightArrow) { + root.move_vram_image(vram_files_list.current-item, 1, 0); + cur_sel_x.text = vram_images[vram_files_list.current-item].x; + } + + if(event.text == Key.UpArrow) { + root.move_vram_image(vram_files_list.current-item, 0, -1); + cur_sel_y.text = vram_images[vram_files_list.current-item].y; + } + + if(event.text == Key.DownArrow) { + root.move_vram_image(vram_files_list.current-item, 0, 1); + cur_sel_y.text = vram_images[vram_files_list.current-item].y; + } + } + accept + } + } + function get_border_width() -> int { return 4; } diff --git a/src/Tools/tim_tool/ui/vram-components.slint b/src/Tools/tim_tool/ui/vram-components.slint index b7b869df..65e21fd6 100644 --- a/src/Tools/tim_tool/ui/vram-components.slint +++ b/src/Tools/tim_tool/ui/vram-components.slint @@ -3,14 +3,18 @@ component VRAMSegment inherits Rectangle { in property img; in property clip_x; in property clip_y; + in property scale: 1.0; - 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; + source: img; + x: -root.clip_x*1px*scale; + y: -root.clip_y*1px*scale; + width: img.width*1px*scale; + height: img.height*1px*scale; + image-rendering: pixelated; } } @@ -18,17 +22,19 @@ export component VRAMArea inherits Rectangle { in property img; in property img_x; in property img_y; + in property scale: 1.0; - 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 {