Python | How to use multiple kv files in kiw



In this article, we will see how we can use multiple GridLayout as the root widget. In addition to the main kv file, box1.kv ​​, box2.kv and box3.kv are loaded. There are also 2 application variables. These variables are referenced from the main kv file.

  Basic Approach:  1) import kivy 2) import kivyApp 3) import Gridlayout 4) import Builder 5) Set minimum version (optional) 6) Create Layout class 7) Create App class 8) Set up multiple .kv file 9) return Layout / widget / Class (according to requirement) 10) Run an instance of the class 

main .py implementation file:

# Multiple .kv file Python code

 

import kivy 

 
# Your application base class inherits from the application class.
# app: always refers to your application instance

from kivy.app import App

  
# GridLayout arranges children in a matrix.
# It takes up available space and divides
# this is in columns and rows, then it adds
# widgets for the resulting "cells".

from kivy.uix.gridlayout import GridLayout

 
# Builder is a global a Kivy instance
# in widgets that you can use to load others
# kv files in addition to the default files.

from kivy.lang import Builder

 

 
# Download multiple .kv files

Builder.load_file ( `box1.kv` )

Builder.load_file ( `box2.kv` )

Builder.load_file ( `box3.kv` )

 

 
# Create the main kv file class

class main_kv (GridLayout):

pass

 
# Create application class

class MainApp (App):

def build ( self ):

self . x = 150

self . y = 400

return main_kv ()

 
# run the application

if __ name__ = = ` __main__` :

MainApp () .run ()

The main kv file contains a GridLayout with 3 columns … These 3 columns contain different AnchorLayouts. They are all defined in the main.kv file .

Now the main .kv file:

# Create basic .kv files
# the difference is that it is
# Heart of the Application
# Other just organs

 
& lt; main_kv & gt ;:

 

# Assigning grids

  cols: 3

 

# Create AnchorLayout

AnchorLayout:

  anchor_x: `left`

  anchor_y: `center`

  

  # Create canvas

canvas:

Color:

rgb: [ 1 , 0 , 0 ]

Rectangle:

pos: self  . pos

size: self . size

 

Box1:

size_hint: [ None , None ]

  size: [app.x, app.y]

 

AnchorLayout:

anchor_x: `center`

  anchor_y: `center`

  canvas:

Color:

  rgb: [ 0 , 1 , 0 ]

  Rectangle :

pos: self . pos

size: self . size

Box2:

size_hint: [ None , None ]

size: [app.x, app.y]

 

  AnchorLayout:

anchor_x: `right`

  anchor_y: `center`

  canvas:

Color:

  rgb: [ 0 , 0 , 1 ]

Rectangle :

pos: self . pos

size: self . size

Box3:

size_hint: [ None , None ]

size: [app.x, app.y] 

Now, as shown in the Outputs, each grid has different buttons to create buttons. 
in each grid we use different .kv files.

file box1.kv ​​—

# Create 1st .kv file

 
& lt; Box1 @ BoxLayout & gt ;:

Button:

text: `B1a`

Button:

text: `B1b`

file box2.kv —

# Create 2nd .kv file

 
& lt; Box2 @ BoxLayout & gt ;:

Button:

text: `B2a`

  Button:

text: `B2b`

file box3 .kv —

# Create 3rd .kv file

 
& lt; Box3 @ BoxLayout & gt ;:

Button:

text:  `B3a`

  Button:

text: `B3b`

Output: