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

发布于:2025-09-05 ⋅ 阅读:(14) ⋅ 点赞:(0)

一、窗口颜色和透明度

(一)效果预览

在这里插入图片描述

(二)透明窗体主要代码

use eframe::egui; 
use egui::Color32;

fn main() -> eframe::Result<()> {
    let options = eframe::NativeOptions {
        viewport: egui::ViewportBuilder::default() // 创建视口构建器来配置窗口
            .with_inner_size([600., 500.])   // 设置窗口初始内部尺寸为600x500像素
            .with_transparent(true),         // 允许窗口背景透明
        centered: true,                      // 窗口启动时在屏幕上居中显示
        ..Default::default()                 // 使用其他默认选项
    };

    eframe::run_simple_native("窗体颜色和透明度", options, move |ctx, _frame| {
           ctx.set_visuals(egui::Visuals {
                // 设置面板填充颜色为半透明色,颜色由RGB值和透明度决定
                panel_fill: Color32::from_rgba_premultiplied(
                    25,                   // 红色分量(0-255)
                    0,                    // 绿色分量(0-255)
                    55,                   // 蓝色分量(0-255)
                    76,                   // 透明度分量(0-255)
                ),
                // 保留其他视觉样式的默认设置
                ..ctx.style().visuals.clone()
            });
        egui::CentralPanel::default().show(ctx, |ui| {
            load_fonts(ctx);        // 自定义的设置中文字体函数
            ui.label("窗体内容…………");
        });
    })
}

二、程序中随意调整窗口颜色和透明度

(一)效果预览

在这里插入图片描述

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

use eframe::egui; 
use egui::Color32;

fn main() -> eframe::Result<()> {
    let options = eframe::NativeOptions {
        viewport: egui::ViewportBuilder::default() // 创建视口构建器来配置窗口
            .with_inner_size([600., 500.])         // 设置窗口初始内部尺寸为500x500像素
            .with_transparent(true),               // 允许窗口背景透明
        centered: true,                            // 窗口启动时在屏幕上居中显示
        ..Default::default()                       // 使用其他默认选项
    };

    let mut opacity = 0.3;   // 控制窗口透明度
    let mut r = 25;          // 控制红色分量
    let mut g = 0;           // 控制绿色分量
    let mut b = 55;          // 控制蓝色分量
    
    eframe::run_simple_native("窗体颜色和透明度", options, move |ctx, _frame| {
           ctx.set_visuals(egui::Visuals {
                // 设置面板填充颜色为半透明色,颜色由RGB值和透明度决定
                panel_fill: Color32::from_rgba_premultiplied(
                    r,                       // 红色分量
                    g,                       // 绿色分量
                    b,                       // 蓝色分量
                    (opacity * 255.0) as u8, // 透明度分量(将0-1范围转换为0-255范围)
                ),
                // 保留其他视觉样式的默认设置
                ..ctx.style().visuals.clone()
            });
            
        egui::CentralPanel::default().show(ctx, |ui| {
            load_fonts(ctx);      // 自定义加载字体函数
            ui.add(egui::Slider::new(&mut opacity, 0.0..=1.0).text("透明度"));
            ui.add(egui::Slider::new(&mut r, 0..=255).text("红色"));
            ui.add(egui::Slider::new(&mut g, 0..=255).text("绿色"));
            ui.add(egui::Slider::new(&mut b, 0..=255).text("蓝色"));
            ui.label(format!("当前颜色: ({}, {}, {})", r, g, b));
        });
    })
}

网站公告

今日签到

点亮在社区的每一天
去签到