技術分享 | AWTK 開源串口屏開發(fā)(8) - 系統(tǒng)設置

系統(tǒng)設置是一個必需的功能，AWTK 串口屏的默認模型提供一些系統(tǒng)設置相關的屬性和命令，實現(xiàn)系統(tǒng)設置非常簡單。本文介紹一下音量、背光、時間和觸屏音等常見系統(tǒng)設置的實現(xiàn)方法。

系統(tǒng)設置只是一個普通應用程序，不過它會用默認模型中一些內置的屬性和命令，所以這里專門來介紹一下。

1. 功能

在這個例子會用到默認模型中一些下列內置的屬性和命令：

內置屬性

內置命令

2. 創(chuàng)建項目

從模板創(chuàng)建項目，將 hmi/template_app 拷貝 hmi/settings 即可。

最好不要放到其它目錄，因為放到其它目錄需要修改配置文件中的路徑，等熟悉之后再考慮放到其它目錄。路徑中也不要中文和空格，避免不必要的麻煩。

3. 制作界面

用 AWStudio 打開上面 settings 目錄下的 project.json 文件。

里面有一個空的窗口，在上面加入下面的控件，并調節(jié)位置和大小，做出類似下面的界面。

再創(chuàng)建一個新窗口，命名為 basic，并加入下面的控件，并調節(jié)位置和大小，做出類似下面的界面。

再創(chuàng)建一個新窗口，命名為 rtc，并加入下面的控件，并調節(jié)位置和大小，做出類似下面的界面。

需要給編輯器設置輸入類型、最大值和最小值。實際項目可能會用文本選擇控件代替編輯器，不過綁定方法是一樣的。

3. 添加綁定規(guī)則

3.1?主界面?(home_page)

將?基本設置?按鈕的?點擊?事件綁定到?navigate?命令。添加自定義的屬性?v-on:click，將值設置為?{navigate, Args=basic}。

將?時間設置?按鈕的?點擊?事件綁定到?navigate?命令。添加自定義的屬性?v-on:click，將值設置為?{navigate, Args=rtc}。

命令和參數(shù)要用英文大括號括起來。

3.2?基本設置?(basic)

將?背光滑動條?綁定到?backlight?變量。添加自定義的屬性?v-data:value，將值設置為?{backlight}。

將音量滑動條?綁定到?audio_volume?變量。添加自定義的屬性?v-data:value，將值設置為?{audio_volume}。

將?開啟屏幕音?綁定到?ui_feedback?變量。添加自定義的屬性?v-data:value，將值設置為?{ui_feedback}。

讓?確定?按鈕的?點擊?事件執(zhí)行命令 “{save}”。添加自定義的屬性?v-on:click，將值設置為：

{save, CloseWindow=true}

CloseWindow=true，表示執(zhí)行命令并關閉當前窗口。

命令和參數(shù)要用英文大括號括起來。

同樣指定窗口的模型為 default。

3.3?時間設置?(rtc)

將?年 編輯器?綁定到?rtc_year?變量。添加自定義的屬性?v-data:value，將值設置為?{rtc_year}。

將?月 編輯器?綁定到?rtc_month?變量。添加自定義的屬性?v-data:value，將值設置為?{rtc_month}。

將?日 編輯器?綁定到?rtc_day?變量。添加自定義的屬性?v-data:value，將值設置為?{rtc_day}。

將?時 編輯器?綁定到?rtc_hour?變量。添加自定義的屬性?v-data:value，將值設置為?{rtc_hour}。

將?分 編輯器?綁定到?rtc_minute?變量。添加自定義的屬性?v-data:value，將值設置為?{rtc_minute}。

將?秒 編輯器?綁定到?rtc_second?變量。添加自定義的屬性?v-data:value，將值設置為?{rtc_second}。

讓?獲取時間?按鈕的?點擊?事件執(zhí)行命令 “{get_rtc}”。添加自定義的屬性?v-on:click，將值設置為：

{get_rtc}

命令和參數(shù)要用英文大括號括起來。

讓?設置時間?按鈕的?點擊?事件執(zhí)行命令 “{set_rtc}”。添加自定義的屬性?v-on:click，將值設置為：

{set_rtc}

命令和參數(shù)要用英文大括號括起來。

讓?返回?按鈕的?點擊?事件執(zhí)行命令 “{nothing}”。添加自定義的屬性?v-on:click，將值設置為：

{nothing, CloseWindow=true}

nothing 是一個特殊命令，表示什么也不做。

CloseWindow=true，表示執(zhí)行命令并關閉當前窗口。

命令和參數(shù)要用英文大括號括起來。

同樣指定窗口的模型為 default。

4. 初始化數(shù)據(jù)

修改資源文件 design/default/data/default_model.json, 將其內容改為：

{ ?"ui_feedback":true, ?"audio_volume":60, ?"backlight":60}

注意：如果文件內容有中文（非 ASCII 字符），一定要保存為 UTF-8 格式。重新打包資源才能生效。

5. 描述需要持久化的數(shù)據(jù)

修改資源文件 design/default/data/settings.json, 將其內容改為：

{ ? ?"name": "hmi_settings", ? ?"persistent": { ? ? ? ?"ui_feedback": true, ? ? ? ?"audio_volume": true, ? ? ? ?"backlight": true ? ?}}

如果有多個數(shù)據(jù)需要持久化，將它們加入到 settings 對象中即可。為了避免不同串口屏應用程序之間，持久化數(shù)據(jù)覆蓋，這里的 name 需要取一個唯一的名字。

注意：如果文件內容有中文（非 ASCII 字符），一定要保存為 UTF-8 格式。重新打包資源才能生效。

6. 編譯運行

運行 bin 目錄下的 demo 程序。

程序退出時會自動保存需要保存的數(shù)據(jù)。

7. 注意

本項目并沒有編寫界面相關的代碼，AWStudio 在 src/pages 目錄下生成了一些代碼框架，這些代碼并沒有用到，可以刪除也可以不用管它，但是不能加入編譯。