Rust使用iced構建UI時,如何在界面顯示中文字符

注:此文適合于對rust有一些了解的朋友

iced是一個跨平臺的GUI庫,用于為rust語言程序構建UI界面。
在這里插入圖片描述 ?
iced的基本邏輯是:
UI交互產生消息message,message傳遞給后臺的update,在這個函數中編寫邏輯,然后通過View函數更新UI。

  1. Take the result of our view logic and layout its widgets.
    獲取視圖邏輯的結果并布局其小部件。
  2. Process events from our system and produce messages for our update
    logic. 處理來自系統的事件,并為我們的更新邏輯生成消息。
  3. Draw the resulting user interface. 繪制生成的用戶界面。

下面我們將通過舉例來說明iced如何顯示一個窗口,以及如何在窗口上顯示中文。

一、如何用iced構建窗口:

我們構建一個基本窗口,窗口有一個按鈕,一個文本框,一個標簽,在文本框輸入字符,點擊按鈕后,標簽上顯示相同內容。
UI實例預覽:
在這里插入圖片描述
在這里插入圖片描述
1 導入庫

use iced::widget::{button, column, text, text_input};    
use iced::{Alignment, Element, Sandbox, Settings};

2、配置Cargo.toml

[dependencies]   
iced="0.10"

這樣,使用cargo check時,會自動安裝iced庫。

3、構建窗口程序

主函數:

pub fn main() -> iced::Result {     Counter::run(Settings::default())             //此處為使用默認窗口設置}

定義數據結構:

//創建結構體struct
struct Counter{value: String,value2:String,
}

定義消息:

#[derive(Debug, Clone)]           //為下方的enum添加特性trait
enum Message {Showtext,InputChanged(String),
}

實現一個實例:

//sandbox是一個trait
impl Sandbox for Counter {             //impl將sandbox添加給Counter,使Counter具有了sandbox的一些特性type Message = Message;     fn new() -> Self {                  //初始化sandbox,返回初始值Self { value: String::new(),value2:String::new(),}}fn title(&self) -> String {         //返回sandbox的標題String::from("iced_UI")}fn update(&mut self, message: Message) {        //此處書寫更新邏輯程序,所有UI交互會在這里處理match message {Message::Showtext=> { let ss=&self.value;  self.value2=ss.to_string(); }Message::InputChanged(value) =>{self.value=value;}}}fn view(&self) -> Element<Message> {            column![text_input("enter some string",&self.value).on_input(Message::InputChanged).padding(10).size(16),button("push").on_press(Message::Showtext).padding(2).width(40),  text(format!("enter text:{}",&self.value2)).size(16), ].spacing(10).padding(6).align_items(Alignment::Center).into()}}

完整代碼:

use iced::widget::{button, column, text, text_input}; 
use iced::{Alignment, Element, Sandbox, Settings};pub fn main() -> iced::Result {Counter::run(Settings::default())             //此處為使用默認窗口設置}//創建結構體struct
struct Counter{value: String,value2:String,
}#[derive(Debug, Clone)]           //為下方的enum添加特性trait
enum Message {Showtext,InputChanged(String),
}//sandbox是一個trait
impl Sandbox for Counter {             //impl將sandbox添加給Counter,使Counter具有了sandbox的一些特性type Message = Message;fn new() -> Self {                  //初始化sandbox,返回初始值Self { value: String::new(),value2:String::new(),}}fn title(&self) -> String {         //返回sandbox的標題String::from("iced_UI")}fn update(&mut self, message: Message) {        //此處書寫更新邏輯程序,所有UI交互會在這里處理match message {Message::Showtext=> { let ss=&self.value;  self.value2=ss.to_string(); }Message::InputChanged(value) =>{self.value=value;}}}fn view(&self) -> Element<Message> {            column![text_input("enter some string",&self.value).on_input(Message::InputChanged).padding(10).size(16),button("push").on_press(Message::Showtext).padding(2).width(40),  text(format!("enter text:{}",&self.value2)).size(16), ].spacing(10).padding(6).align_items(Alignment::Center).into()}}

cargo run以上代碼,演示如下:
在這里插入圖片描述
由于涉及rust和iced兩個方面的應用,在此,僅就iced的相關使用作一下說明,至于對rust的代碼有疑問的,可以參考rust的官方手冊。

impl Sandbox for Counter{}

這里的sandbox是iced庫提供的一個簡單的應用特性,它是一個trait,有update、view、run等函數功能,此處,update和view是兩個有點對應的功能,當你在UI操作部件時,會產生交互消息message,update就是接受message的,你可以在update函數下,編寫你的邏輯:
此例中,我的邏輯是,當在文本框輸入信息時,實時文本會傳給之前定義好的一個數據即value。當點擊按鈕時,會將文本框的數據傳給另一個數據value2,然后value2是和用于顯示的文本框綁定的。

  fn update(&mut self, message: Message) {        //此處書寫更新邏輯程序,所有UI交互會在這里處理match message {          Message::Showtext=> { let ss=&self.value;  self.value2=ss.to_string(); }Message::InputChanged(value) =>{self.value=value;}}}

value2通過view函數顯示到UI界面。
下面的代碼是其中一句,這里將text部件綁定了一個值self.value2即前面定義的value2。

 text(format!("enter text:{}",&self.value2)).size(16),   

二、如何在iced窗口顯示中文:

但是上面的程序,有個小小的不足,就是窗口無法顯示中文字符,比如,我將按鈕的名稱由push改成開始

button("開始")

再運行的話:
在這里插入圖片描述
可以看到上圖中按鈕的名字變成了亂碼,這是因為在窗口的設定時,使用了默認參數:

pub fn main() -> iced::Result {Counter::run(Settings::default())             //此處為使用默認窗口設置 
}

就是此處的Settings,而iced的默認窗口參數中,字體使用的是:SansSerif。因此不支持中文字符,所以,如果想要在UI界面用中文來表示各個部件的名稱或注釋,需要更改字體。

所以,此處我們對上面的程序進行修改,以便窗口可以顯示中文,其實就是修改字體的設置。

首先需要添加導入:

use iced::Font;
use iced::font::Family;

然后,修改主函數中的run函數的Settings:

pub fn main() -> iced::Result {       //Counter::run(Settings::default())             //此處為使用默認窗口設置 let ff="Microsoft YaHei";     //設置自定義字體Counter::run(Settings {default_font:Font{                      //設置自定義字體,用于顯示中文字符family:Family::Name(ff),..Font::DEFAULT},..Settings::default()})
}

和之前的主函數對一下,可以發現,這里我先定義了一個字符串,用來表示字體的名字,此處是微軟雅黑字體。
然后在Settings中,將關于字體的default_font單獨設置。
設置好后,我們再來cargo run一下:
在這里插入圖片描述
可以看到,中文字符能正常顯示了。
對上面的主函數,我們再做一下修改,使窗口啟動時的尺寸按照我們想要的來,即自定義窗口尺寸:

先添加導入

use iced::window;

然后主函數:

pub fn main() -> iced::Result {    //Counter::run(Settings::default())             //此處為使用默認窗口設置 let ff="Microsoft YaHei";     //設置自定義字體Counter::run(Settings {window:window::Settings{                //設置自定義窗口尺寸size:(600,400),..window::Settings::default()},default_font:Font{                      //設置自定義字體,用于顯示中文字符family:Family::Name(ff),..Font::DEFAULT},..Settings::default()})
}

這樣一來,窗口啟動時不會按照默認的來,而是按照自己設定來顯示。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/163788.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/163788.shtml
英文地址,請注明出處:http://en.pswp.cn/news/163788.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

護法革命:CIMIVO+SOTUY洗前發膜讓發絲重獲“芯”生

愛美之心人皆有之,經常燙染或者是在太陽下暴曬,都會對發絲造成一定的傷害,一旦發絲受損,就會導致發芯內部角蛋白流失、化學鍵連接斷裂,進而出現各種發質問題。為此,日本知名化妝品集團NABOCUL旗下發芯修護引領品牌ENNEO創新研發兩大核心成分:CIMIVO、SOTUY,能夠從根源修護發芯內…

EXCEL小技巧

1、兩列文本合并顯示&#xff1a; CONCATENATE(B6,E6) &#xff08;如果顯示公式而非文本&#xff0c;就是公式輸錯了&#xff0c;比如后缺少空格&#xff09;

mac 終端配置

Mac iTerm2 配置 安裝 brew install iTerm2安裝完成之后&#xff0c;需要重新打開終端&#xff0c;既可以看見安裝 iTerm2 的效果。 iTerm2 美化 使用 oh-my-zsh 美化 iTerm2 終端 安裝 brew install wget sh -c "$(wget https://raw.github.com/ohmyzsh/ohmyzsh/mast…

宇宙工具箱:辦公娛樂兩不誤堪稱手機的百寶箱

宇宙工具箱 宇宙工具箱&#xff0c;提供大量實用工具&#xff0c;多種類型盡在其中&#xff0c;支持圖片/視頻處理、計算、查詢、娛樂等多方內容&#xff0c;滿足用戶使用需求&#xff0c;超多工具直接使用。 獲取資源 詳細獲取地址請點擊 宇宙工具箱 功能特點 1、計算工具…

【硬核HeyGen平替】在window平臺上使用MyHeyGen

最近在研究HeyGen的平替開源項目&#xff0c;然后發現了MyHeyGen這個項目&#xff0c;但是文檔上面并沒有說明如果在window平臺上使用&#xff0c;考慮到非window平臺安裝顯卡驅動什么的比較繁瑣&#xff0c;所以嘗試硬著頭皮干... 前提 開源項目中所需的環境準備要先準備好 1…

測試15k薪資第1步 —— 自動化測試理論基礎

目錄 1、自動化測試定義 2、自動化測試分類&工具 3、未來發展趨勢 1.1、什么是自動化測試 自動化測試指的是利用軟件工具或腳本來執行測試任務&#xff0c;以替代手動測試過程的一種測試方法。它的主要目的是通過自動化執行、驗證和評估軟件應用的功能、穩定性、性能等方面…

Kotlin(十一) 標準函數with、run和apply

with with函數接收兩個參數&#xff1a;第一個參數可以是一個任意類型的對象&#xff0c;第二個參數是一個Lambda表達式。with函數會在Lambda表達式中提供第一個參數對象的上下文&#xff0c;并使用Lambda表達式中的最后一行代碼作為返回值返回。示例代碼如下&#xff1a; va…

python常用第三方模塊 --- Pyinstaller(把程序打包成可執行程序)

打包方法&#xff1a; 在cmd下進行 pyinstaller -F 路徑/程序文件名 注意&#xff1a;使用pyinstaller之前需要安裝 pip install pyinstaller

ELK架構

經典的ELK 經典的ELK主要是由Filebeat Logstash Elasticsearch Kibana組成&#xff0c;如下圖&#xff1a;&#xff08;早期的ELK只有Logstash Elasticsearch Kibana&#xff09; 此架構主要適用于數據量小的開發環境&#xff0c;存在數據丟失的危險。 整合消息隊列Ngin…

如何用網格交易做ETF套利

ETF套利是指利用ETF基金的交易機制&#xff0c;通過短期的買賣差價或組合投資來獲取利潤。 具體來說&#xff0c;ETF套利最常用的套利方法則是&#xff1a;價格套利和波動套利。 1. 價格套利&#xff1a;當ETF二級市場的價格與一級市場的凈值出現偏差時&#xff0c;投資者可以通…

【SwiftUI】7.預覽及其內部機制

上一篇講到了組件及組件化&#xff0c;從概念和優/缺點兩個方向說明了組件化的意義&#xff0c;更為重要的是&#xff0c;組件和組件化是一個在編程領域&#xff0c;放之四海皆可以的概念&#xff0c;理解和運用它是非常必要的&#xff0c;希望大家能掌握。今天我們介紹另一個特…

Element UI的Tabs 標簽頁位置導航欄去除線條

在實際開發中&#xff0c;我們調整了相關樣式&#xff0c;導致導航欄的相關樣式跟隨不上&#xff0c;如下圖所示&#xff1a; 因為我跳轉了前邊文字的樣式并以在導航欄添加了相關頭像&#xff0c;導致右邊的線條定位出現問題&#xff0c;我在想&#xff0c;要不我繼續調整右邊…

開發B2B商城的意義

開發B2B商城的意義主要體現在以下幾個方面&#xff1a; 采購成本低&#xff1a;利用互聯網采購&#xff0c;B2B商城的采購商可直接通過線上完成全部流程操作&#xff0c;在提高采購效率的同時&#xff0c;大大降低了B2B工業品企業采購成本。推廣優勢大&#xff1a;B2B商城的曝…

YM5411 WIFI 5模塊 完美替代AP6256

YM5411是沃特沃德推出的一款低成本&#xff0c;低功耗的模塊&#xff0c;該模塊具有Wi-Fi&#xff08;2.4GHz和5GHz IEEE 802.11 a/b/g/n/ac&#xff09;藍牙&#xff08;BT5.0&#xff09;功能&#xff0c;并通過了SRRC認證&#xff0c;帶mesh&#xff0c;完美替換AP6256。高度…

OpenHarmony之NAPI框架介紹

張志成 誠邁科技高級技術專家 NAPI是什么 NAPI的概念源自Nodejs&#xff0c;為了實現javascript腳本與C庫之間的相互調用&#xff0c;Nodejs對V8引擎的api做了一層封裝&#xff0c;稱為NAPI。可以在Nodejs官網&#xff08;https://nodejs.org/dist/latest-v20.x/docs/api/n-api…

【python爬蟲】scrapy在pycharm 調試

scrapy在pycharm 調試 1、使用scrapy創建一個項目 scrapy startproject tutorial 2、在朋友pycharm中調試scrapy 2.1 通過文件run.py調試 在根目錄下新建一個文件run.py(與scrapy.cfg文件的同一目錄下), debug ‘run’即可 # -*- coding:utf-8 -*- from scrapy import c…

深入淺出理解libevent——2萬字總結

概述 libevent,libev,libuv都是c實現的異步事件庫&#xff0c;注冊異步事件&#xff0c;檢測異步事件&#xff0c;根據事件的觸發先后順序&#xff0c;調用相對應回調函數處理事件。處理的事件包括&#xff1a;網絡 io 事件、定時事件以及信號事件。這三個事件驅動著服務器的運…

數字人是真人嗎?

引言&#xff1a; 隨著科技的不斷進步&#xff0c;數字人作為一種新興技術正逐漸嶄露頭角。數字人是通過計算機生成的虛擬人物&#xff0c;具備逼真的外貌和行為&#xff0c;令人難以分辨其與真人的差異。本文將探討數字人是否可以被視為真人&#xff0c;并探索數字人技術在各個…

柯橋生活日語學習,打工人的日語你會嗎?

打工人在日語里有幾種說法: アルバイト 這是最常用的稱呼,直接對應中文的“打工”。 例句: 學生の頃はスーパーでアルバイトをしていた。(我學生時代在超市打過工。) バイト これはアルバイトの略稱でよく使われる。(這是アルバイト的簡稱,也很常用。) 例句: バイト先が決…

《第一行代碼:Android》第三版-2.4.1 if 語句

本文主要講解if語句&#xff0c;kotlin的if語句是可以有返回值的&#xff0c;就是if語句的最后一句話就是返回值。 /*** You can edit, run, and share this code.* play.kotlinlang.org*/fun main() {println("Hello, world!!!") val largelargerNumber(5,9) prin…