rust语言 (1.88) egui (0.32.1) 学习条记（逐行解释）（二十四）窗口颜色、透明度、居中显示

一、窗口颜色和透明度

（一）结果预览

（二）透明窗体主要代码

1. use eframe::egui;
2. use egui::Color32;
4. fn main() -> eframe::Result<()> {
5.     let options = eframe::NativeOptions {
6.         viewport: egui::ViewportBuilder::default() // 创建视口构建器来配置窗口
7.             .with_inner_size([600., 500.])   // 设置窗口初始内部尺寸为600x500像素
8.             .with_transparent(true),         // 允许窗口背景透明
9.         centered: true,                      // 窗口启动时在屏幕上居中显示
10.         ..Default::default()                 // 使用其他默认选项
11.     };
13.     eframe::run_simple_native("窗体颜色和透明度", options, move |ctx, _frame| {
14.            ctx.set_visuals(egui::Visuals {
15.                 // 设置面板填充颜色为半透明色，颜色由RGB值和透明度决定
16.                 panel_fill: Color32::from_rgba_premultiplied(
17.                     25,                   // 红色分量（0-255）
18.                     0,                    // 绿色分量（0-255）
19.                     55,                   // 蓝色分量（0-255）
20.                     76,                   // 透明度分量（0-255）
21.                 ),
22.                 // 保留其他视觉样式的默认设置
23.                 ..ctx.style().visuals.clone()
24.             });
25.         egui::CentralPanel::default().show(ctx, |ui| {
26.             load_fonts(ctx);        // 自定义的设置中文字体函数
27.             ui.label("窗体内容…………");
28.         });
29.     })
30. }

复制代码

二、步调中随意调解窗口颜色和透明度

（一）结果预览

（二）控制窗口颜色和透明度的主要代码

1. use eframe::egui;
2. use egui::Color32;
4. fn main() -> eframe::Result<()> {
5.     let options = eframe::NativeOptions {
6.         viewport: egui::ViewportBuilder::default() // 创建视口构建器来配置窗口
7.             .with_inner_size([600., 500.])         // 设置窗口初始内部尺寸为500x500像素
8.             .with_transparent(true),               // 允许窗口背景透明
9.         centered: true,                            // 窗口启动时在屏幕上居中显示
10.         ..Default::default()                       // 使用其他默认选项
11.     };
13.     let mut opacity = 0.3;   // 控制窗口透明度
14.     let mut r = 25;          // 控制红色分量
15.     let mut g = 0;           // 控制绿色分量
16.     let mut b = 55;          // 控制蓝色分量
17.    
18.     eframe::run_simple_native("窗体颜色和透明度", options, move |ctx, _frame| {
19.            ctx.set_visuals(egui::Visuals {
20.                 // 设置面板填充颜色为半透明色，颜色由RGB值和透明度决定
21.                 panel_fill: Color32::from_rgba_premultiplied(
22.                     r,                       // 红色分量
23.                     g,                       // 绿色分量
24.                     b,                       // 蓝色分量
25.                     (opacity * 255.0) as u8, // 透明度分量（将0-1范围转换为0-255范围）
26.                 ),
27.                 // 保留其他视觉样式的默认设置
28.                 ..ctx.style().visuals.clone()
29.             });
30.             
31.         egui::CentralPanel::default().show(ctx, |ui| {
32.             load_fonts(ctx);      // 自定义加载字体函数
33.             ui.add(egui::Slider::new(&mut opacity, 0.0..=1.0).text("透明度"));
34.             ui.add(egui::Slider::new(&mut r, 0..=255).text("红色"));
35.             ui.add(egui::Slider::new(&mut g, 0..=255).text("绿色"));
36.             ui.add(egui::Slider::new(&mut b, 0..=255).text("蓝色"));
37.             ui.label(format!("当前颜色: ({}, {}, {})", r, g, b));
38.         });
39.     })
40. }

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。