tauri学习(5)-Splashscreen启动界面
学习 启动 界面 tauri
2023-06-13 09:11:24 时间
接上节继续,本文将研究splashscreen,也就是程序的启动界面,通常有2二种应用场景:
1、程序太复杂,主界面完成加载需要很长时间,为了优化用户体验,可以先放一个启动图片,缓解用户等待的焦虑。
2、播放启动广告,手机应用上很常见,进入主程序前,强制让用户看一会儿广告。
在tauri中也有二种实现方式:
一、前端与Rust配合
1.1 先调整tauri.config.json
要点在于:将主窗口home隐藏,然后将splashscreen窗口显示,为了简单,这里只显示1个小图片,该图片可放在react的public目录下
这样启动时,就只会显示splashscreen窗口,然后在main.rs中暴露1个方法:
1.2 前端监听DOMContentLoaded事件
前文讲过,如何在js中获取tauri window的引用,这里就用上了,大致思路是主界面的dom加载完成后,调用api把spashscreen关掉,然后显示出主窗口
运行效果:
二、纯Rust代码实现
use tauri::Manager;
fn main() {
tauri::Builder::default()
.setup(|app| {
let splashscreen_window = app.get_window("splashscreen").unwrap();
let main_window = app.get_window("home").unwrap();
// we perform the initialization code on a new task so the app doesn't freeze
tauri::async_runtime::spawn(async move {
// initialize your app here instead of sleeping :)
println!("Initializing...");
//等待5秒后,再显示主窗口
std::thread::sleep(std::time::Duration::from_secs(5));
println!("Done initializing.");
// After it's done, close the splashscreen and display the main window
splashscreen_window.close().unwrap();
main_window.show().unwrap();
});
Ok(())
})
.run(tauri::generate_context!())
.expect("failed to run app");
}
效果差不多,只是splashscreen窗口停留多久,一般是根据主窗口加载时间预估,稍稍有那么一点点不精确。
参考文章:
https://tauri.app/v1/guides/features/splashscreen
相关文章
- 《笨开发学习操作系统》3内存
- Redis学习
- 《零基础学机器学习》笔记-第1课-新手快速上路路径
- 【Python深度学习之路】-2.1 机器学习的流程
- git学习笔记
- 思维工程学习笔记
- 【微信小程序】快速入门学习笔记
- 【Spring Cloud Alibaba】(五)Dubbo启动报错?一直重连报错?你值得学习的是排查问题的方法
- 吴恩达机器学习II
- rust写操作系统 rCore tutorial 学习笔记:实验指导零 创建项目与启动
- 学习小组笔记Day07-RUI
- HBase-1.2.1之HRegionServer启动源码学习详解大数据
- Servlet学习笔记详解编程语言
- 从零开始学习H5应用简单页面滑动切换效果详解编程语言
- 学习Linux:最佳入门宝典(学习linux的书籍)
- 深入学习:Linux下Java环境建设与配置(linux下java环境)
- 学习PostgreSQL数据库必备!观看高质量视频教程(postgresql视频)
- MySQL事务处理教程:学习实现原子性操作(mysql 事务教程)
- 电脑上轻松学习启动 Redis(电脑上启动redis教程)
- Runoob上学习Redis一个新的开始(runoob redis)
- Oracle LMS将启动新学习旅程(oracle lms0)
- Hinton 机器学习教程 第一课汉化版完整放送!
- CNN 在基于弱监督学习的图像分割中的应用
- 从这开始了解深度学习——视觉的深度学习与网络
- Android开发之图形图像与动画(一)Paint和Canvas类学习