正文

就網(wǎng)絡和應用程序而言，鍵盤快捷鍵很重要，今天我們要談的便是讓這類快捷鍵得以在Flutter運作的小部件：Focus、Shortcuts和Action。

這套系統(tǒng)中的第一個小部件是Focus,小部件樹中到處都有它的蹤跡，包括按鈕個文本輸入在內(nèi)之類的用戶界面交互區(qū)塊

FocusNode對象

這個小部件還包含F(xiàn)ocusNode對象

Focus({
    FocusNode? node,
    Widget? child,
}) : node = node ?? FocusNode();

其作用是指示Flutter用戶交互理應在代碼中出現(xiàn)的位置。

整體而言。這個Focus小部件的網(wǎng)絡及所屬的FocusNode會在您的Flutter應用中構(gòu)成另一名為Focus樹的結(jié)構(gòu)

對此首先要知道的是節(jié)點永遠被視為是作用中的，那作用中的FocusNodes有何涵義呢？

這代表實體鍵盤輸入這類的系統(tǒng)特殊事件，會首先出現(xiàn)在Focuss小部件中，當中的FocusNode且在向頂部結(jié)構(gòu)送出推播通知錢都會維持作用中的狀態(tài)。

小部件樹向上傳送時會起到怎樣的作用呢

當這些按鍵事件于小部件樹向上傳送時會起到怎樣的作用呢？

這些事件會搜尋按鍵所對應的Shortcuts小部件并將之轉(zhuǎn)為意圖對象（intent），該對象起于作用中的FocusNodes并會持續(xù)朝應用程序頂部浮現(xiàn)。

至于Focus小部件，其實Flutter框架所屬的按鈕和文本輸入之類的交互控件皆已包含所需的Focus小部件，不過哦有時候若您想要從頭規(guī)劃用戶體驗，可能就會想自行添加。

例如樣式的折疊卡片accordion，標題應以焦點處理設為Focusable，藉此顯示鍵盤快捷指令來切換面板的可見性。

要這樣做，得使用Accordion標題小部件，并將其子級包裝在Focus小部件中,這是要為accordion小部件自定義鍵盤快捷鍵的第一步

Accordion(
    children: <Widget>[
        Header(
            child: Focus(
                child: Text('Section 1'),
            ),
        ),
        Section1Body(),
    ],
)

請繼續(xù)鎖定作為第二和第三步，Shortcuts和Actions小部件的后續(xù)介紹

如果想了解有關(guān)Focus的內(nèi)容，或者關(guān)于Flutter的其他功能，請訪問flutter.dev

以上就是Flutter Widget開發(fā)之Focus組件圖文詳解的詳細內(nèi)容，更多關(guān)于Flutter Widget Focus組件的資料請關(guān)注腳本之家其它相關(guān)文章！

最新評論