GridLayout isn't working properly in .kv file - python-3.x

Question

I'm very new at Kivy. I'm following an example at kivy docs where I came across this following code. bBut it's not working properly.
first.py
from kivy.app import App
from kivy.uix.gridlayout import GridLayout
class LoginScreen(GridLayout):
pass
class MyApp(App):
def build(self):
return LoginScreen()
if __name__ == '__main__':
MyApp().run()
my.kv
#:kivy 2.0
<LoginScreen>:
f_username: username
f_password: password
GridLayout:
rows: 2
cols: 2
padding: 10
spacing: 10
Label:
text: "Username"
TextInput:
id: username
multiline: False
Label:
text: "Password"
TextInput:
id: password
password: True
multiline: False
This code works fine if i remove the LoginScreen class from both kivy and python file. Like
class MyApp(App):
def build(self):
return
and
#:kivy 2.0
f_username: username
f_password: password
GridLayout:
rows: 2
...
Can anyone help me to figure out what's happening?

Answer 1

class LoginScreen(GridLayout):
pass
This means that when you create an instance with the LoginScreen class, the instance becomes GridLayout.
# GridLayout
<LoginScreen>:
f_username: username
f_password: password
# Another GridLayout!
GridLayout:
...
The LoginScreen is already based on GridLayout, but you are trying to add another gridlayout to the class. In this case, rows and cols are not defined on the outmost gridlayout.
#:kivy 2.0
<LoginScreen>:
f_username: username
f_password: password
rows: 2
cols: 2
padding: 10
spacing: 10
Label:
text: "Username"
TextInput:
id: username
multiline: False
Label:
text: "Password"
TextInput:
id: password
password: True
multiline: False
Removing the duplicate layout will fix the problem.