Kivyのsize_hintの使い方。ウィジェットのサイズを設定・取得する【kv言語】

Kivyのsize_hintプロパティとsizeプロパティの使い方を説明します。画面領域に対するウィジェットサイズは自動で行われますが、明示的にウィジェットのサイズを指定したい時に便利です。また、親や子ウィジェットのサイズを取得する方法も説明します。

Contents

size_hintプロパティでウィジェットの大きさを指定する
1. ウィジェットのサイズを固定化したい場合
個別で設定する
sizeプロパティでウィジェットのサイズを指定する
ウィジェットサイズを取得する

size_hintプロパティでウィジェットの大きさを指定する

size_hintはWidgetクラスのプロパティでウィジェット共通で使用できます。ウィジェットの幅や高さを親ウィジェットに対する割合で指定したい時に使います。画面サイズを変更するとKivyが自動でウィジェットの割合を判断して自動調節してくれますが、割合を明示的に指定したい場合に便利です。

size_hintの引数は[width_hint, height_hint]です。割合は0～1で指定し、1が100％になります。0の場合は0またはNoneで指定します。この場合は最小値のデフォルト値が適用されます。

width_hint：幅を親ウィジェットの幅に対する割合で指定。
height_hint：高さを親ウィジェットの高さに対する割合で指定。

親ウィジェットは通常レイアウトを指します。

デフォルトは[1,1]で、ウィジェットが1つの場合は画面領域全体をウィジェットが埋め尽くします。レイアウトのpaddingやspacingを設定していた場合はその数値を除いた領域で計算されます。

size_hint: 1, 0.5

上記は幅を100％、高さを50％に設定しています。

片方だけ0またはNoneにすることもできます。この場合はsize_hint _minが適用されます。size_hint _minはウィジェット最小の幅や高さになります。デフォルト値はわかりませんが、最小の値を設定したい場合はこちらも設定します。

size_hint: 1, 0
#または
size_hint: 1, None

上記は幅を100％、高さを最小値に設定しています。

size_hint: 0, 0
#または
size_hint: None, None

両方0またはNoneに設定すると最小の幅と高さになります。

ウィジェットのサイズを固定化したい場合

Kivyに自動調整されたくない場合は、ウィジェットのサイズを固定することもできます。

size_hintをNoneに設定し、widthまたはheightを併用して設定します。heightまたはwidthはウィジェットサイズを設定でき、単位はピクセルになります。この両方のプロパティを設定することで、size_hintをNoneにした場合の最小値がwidthまたはheightの値になります。そのためウィジェットを固定化することができます。

size_hint: 1, None
height: 100

上記は幅100％、高さを100に固定しました。これで画面サイズを変更してもウィジェットの高さは変更されません。

ウィジェットの幅と高さの両方を固定する場合は、後述するsizeプロパティを併用します。

 size_hint: None, None
 size: 100, 50

上記は幅を100，高さを50に固定しました。

size_hintでは幅と高さの両方を同時に設定しますが、幅や高さだけ設定したり最小値を設定することも可能です。

個別で設定する

Kivyの自動調整の利点を活かして変更したい設定だけ変えた方がいい場合もあります。

幅/高さ

size_hint_x: 0.5

width: 200

size_hint_xはウィジェットの幅を設定します。固定化したい場合はNoneにし、widthと併用します。

size_hint_y: 0.7

height: 200

size_hint_yはウィジェットの高さを設定します。固定化したい場合はNoneにし、heightと併用します。

ウィジェットの最小値を設定する

デフォルトで単位はピクセルになります。

size_hint_min_y: 100

size_hint_min_yはウィジェットの最小幅を設定します。

size_hint_min_x: 100

size_hint_min_xはウィジェットの最小の高さを設定します。

ウィジェットの最大値を設定する

size_hint_max_y: 500

size_hint_max_yはウィジェットの最大の幅を設定します。

size_hint_max_x: 500

size_hint_max_xはウィジェットの最大の高さを設定します。

sizeプロパティでウィジェットのサイズを指定する

size_hintは割合で設定していたのに対しsizeプロパティは widthとheightの数値で指定します。

size_hint: None, None
size: 100、200

sizeは[width,height]で指定します。size_hint: None, Noneの記述が必要です。

ウィジェットサイズを取得する

ウィジェットのサイズを取得する方法をいくつか紹介します。親のサイズや他のウィジェットのサイズを基準にして計算したい場合などに便利です。

kvコードで自身のウィジェットのサイズを取得する

kvコードで自身のウィジェットを取得するにはselfキーワードを使います。

Button:
    size_hint: None, None # この記述は必要
    size: self.size

上記のようにsizeに自身のサイズを設定してもエラーにはになりませんが、おそらく最小のボタンサイズになると思います。

通常は引数で渡したり、自身のサイズをtextに表示するなどで使います。

Button:
    size_hint: 1, 0
    text: str(self.size)
    on_press: callback_function(self.size)

kvコードで他のウィジェットのサイズを取得する

kvコードで他のウィジェットのサイズを取得するにはidを使用します。

Label:
    id: label
    text: 'text'
    size : 100，100
Button:
    text: 'text'
    size_hint: None, None # この記述は必要
    size: label.size

上記ではLabelとButtonを同じサイズにしています。

kvコードで親のサイズを取得する

kvコードで親のサイズを取得するにはparentキーワードを使います。

size_hint: None, None # この記述は必要
size: (int(self.parent.width * 0.1), int(self.parent.height * 0.1))

上記では親のサイズ（例えばレイアウトサイズまたはウィンドウサイズ）の10％を幅と高さに設定しています。

Pythonコードで子のウィジェットのサイズを取得する

ルートウィジェットは親になるので、そのツリーに構成されているウィジェットは子になります。子ウィジェットはchildrenのリストで一括で取得することが可能です。

for child in self.children:
    print(f"Child {child.text} size: {child.size}, pos: {child.pos}")

childrenは下記のようなリストになっているのでfor文で展開します。オブジェクトを代入した一時変数を使って、ウィジェットのプロパティを取得できます。

[<kivy.uix.label.Label object at 0x000002A2F9CB9400>, <kivy.uix.label.Label object at 0x000002A2EED82C80>, <kivy.uix.label.Label object at 0x000002A2EED80590>, <kivy.uix.label.Label object at 0x000002A2EED6DE10>, <kivy.uix.label.Label object at 0x000002A2EED63690>, <kivy.uix.label.Label object at 0x000002A2EED61080>, <kivy.uix.button.Button object at 0x000002A2EED3E040>]

個別に子ウィジェットのサイズを取得したい場合は、idsの名前空間で取得します。

print(f"Child size: {self.ids.button.size}, pos: {self.ids.button.pos}")

Pythonコードで親のサイズを取得する

ルートウィジェットは親であり、自身を指すのでselfキーワードを使用します。

print(f"Parent size: {self.size}, pos: {self.pos}")

これらの例を使用したサンプルコードを下記の記事で紹介しています。