Kotlin Practice #8 Compose Todo List與DataStore

Dogpa Chen
4 min readFeb 21, 2023

上一篇完成了Lazy Column的點擊事件,對於列表的點擊有了新的認識。

而這篇則要練習建立一個簡單的Todo List,主要是要理解在Compose要如何在本機儲存機料並使用類似MVVM的架構,將待辦事項儲存於手機,使使用者可以在下次開啟時能持續看見資料。

這次練習僅練習新增資料,刪除/修改/更新就暫時Pass。

TodoViewModel:

於此建立檢視的待辦字串List與List存入手機與取出的方法。

暫且的認知是第9行資料需要透過mutableStateListOf建立List,始之可以被觀察。

  private var dataStoreTodoList = mutableStateListOf<String>()

TodoListView:

在此建立一個輸入的TextField與送出的Button,另外創建LazyColumn來顯示待辦事項。在這邊建立ViewModel透過remember的方式監聽改變。

 val todoViewModel by remember { mutableStateOf(TodoViewModel(context)) }

另外透過

val todoString = rememberSaveable { mutableStateOf("") }

建立TextField輸入的值。

MainActivity:

最後就是在MainActivity內加入剛剛建立的TodoListView

成果確認:

心得:

從網路資源上得知SharePreference基本上不再適用於Compose,所以勢必要有新的方法來對簡單資料進行存取,而DataStore與ProtoData就是一個新的方式。又多學到一個知識點,持續加油!!

參考資源:

--

--