【egui】界面的坐标系统：f32 一统江湖

🎯 核心设计理念

egui 的界面坐标系统统一使用 f32 浮点数，只有两个核心类型：

类型	用途	定义
`Vec2`	表示尺寸/向量（宽高、位移）	`Vec2 { x: f32, y: f32 }`
`Pos2`	表示位置/点（坐标）	`Pos2 { x: f32, y: f32 }`

两者的关系

rust 复制代码

// 位置 + 位移 = 新位置
let pos = egui::pos2(100.0, 200.0);
let offset = egui::vec2(10.0, 20.0);
let new_pos = pos + offset;  // (110.0, 220.0)

// 两点之差 = 向量
let delta = new_pos - pos;   // (10.0, 20.0)

🌊 为什么全部用 f32？

1. UI 布局天然需要浮点数

缩放：窗口缩放 1.5 倍时，坐标变成 1.5
动画：补间动画需要 0.5 像素的平滑过渡
抗锯齿：子像素渲染依赖浮点精度

2. 统一类型简化编程

rust 复制代码

// egui：不管输入什么，统一用 f32 处理
let width = 100;        // 你给整数
let height = 200.5;     // 或者浮点数
let size = egui::vec2(width as f32, height); // 统一变 f32

// 计算时不用操心类型转换
let area = size.x * size.y;  // 直接乘，都是 f32

3. 对比其他框架

框架	整数类型	浮点类型	转换烦恼
egui	❌ 没有	✅ `Vec2`/`Pos2`	没有，全是 f32
Qt	`QPoint`/`QSize`	`QPointF`/`QSizeF`	需要手动转换
CSS	像素整数	rem/em 浮点	混合使用需注意

📈 特殊情况：f64 用于绘图

当处理大数据范围的图表时，egui 提供了 f64 版本：

rust 复制代码

use egui_plot::{Plot, Value};

// 图表坐标用 f64（避免精度丢失）
let data = vec![
    Value::new(123456789.0, 987654321.0),  // 大整数时间戳
    Value::new(123456790.0, 987654322.0),
];

Plot::new("my_plot")
    .view_aspect(2.0)
    .show(ui, |plot_ui| {
        plot_ui.line(egui_plot::Line::new(data));
    });

f32 vs f64 的选择

场景	使用类型	原因
按钮、窗口、布局	`Vec2`/`Pos2` (f32)	性能好，精度够
股票走势图	`Value` (f64)	避免大数精度丢失
科学计算	`PlotPoint` (f64)	需要高精度

🧮 与 int 说再见的好处

以前（Qt 风格）：

cpp 复制代码

// Qt：需要操心类型
int x = 100;
double y = 200.5;
QPoint int_point(x, 50);      // 整数点
QPointF float_point(x, y);     // 浮点数点
// 混合运算时还要转换

现在（egui 风格）：

rust 复制代码

// egui：全是 f32，省心
let x = 100;        // 整数自动转 f32
let y = 200.5;      // 浮点数直接用
let pos = egui::pos2(x as f32, y);  // 统一成 f32

// 想用整数？随时转回去
let grid_x = pos.x.floor() as i32;

💡 一句话总结

egui 的哲学：界面就用 f32，简单统一；真要高精度？绘图区单独开小灶用 f64。不搞整数类型，少操转换的心。

🎯 记住：Vec2 是尺寸/位移，Pos2 是位置，两者都是 f32，加减乘除随便玩。需要整数？最后 as i32 转一下就行。