前一期大師兄介紹了扣子平臺組件的兩種狀態“禁用”和“加載”。這兩種方法使控件可以通過簡單設置表示出更多的運行狀態。今天大師兄將詳細介紹控件的一種事件“聚焦”。
扣子(coze)編程
「極簡」扣子(coze)教程 | 小程序UI設計進階 II!讓系統動起來,“禁用”,“加載”狀態設置
「極簡」扣子(coze)教程 | 小程序UI設計進階!控件可見性設置
「極簡」扣子(coze)教程 | 3分鐘學會小程序UI設計!從零開始創建頁面和瓷片按鈕
「極簡」扣子(coze)教程 | 老司機秘籍,扣子調試實踐II ,錯誤信息讀取及定位
「極簡」扣子(coze)教程 | 成為老司機的秘籍,扣子調試實踐 I
「極簡」扣子(coze)教程 | 一篇講透“變量聚合” 節點,讓輸入更靈活!
「極簡」扣子(coze)教程 | 細節決定成敗!這個小功能讓用戶滿意度飆升,講的太細了
「極簡」扣子(coze)教程 | 添加插件的另一種方法,上百款插件一鍵添加,快速擴展你的應用功能!
「極簡」扣子(coze)教程 | 上百款插件一鍵添加,快速擴展你的應用功能!
做小程序不求人 | ?零代碼神器!0基礎秒做專業級App智能體,字節扣子平臺抄詳細實操紀實
打工人變現新賽道 | 原來做智能體這么簡單,5分鐘0代碼,草履蟲實例 ?【快來學】
「驚覺」未來打工人標配 | 史上第二易懂智能體編程指南來了, 5分鐘飛書扣子編程實例 【快收藏】
概念介紹
這里先要介紹一下“聚焦”的概念。這個概念在大師兄讀大學時用微軟Visual Studio工具進行VC++,VB桌面軟件編程的時候就有了。得有至少二十多年的額歷史。英語是focus。
在UI界面編程時界面上有許多的“組件”。雖然看起來這些組件是同時運行的。但系統同一時間只有一個控件能夠接受用戶的輸入信息。可以是一個按鈕的點擊,也可以是輸入框的輸入。
在組件進行輸入之前必須先獲得“焦點”。?
舉一個比較典型的例子:界面上有兩個輸入框,但是鍵盤輸入只能輸入到其中一個框。這種情況,我們一般會先點擊需要輸入的框。點擊時候這個框就獲得了焦點。
這個獲得焦點的事件就是“聚焦”。
“聚焦事件”
打開扣子平臺,我們在界面上點擊每個組件,查看這個事件。我們的UI上現在有三種組件。
TextArea輸入框
markdown輸出框
Button 按鈕
可以看到只有TextArea輸入框是有這個事件的。相比于其他平臺扣子的組件做了簡化,只有輸入框能處理這個事件。
添加事件
我們給輸入框添加一個“聚焦”事件。在用戶點擊這個組件的時候向用戶發出提示信息“請輸入鏈接或內容”。
提示類型
“展示提示內容”一共有三種類型 “成功”,“失敗”,“普通”。這代表了三種表現形式。我們選擇的是普通。下面顯示另外兩種選擇的顯示內容。
成功
失敗
配置
按照下圖配置,時長表示提示顯示的時間。單位是毫秒,3000毫秒就是3秒。
預覽
界面右上角點擊預覽,看效果。
大師兄帶你刨科技
可以看到點擊輸入框,有提示彈出。?
但是等提示消失了,再點擊輸入框就不會再彈出了。
這是因為這個事件表示的是“焦點”切換的過程。如果“焦點”一直在這個組件上,自然就沒有這個切換的過程了。事件也就不會觸發。
在視頻最后先點擊下面的輸出框,再點擊輸入框,就又可以看到提示了。再一次證明這個事件是在“焦點”切換過程中產生的。
歷史文章檢索:
扣子(coze)編程
「極簡」扣子(coze)教程 | 小程序UI設計進階 II!讓系統動起來,“禁用”,“加載”狀態設置
「極簡」扣子(coze)教程 | 小程序UI設計進階!控件可見性設置
「極簡」扣子(coze)教程 | 3分鐘學會小程序UI設計!從零開始創建頁面和瓷片按鈕
「極簡」扣子(coze)教程 | 老司機秘籍,扣子調試實踐II ,錯誤信息讀取及定位
「極簡」扣子(coze)教程 | 成為老司機的秘籍,扣子調試實踐 I
「極簡」扣子(coze)教程 | 一篇講透“變量聚合” 節點,讓輸入更靈活!
「極簡」扣子(coze)教程 | 細節決定成敗!這個小功能讓用戶滿意度飆升,講的太細了
「極簡」扣子(coze)教程 | 添加插件的另一種方法,上百款插件一鍵添加,快速擴展你的應用功能!
「極簡」扣子(coze)教程 | 上百款插件一鍵添加,快速擴展你的應用功能!
做小程序不求人 | ?零代碼神器!0基礎秒做專業級App智能體,字節扣子平臺抄詳細實操紀實
打工人變現新賽道 | 原來做智能體這么簡單,5分鐘0代碼,草履蟲實例 ?【快來學】
「驚覺」未來打工人標配 | 史上第二易懂智能體編程指南來了, 5分鐘飛書扣子編程實例 【快收藏】
AI編程與系統
20年經驗程序員被AI踢館現場!AI時代職場危機應對
大師兄數字生命崛起 | 騰訊元器五分鐘零成本集成”公眾號文章問答“
辦公&圖文創作
立夏爆款!咸魚最新副業山水藏字接單到手軟,工具免費,附保姆級教程
為什么 DeepSeek 復制總帶奇怪符號?| 解密AI時代的基礎語言markdown
DeepSeek又抽風? | 5.1假期必備,一口氣10個DeepSeek 穩定滿血入口清單 【快收藏】
90%人不知道的功能 | 飛書多維表格批量自動爬取網上信息,0基礎5分鐘打造全自動信息加工廠實操【快來試】
一張海報=一部電影 | 一鍵帶你重回電影的黃金年代,即夢3.0讓人人都成為海報設計師
信息爆炸時代,怎么能不會這招 | 倍速吸收信息的秘密武器,阿里通意AI,送AI時代擇業指南
何止提效10倍,全自動小紅書卡片生產攻略 | 只需3步,DeepSeek+多維表格 【先進生產力收藏】
離譜!凌晨保險代理跟我卷AI | 5分鐘頂你一天的小紅書卡片模板批量生成
清華動手反制美國!又一個國產deepseek時刻?| 能自己動手查資料的智譜“沉思”完整測試
還在用Mermaid+Napkin?| 3步,讓大老板深深記住你的名字,制作現場限時公開 【速轉家人】
老板露出了贊賞的笑容 | 這個AI繪圖神器,讓你的 PPT 秒殺麥肯錫,免費 【建議收藏】
只知道Mermaid? 這款獨自與visio抗衡20年的免費軟件竟讓deepseek的生圖效率再翻倍 【建議收藏】
廢物簡歷秒變HR心動款!Deepseek教你3步改出必過簡歷 ?【建議收藏】
踩坑又踩坑 | 做到這些才能效率翻10倍!用deepseek三分鐘繪制各種圖表(建議收藏)
別再用KimiPPT助手了 | 比較了三個AI工具后大師兄給牛馬的忠告
大師兄登錄小紅書 | ?跟著大師兄學 AI 圖文筆記,小紅書創作不求人
搶救褪色記憶!手殘黨福利,AI三步修復老照片
三八婦女節海報設計0成本!用AI工具2步生成精美海報?0基礎也能秒懂
體制人必看:DeepSeek智能改稿的3大禁忌與3個提效密碼
特朗普VS澤連斯基刷屏 | 別被碎片化信息騙了!這才是AI分析特朗普事件的正確姿勢
DeepSeek:選對模型,效率翻倍。 ? 送Deepseek清華AI 5件套
文檔系列
小紅書/Tiktok運營秘籍 | 《大任智庫DeepSeek+ 外經貿企業創新突圍講義精華全版》
他為中央政治局第二十次集體學習演講 | 鄭南寧院士《科技賦能教育》
13所大學Deepseek公開課,一次拿走 | 更新浙大第2季《AI大模型如何破局傳統醫療 》
不花錢請家教!秘塔這個AI免費功能讓學習效率翻倍 | AIGC技術賦能教育數字化轉型
未來教育風向標 | 教育學頂流985高校,華東師范大學《AIGC技術賦能教育數字化轉型的機遇與挑戰》,13所大學deepseek
中美博弈又添籌碼,AI模型差距只剩千分之三 | 455頁斯坦福2025 AI指數報告全新出爐,附文檔免費下載及中文通意輔讀工具
沒有更全的了,免費拿走 | 12所大學Deepseek公開課,更新至浙大第2季《智能金融:AI 驅動的金融變革》
Deepseek公開課,不能再全了 | 中山大學 《從技術突破到場景落地:大模型發展圖譜與DeepSeek創新應用》。
一次下載10個大學的Deepseek系列課 | 更新至哈工大,《從圖靈測試到DeepSeek》 82頁
清華大學 | 1-14 全網最全合集,《邁向未來的AI教學實驗》369頁爆肝呈現 ?【快收藏】
【免費下載】清華大學Deepseek系列之第九篇 |《DeepResearch應用報告》 ?【建議收藏】
【免費下載】政務七連發 |《北京“數據要素x”典型案例 》《智慧城市大腦建設方案》 【建議收藏】
【免費下載】制造業數字化兩件套 | 《德勤制造業人工智能創新應用發展報告》《中國制造企業數字化轉型白皮書》
【免費下載】清華廈大deepseek學術王炸兩件套
給被315晚會扎心的朋友們補補血 | 《2024年宇樹科技商業計劃書》【免費下載】
【免費下載】阿里巴巴全域數據中臺 | 華為數據中臺建設路徑:筑夢數字化未來之路
【免費下載】小朋友再不學AI就來不及啦 | “少年商學院|DeepSeek中小學生使用手冊(83頁)”
[免費下載]浙江大學DeepSeek系列公開課:智能時代的全面到來和人機協作的新常態(含視頻課
這一回不要羨慕別人了,快來取 | ?北京大學:DeepSeek與AIGC應用
AI五分鐘科普
快轉給爸爸 | 從平面到動畫,5分鐘零基礎為小棉襖打造屬于自己的迪斯尼魔法回憶
5分鐘!| 早讀課偷偷哼歌被表揚!這招讓<出師表>秒變洗腦神曲無需安裝!5 分鐘體驗 AI 文生圖魔法(內有豆包安裝方法)
AI新聞
「解讀」IT新聞 | 微軟裁員 6000 人背后:兩次親身體驗暴露的必然性,活該還是無奈?
AI 時代,你的工作會被取代嗎?| 如何重塑AI時代的個人價值
馬拉松新紀元:冠軍只是開始,這些「翻車」畫面才是重點,機器人馬拉松比賽帶來的機器人AI賽道的思考
「好奇」從實驗室到獨角獸 | 人工智能路演現場直擊
東大反制速度震驚白宮幕僚!| 川普關稅清單竟被AI秒破解?
這5條愚人節AI生成的假新聞你有沒有中招 ?【快轉給中招的朋友】
“4月1號,朋友圈一定要這樣發”
四大 AI 聯合打造 315 晚會曝光清單,這些信息不容錯過!
英特爾首次換上華人CEO | AI你怎么看
特朗普VS澤連斯基刷屏 | 別被碎片化信息騙了!這才是AI分析特朗普事件的正確姿勢