KivyのCheckBoxがチェック部分のみであることの問題
KivyのCheckBoxはチェック部分のみであり、その横にテキストを表示するにはLabelなどを配置する必要があります。このため、チェック部分とテキストとは連動しておらず、そのままではテキスト部分をクリックしてもチェック部分の表示は変わりません。
CheckBoxのチェック部分は小さく、反応する範囲にカーソルを移動させるのが手間になりますので、チェック部分横のテキストをクリックしてもチェック部分の表示が変わるようにします。（プログラムが冗長にならないように、この作業はKv language側で実施）
CheckBox横のテキストでもチェック状態を変更する
CheckBox横のテキストでチェック部分を変更するには、以下の作業をおこないます。
1. テキスト部分をButtonで作成する。
・Buttonの背景色は、背景と同じ色にする。
・Buttonのテキスト位置を調整する。
2. Buttonのon_pressイベントでのCheckBoxの状態(state)の変更を指定する。
それぞれの作業は、以下のとおりです。
1. テキスト部分をButtonで作成する。
Buttonの背景色は、背景と同じ色にする。
以下では、Buttonの背景色を黒色に設定しています。通常、Buttonの背景色にはデフォルトのテクスチャ（灰色）がついていますので、background_normal: ”を指定することでデフォルトのテクスチャ（灰色）を外します。テクスチャを外しておかないと、Buttonの部分が背景よりも暗い色になります。
Button:
text: 'Change'
text_size: self.size
halign: 'left'
valign: 'middle'
background_color: 0, 0, 0, 1
background_normal: ''Buttonのテキスト位置を調整する。
以下では、Buttonのテキストの記入位置を幅方向は左揃え(left)の高さ方向を中央(middle)に指定しています。これらの配置プロパティを有効にするために、テキストを配置する境界ボックスのサイズを指定する text_size: self.size を記入しています。
Button:
text: 'Change'
text_size: self.size
halign: 'left'
valign: 'middle'
background_color: 0, 0, 0, 1
background_normal: ''Buttonのon_pressイベントでのCheckBoxの状態(state)の変更を指定する。
on_pressイベントでCheckBoxのstateを変更するために、以下の青字のように記入します。
①の部分では、CheckBox(root.ids.check)の状態(state)が’nomal’の場合は、CheckBoxの
状態を’down’に変更することを指定しており、
②の部分では、’down’の場合は、CheckBoxの状態を’nomal’にすることを指定しています。
Button:
text: 'Change'
text_size: self.size
halign: 'left'
valign: 'middle'
background_color: 0, 0, 0, 1
background_normal: ''
on_press:
if root.ids.check.state == 'normal':root.ids.check.state='down' # ①
else: root.ids.check.state = 'normal' # ②サンプルプログラム
以下のサンプルプログラムは、CheckBoxの状態をCheckBox横に配置したテキスト（Button）でも変更可能にしたものです。
プログラムを実行すると、左図のような画面が表示されます。図中のChecBoxの状態はその横のテキスト’Change’をクリックしても変更されます。
# -*- coding: utf-8 -*-
import kivy
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.lang import Builder
from kivy.config import Config
kivy.require('2.2.0')
Config.set('graphics', 'width', '300')
Config.set('graphics', 'height', '100')
Builder.load_string('''
<MainD>
BoxLayout:
size: root.size
padding: 20
CheckBox:
id: check
Button:
text: 'Change'
text_size: self.size
halign: 'left'
valign: 'middle'
background_color: 0, 0, 0, 1
background_normal: ''
on_press:
if root.ids.check.state == 'normal':root.ids.check.state='down'
else: root.ids.check.state = 'normal'
''')
class MainD(Widget):
def __init__(self, **kwargs):
super(MainD, self).__init__(**kwargs)
class MainDApp(App):
def __init__(self, **kwargs):
super(MainDApp, self).__init__(**kwargs)
self.title = 'CheckButton Test'
def build(self):
return MainD()
if __name__ == '__main__':
app = MainDApp()
app.run()
