kivyMDでのListViewとAdapter

はじめに

kivyMDでのListViewの日本記事が私の見た限りなかったので書くよ。
完全初学者なので間違ってるところがあったらコメントお願いします🙏

追記:コード間違ってたので訂正しときました。

ListViewとAdapterってなんぞや

https://high-programmer.com/2017/07/18/android-studio-adapter/
Adapterとは、SpinnerやListViewといったリストを扱うウィジェットで使用されます。
javaプログラムでリストの項目を動的に生成し、リストに入れる際の橋渡しの役割を持ちます。
Spinnerを例にしたプログラムが以下です。

だそうです
よくわかんないと思うので見たほうが速いです。

とりあえずListView

test1.py

from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.properties import ObjectProperty, StringProperty
from kivy.uix.boxlayout import BoxLayout
from kivymd.navigationdrawer import NavigationLayout
from kivymd.list import OneLineAvatarListItem, ILeftBody
from kivy.factory import Factory

Builder.load_string(
"""
<MainWindow@BoxLayout>
    orientation:"vertical"
    ScrollView:
        do_scroll_x: False
        MDList:
            TwoLineListItem:
                text: 'hello!'
                secondary_text: 'hogeee'


            TwoLineListItem:
                text: 'hello!222'
                secondary_text: 'hugaaaa'
""")

class MainApp(MDApp):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)

    def build(self):
        self.root = Factory.MainWindow()

if __name__ == "__main__":
    MainApp().run()

（.kvファイルと分けて書いてもいいです）
これを実行してみると

いいですね

コードの説明としては
ScrollViewでスクロールできるようにする。x方向のスクロールをFalse.
その中にMDList ここにList置くよーってやつ
その中にTwoLineListItem これは2行のリストアイテム。
んでtextとsecondary_text。

(ちなみにOneLineListItemとかもあるよ)

https://github.com/HeaTTheatR/KivyMD/blob/master/demos/kitchen_sink/main.py

でもこれだと追加したり消去したりができないですよね？
そんなときにAdapterの登場です。

ListViewとAdapter

本題。
とりあえずそーすこーど。

test2.py

from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.properties import ObjectProperty, StringProperty
from kivy.uix.boxlayout import BoxLayout
from kivymd.navigationdrawer import NavigationLayout
from kivymd.list import OneLineAvatarListItem, ILeftBody
from kivy.factory import Factory
from kivymd.list import TwoLineListItem

# Builder.load_file("kvfile.kv")
Builder.load_string(
"""
<MainWindow@BoxLayout>
    orientation:"vertical"
    ScrollView:
        do_scroll_x: False
        MDList:
            id:listview

#Adapter
<CustomAdapter>
    text: root.text
    secondary_text: root.secondary_text
""")

class CustomAdapter(TwoLineListItem):
    text = StringProperty()
    secondary_text = StringProperty()

class MainApp(MDApp):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)

    def build(self):
        self.root = Factory.MainWindow()
        #ListViewをセット！
        self.setListView()

    def setListView(self):
        textList = ["fooo","hogeee","hugaaa"]
        subtextList = ["hello","fooaa","apple"]
        #itemをせっと。
        for text,subtext in zip(textList,subtextList):
            self.root.ids.listview.add_widget(
                CustomAdapter(
                    text=text,
                    secondary_text=subtext
                )
            )


if __name__ == "__main__":
    MainApp().run()

動かしてみる。

いいですね。

コードの説明

MDListにid:listviewをつけてidsで呼び出せるようにします。
<CustomAdapter>でアダプターのレイアウトを作ります。ここの変数は、pythonコードのclass CustomAdapter(T...と同じにしてください。

class CusttomAdapter(...はどう説明すればいいかわからないので飛ばします。ちなみにここでクリックの動作とかできます。

def setListView(...ここにセットするものを書きます。
今回はtextとsecondary_textで分けましたが、一つのListとかでもいいです。臨機応変に。

for文で一つづつ取り出して、self.root.ids.listview.addwidget()でlistviewにaddしていきます。
CustomAdapter(tex...は、さっき書いたclassです。ここにid=<なにか>って書いたらid指定できます。

クリックの動作

クリックしたらクリックしたテキストをトーストで出してみる。
コードはさっき書いたtest2.pyに付け加える。

from kivymd.toast.kivytoast.kivytoast import toast

トーストモジュールを追加。

class CustomAdapter(TwoLineListItem):
    text = StringProperty()
    secondary_text = StringProperty()
    #=====追記======
    def on_press(self):
        toast(self.text)
    #===============

これで実行。

いいですね。

眠くなってきたので今回はここまで。

参考