前言参考官方文档https://docs.rs/xilem/latest/xilem/view/fn.prose.html版本Xilem 0.4一、prose基础概念prose 是可鼠标选中复制的段落文本组件。label 文本不可选中复制prose支持鼠标拖拽选中文本、CtrlC复制适合日志、输出内容、大段正文、展示需要拷贝的信息。label静态展示不可选中复制简短标题/提示文字prose段落正文支持选中文本复制适合日志、长文本输出官方描述 A view which displays selectable text. 用于展示可选择文本的View二、函数签名pubfnprose(content:implIntoArcStr)-Prose参数说明content: impl Into 传入字符串、 String 、 str 、 format!() 格式化字符串都可以内部转为 ArcStr 高效共享字符串。返回值 Prose 视图可放入 flex_col/flex_row 支持链式修饰.text_alignment(TextAlign::Center) 设置文本对齐.text_size(f64) 设置字号大小三、最简基础用法// 普通字符串prose(这是一段可以鼠标选中复制的正文文字)// format格式化动态文本prose(format!(计数{},state.counter))// 设置居中、字号prose(居中大段文字).text_alignment(TextAlign::Center).text_size(18.0)四、官方示例解读文档源码示例1展示历史日志 state_machine.rsflex_col((text_button(Reset,|app_data:mutStateMachine|{app_data.history.clear();app_data.stateIsEven::Initial;}),prose(*app_data.history),// history字符串可选中复制日志label(format!(Current state: {:?},app_data.state)),))业务场景日志输出用户可以选中日志文本复制出来。示例2动态列表 lists.rsletlist(0..state.count).map(|n|prose(format!(item #{n}))).collect::Vec_();flex_col((text_button(more,|appstate:mutAppState|appstate.count1),list,// VecProse直接放入flex子项动态生成多条可复制文本));关键点prose 可以在 .map() 中批量生成收集为Vec直接作为flex布局子节点。五、完整可运行demoCargo.toml[package] name xilem_lesson32_prose version 0.1.0 edition 2021 [dependencies] xilem 0.4.0 winit 0.30src/main.rsusexilem::winit::error::EventLoopError;usexilem::view::{prose,text_button,label};usexilem::{EventLoop,TextAlign,WidgetView,WindowOptions,Xilem};#[derive(Default)]structAppState{log_content:String,count:i32,}fnapp_logic(state:mutAppState)-implWidgetViewAppStateuse{flex_col((label(第32课 prose可选中复制的文本),prose(鼠标拖动选中我按下CtrlC复制这段文字).text_alignment(TextAlign::Center).text_size(17.0),text_button(追加日志,|s:mutAppState|{s.count1;s.log_content.push_str(format!(日志行 {}\n,s.count));}),text_button(清空日志,|s:mutAppState|{s.log_content.clear();}),// 大段日志支持选中复制全部日志内容prose(s.log_content),)).padding(12.0)}fnmain()-Result(),EventLoopError{letappXilem::new_simple(AppState::default(),app_logic);app.run(EventLoop::with_user_event(),WindowOptions::default())}六、高频踩坑清单✅ label 不能复制需要复制文本必须用prose。prose 接收 str / String / format!() 内部自动转换 ArcStr 无需手动转换。prose 支持换行符 \n 自动换行展示大段文本。可以把 prose 收集到 Vec 中直接作为flex布局子元素实现动态列表渲染。0.4版本prose支持 .text_size() 、 .text_alignment() 链式方法不支持直接设置文字颜色底层View层API尚未开放颜色修改接口。prose仅选中文本复制不支持编辑需要输入编辑文本用 text_input 组件。七、课后练习题 标准答案 逐行解读练习1基础需求界面显示两段文本一段label一段prose。体验两者区别prose可以鼠标选中复制label不可选中。参考答案flex_col((label(这是label文本无法选中复制),prose(这是prose文本鼠标拖动可以选中CtrlC复制),))详细解读label 普通展示标签文本仅用于显示没有文本选择交互。prose 底层开启文本选择能力鼠标拖拽可以框选全部或部分文字系统剪贴板复制。适合场景输出日志、错误信息、密钥、需要让用户拷贝的内容。练习2进阶需求点击按钮往state.history追加一行记录使用 prose 展示全部历史记录支持复制全部历史文本设置字号16左对齐。参考答案#[derive(Default)]structAppState{history:String,idx:i32,}fnapp_logic(state:mutAppState)-implWidgetViewAppStateuse{flex_col((text_button(新增一条记录,|s:mutAppState|{s.idx1;s.history.push_str(format!(记录 No.{}\n,s.idx).as_str());}),text_button(清空记录,|s:mutAppState|{s.history.clear();s.idx0;}),prose(state.history).text_size(16.0).text_alignment(TextAlign::Start),))}详细解读history:String 存储全部多行日志 \n 实现换行。prose(state.history) 绑定状态字符串状态更新自动刷新显示。.text_size(16.0) 修改字号 .text_alignment(TextAlign::Start) 左对齐。用户可以鼠标框选全部日志Ctrl‑C复制全部输出内容。练习3拓展需求动态列表点击按钮增加条目使用 .map 生成多条 prose 收集为Vec放入flex布局每一条都可以独立选中复制。参考答案#[derive(Default)]structAppState{item_count:usize,}fnapp_logic(state:mutAppState)-implWidgetViewAppStateuse{letitems:Vec_(0..state.item_count).map(|i|prose(format!(列表条目 #{},i1))).collect();flex_col((text_button(增加条目,|s:mutAppState|s.item_count1),text_button(清空条目,|s:mutAppState|s.item_count0),items,))}详细解读通过 (0…state.item_count).map 迭代生成多条prose视图。.collect::Vec_() 收集视图集合flex布局支持直接嵌入Vec作为子节点。每一条 prose 都是独立可选中复制适合动态输出多条结果。思考题问题同样都是显示文字什么时候用label什么时候用prose标准答案解读label标题、简短提示、UI标签不需要复制文本轻量无选择交互。prose日志、输出结果、密钥、正文段落用户有复制文本的需求支持鼠标选中文本。prose会开启文本选择底层逻辑有微小性能开销简单标题优先选择label。八、知识点总结prose(content) 生成可鼠标选中复制的文本视图 label 文本不可复制二者分工明确。参数支持 str 、 String 、 format!() 格式化字符串内部自动转为 ArcStr 。链式修饰 .text_size() 字号、 .text_alignment() 对齐0.4版本暂不支持设置文字颜色。支持换行符 \n 展示多行大段文本可以 .map 批量生成收集为Vec用于动态列表。prose仅用于展示不可编辑需要输入框请使用 text_input 。典型业务场景日志窗口、错误输出、展示密钥、输出报告允许用户复制内容。