Скейлинг

This commit is contained in:
2025-12-20 20:47:37 +03:00
parent b49ee3e46c
commit 643aaee926
2 changed files with 127 additions and 51 deletions

View File

@@ -93,9 +93,10 @@ fn gui_frame(ctx: *WindowContext) bool {
canvas.fillRandomGradient() catch |err| {
std.debug.print("Error filling canvas: {}\n", .{err});
};
canvas.pos = .{ .x = 800, .y = 400 };
canvas.pos = .{ .x = 400, .y = 400 };
canvas.zoom = dvui.windowNaturalScale();
}
if (dvui.checkbox(@src(), &canvas.native_scaling, "Scaling", .{})) {}
}
left_panel.deinit();
@@ -106,7 +107,7 @@ fn gui_frame(ctx: *WindowContext) bool {
.{ .expand = .both, .padding = dvui.Rect.all(12), .background = true },
);
{
const fill_color = Color.white.opacity(0.5);
const fill_color = Color.black.opacity(0.25);
var right_panel = dvui.box(
@src(),
.{ .dir = .vertical },
@@ -139,45 +140,78 @@ fn gui_frame(ctx: *WindowContext) bool {
},
);
{
// Отобразить canvas внутри scroll area.
// ScrollArea сам двигает дочерние виджеты, поэтому margin не нужен.
if (canvas.texture) |texture| {
const natural_scale = dvui.windowNaturalScale();
const img_size = canvas.getScaledImageSize();
_ = dvui.image(@src(), .{
.source = .{ .texture = texture },
}, .{
// Canvas область внутри scroll area (полный размер изображения).
// Важно: мы НЕ двигаем отдельный image-виджет под visible_rect;
// вместо этого рисуем частичную текстуру внутри этой области со сдвигом.
const natural_scale = dvui.windowNaturalScale();
const img_area_divider = if (canvas.native_scaling) 1 else natural_scale;
const img_size = canvas.getScaledImageSize();
var img_area = dvui.box(
@src(),
.{ .dir = .vertical },
.{
.background = false,
.margin = .{
// img_size.* считаем в пикселях картинки (physical).
// dvui.image ожидает размеры в natural, поэтому делим на scale.
.x = @as(f32, @floatFromInt(img_size.x)) / natural_scale,
.y = @as(f32, @floatFromInt(img_size.y)) / natural_scale,
.x = @as(f32, @floatFromInt(img_size.x)) / img_area_divider,
.y = @as(f32, @floatFromInt(img_size.y)) / img_area_divider,
.w = @as(f32, @floatFromInt(img_size.x)) / img_area_divider,
.h = @as(f32, @floatFromInt(img_size.y)) / img_area_divider,
},
.min_size_content = .{
.w = @as(f32, @floatFromInt(img_size.w)) / natural_scale,
.h = @as(f32, @floatFromInt(img_size.h)) / natural_scale,
.w = @as(f32, @floatFromInt(img_size.w)) / img_area_divider,
.h = @as(f32, @floatFromInt(img_size.h)) / img_area_divider,
},
});
.max_size_content = .{
.w = @as(f32, @floatFromInt(img_size.w)) / img_area_divider,
.h = @as(f32, @floatFromInt(img_size.h)) / img_area_divider,
},
},
);
defer img_area.deinit();
// Получить viewport и scroll offset
const viewport_rect = scroll.data().contentRect();
const scroll_current = dvui.Point{ .x = canvas.scroll.viewport.x, .y = canvas.scroll.viewport.y };
// Получить viewport и scroll offset
const viewport_rect = scroll.data().contentRect();
const scroll_current = dvui.Point{ .x = canvas.scroll.viewport.x, .y = canvas.scroll.viewport.y };
// viewport_rect/scroll_current — в natural единицах.
// Для видимой области в пикселях изображения переводим в physical.
const viewport_px = dvui.Rect{
.x = viewport_rect.x * natural_scale,
.y = viewport_rect.y * natural_scale,
.w = viewport_rect.w * natural_scale,
.h = viewport_rect.h * natural_scale,
};
const scroll_px = dvui.Point{
.x = scroll_current.x * natural_scale,
.y = scroll_current.y * natural_scale,
};
// viewport_rect/scroll_current — в natural единицах.
// Для расчёта видимой области в пикселях изображения переводим в physical.
const viewport_px = dvui.Rect{
.x = viewport_rect.x * img_area_divider,
.y = viewport_rect.y * img_area_divider,
.w = viewport_rect.w * img_area_divider,
.h = viewport_rect.h * img_area_divider,
};
const scroll_px = dvui.Point{
.x = scroll_current.x * img_area_divider,
.y = scroll_current.y * img_area_divider,
};
const visible_rect = canvas.getVisibleImageRect(viewport_px, scroll_px);
std.debug.print("Visible image rect: {any}\n", .{visible_rect});
canvas.updateVisibleImageRect(viewport_px, scroll_px) catch |err| {
std.debug.print("updateVisibleImageRect error: {}\n", .{err});
};
// if (canvas.visible_rect) |vis| {
// if (vis.w != 0 and vis.h != 0) {
// const area_rs = img_area.data().contentRectScale();
// var part_rs = area_rs;
// part_rs.r = .{
// .x = area_rs.r.x + @as(f32, @floatFromInt(vis.x)),
// .y = area_rs.r.y + @as(f32, @floatFromInt(vis.y)),
// .w = @as(f32, @floatFromInt(vis.w)),
// .h = @as(f32, @floatFromInt(vis.h)),
// };
// canvas.render(part_rs) catch {};
// }
// }
if (canvas.texture) |tex| {
_ = dvui.image(
@src(),
.{ .source = .{ .texture = tex } },
.{
.expand = .both,
},
);
}
// Заблокировать события скролла, если нажат ctrl
@@ -189,6 +223,7 @@ fn gui_frame(ctx: *WindowContext) bool {
if (dvui.eventMatchSimple(e, scroll.data()) and (action == .wheel_x or action == .wheel_y)) {
switch (action) {
.wheel_y => |y| {
canvas.updateVisibleImageRect(viewport_px, scroll_px) catch {};
canvas.addZoom(y / 1000);
canvas.redrawGradient() catch {};
},