点击上方蓝字 江湖评谈设为关注/星标
前言
Rust的GUI开发Tauri,非常简单,本篇看下。
Tauri
构建Tauri:
#cargo install create-tauri-app --locked
#cargo create-tauri-app
#cd tauri-app
#cargo tauri dev
以上四句简单的构建了一个tauri GUI 程序,运行结果如下:
Tauri实际上是通过Rust代码操控前端的html/css这些代码,当然它实际上还可以操控Next.js,Qwik,Vite等等。
进入到以下目录:
cd src
ls
assets index.html main.js styles.css
index.html里面可以直接修改Tauri的GUI
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="styles.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tauri App</title>
<script type="module" src="/main.js" defer></script>
</head>
<body>
<div class="container">
<h1>Welcome to Tauri!</h1>
<div class="row">
<a href="https://tauri.app" target="_blank">
<img src="/assets/tauri.svg" class="logo tauri" alt="Tauri logo" />
</a>
<a
href="https://developer.mozilla.org/en-US/docs/Web/JavaScript"
target="_blank"
>
<img
src="/assets/javascript.svg"
class="logo vanilla"
alt="JavaScript logo"
/>
</a>
</div>
<p>Welcome to Rust World</p>
<form class="row" id="greet-form">
<input id="greet-input" placeholder="Enter a name..." />
<button type="submit">Greet</button>
</form>
<p id="greet-msg"></p>
</div>
</body>
</html>
比如以上把Click on the Tauri logo to lean more about the framework修改为welcome to Rust World,程序不用关闭,它自动更改
往期精彩回顾