randrews/kiln
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add scroll bars to Edit mode when board overflows viewport

Browse Source 
Edit mode now wraps the board in a ScrollArea so horizontal/vertical
scroll bars appear when the board is larger than the window. Play mode
keeps the existing player-centered viewport with no scroll bars.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Ross Andrews
2026-05-17 16:52:09 -05:00
parent c3d260266c
commit 0348ecdd13
1 changed files with 65 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main.rs
+65 -52
View File
@@ -137,63 +137,76 @@ impl eframe::App for App {
// The board is drawn using the egui Painter API (direct 2D drawing),
// not egui widgets. This gives pixel-level control over placement.
egui::CentralPanel::default().show(ctx, |ui| {
let available = ui.available_rect_before_wrap();
let board_w = self.state.board.width;
let board_h = self.state.board.height;
let board_px = vec2(board_w as f32 * CELL_W, board_h as f32 * CELL_H);
// Extract board dimensions and player position before the immutable
// borrow scope so `board_origin` can use them without conflicting
// with the later mutable borrow for click-to-paint.
let (board_w, board_h) = (self.state.board.width, self.state.board.height);
let player = self.state.board.player;
let origin = board_origin(available, board_w, board_h, player);
// Draw board and player. Immutable borrow of `board` ends after
// this block, freeing `self.state.board` for mutation below.
{
let board = &self.state.board;
let painter = ui.painter();
// Draw each board cell: filled background rect, then the character.
for y in 0..board.height {
for x in 0..board.width {
let (glyph, _) = board.get(x, y);
draw_glyph(painter, origin, x, y, glyph);
}
}
// Draw the player on top of the board. The player is not stored as
// a board cell, so it is rendered as a separate overlay. This will
// change once the player becomes a scripted object.
let player_glyph = Glyph::player();
draw_glyph(
painter,
origin,
board.player.x as usize,
board.player.y as usize,
&player_glyph,
);
}
// In Edit mode, capture clicks on the viewport and paint cells.
if self.mode == AppMode::Edit {
let response = ui.allocate_rect(available, Sense::click());
if response.clicked() {
if let Some(pos) = response.interact_pointer_pos() {
// Convert pixel position to cell coordinates using the
// same origin computed for rendering above.
let rel = pos - origin;
let cx = (rel.x / CELL_W).floor() as i32;
let cy = (rel.y / CELL_H).floor() as i32;
// floor() keeps out-of-bounds negatives negative; caught here.
if cx >= 0 && cy >= 0 {
let cx = cx as usize;
let cy = cy as usize;
let board = &mut self.state.board;
if cx < board.width && cy < board.height {
let arch = self.editor.selected;
*board.get_mut(cx, cy) = (arch.default_glyph(), arch);
// Edit mode: ScrollArea lets the user scroll when the board
// overflows the viewport, showing scroll bars as needed.
egui::ScrollArea::new([true, true]).show(ui, |ui| {
let (rect, response) = ui.allocate_exact_size(board_px, Sense::click());
{
let board = &self.state.board;
let painter = ui.painter();
for y in 0..board.height {
for x in 0..board.width {
let (glyph, _) = board.get(x, y);
draw_glyph(painter, rect.min, x, y, glyph);
}
}
let player_glyph = Glyph::player();
draw_glyph(
painter,
rect.min,
board.player.x as usize,
board.player.y as usize,
&player_glyph,
);
}
if response.clicked() {
if let Some(pos) = response.interact_pointer_pos() {
let rel = pos - rect.min;
let cx = (rel.x / CELL_W).floor() as i32;
let cy = (rel.y / CELL_H).floor() as i32;
// floor() keeps out-of-bounds negatives negative; caught here.
if cx >= 0 && cy >= 0 {
let cx = cx as usize;
let cy = cy as usize;
let board = &mut self.state.board;
if cx < board.width && cy < board.height {
let arch = self.editor.selected;
*board.get_mut(cx, cy) = (arch.default_glyph(), arch);
}
}
}
}
});
} else {
// Play mode: player-centered viewport, no scroll bars.
let available = ui.available_rect_before_wrap();
let player = self.state.board.player;
let origin = board_origin(available, board_w, board_h, player);
{
let board = &self.state.board;
let painter = ui.painter();
for y in 0..board.height {
for x in 0..board.width {
let (glyph, _) = board.get(x, y);
draw_glyph(painter, origin, x, y, glyph);
}
}
// Draw the player on top of the board. The player is not stored as
// a board cell, so it is rendered as a separate overlay. This will
// change once the player becomes a scripted object.
let player_glyph = Glyph::player();
draw_glyph(
painter,
origin,
board.player.x as usize,
board.player.y as usize,
&player_glyph,
);
}
}
});