I'm trying to use ScrollView widget to show multiple lines scroll in the screen. But the lines don't scroll. The text that should scroll is "myList" label in the screen_second.
The idea is to click on button 1, which directs the user to the second screen, and at that moment a list will be generated that should appear in the center of the second screen.
However, the list will be too many lines and therefore must scroll on the screen.
But the list is static. It's not rolling.
This is the kv file: myform.kv:
<ScreenManagement>:
ScreenFirst:
ScreenSecond:
<ScreenFirst>:
id: screen_first
name: 'screen_first'
space_x: self.size[0]/14
BoxLayout:
orientation: "vertical"
size_hint_y: 1
canvas.before:
Color:
rgba: (0.5, 0.8, 0.4, 1.0)
Rectangle:
size: self.size
pos: self.pos
BoxLayout:
size_hint_y: .1
canvas.before:
Color:
rgba: (0.0, 0.0, 0.0, 0.8)
Rectangle:
size: self.size
pos: self.pos
Label:
text: 'Screen Number 01'
size_hint_x: 1
BoxLayout:
orientation: 'vertical'
size_hint_y: .8
padding: screen_first.space_x, 10
Label:
size_hint_y: 0.6
Button:
id: button1
text: 'Go To Second Screen'
size_hint_y: 0.1
background_color: (0.7, 0.0, 0.2, 0.5)
background_normal: ''
on_release: app.root.gotoSecondScreen()
Label:
size_hint_y: 0.1
Button:
id: button2
text: 'None'
size_hint_y: 0.1
background_color: (0.7, 0.0, 0.2, 0.5)
background_normal: ''
on_release: app.root.donothing()
Label:
size_hint_y: 0.1
BoxLayout:
orientation: 'vertical'
size_hint_y: .1
canvas.before:
Color:
rgba: (0.0, 0.0, 0.0, 0.8)
Rectangle:
size: self.size
pos: self.pos
Label:
text: 'Footnote'
size_hint_x: 1
<ScreenSecond>:
id: screen_second
name: 'screen_second'
space_x: self.size[0]/14
BoxLayout:
orientation: "vertical"
size_hint_y: 1
canvas.before:
Color:
rgba: (0.5, 0.8, 0.4, 1.0)
Rectangle:
size: self.size
pos: self.pos
BoxLayout:
size_hint_y: .1
canvas.before:
Color:
rgba: (0.0, 0.0, 0.0, 0.8)
Rectangle:
size: self.size
pos: self.pos
Label:
text: 'Screen Number 02'
size_hint_x: 1
BoxLayout:
orientation: 'vertical'
size_hint_y: .8
padding: screen_second.space_x, 10
BoxLayout:
orientation: 'vertical'
ScrollView:
do_scroll_y: True
Label:
id: myList
text: ''
size_hint_y: 1
color: (0.0, 0.0, 0.0, 0.8)
Button:
id: button3
text: 'Return'
size_hint_y: 0.1
background_color: (0.7, 0.0, 0.2, 0.5)
background_normal: ''
on_release: app.root.gotoFirstScreen()
Label:
size_hint_y: 0.1
BoxLayout:
orientation: 'vertical'
size_hint_y: .1
canvas.before:
Color:
rgba: (0.0, 0.0, 0.0, 0.8)
Rectangle:
size: self.size
pos: self.pos
Label:
text: ''
size_hint_x: 1
And this is the py file: main.py:
from kivy.app import App
from kivy.lang import Builder
from kivy.app import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.popup import Popup
from kivy.uix.label import Label
from kivy.uix.image import Image
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.properties import ObjectProperty
class ScreenFirst(Screen):
def __init__(self, **kwargs):
super().__init__(**kwargs)
class ScreenSecond(Screen):
def __init__(self, **kwargs):
super().__init__(**kwargs)
class ScreenManagement(ScreenManager):
def __init__(self, **kwargs):
super().__init__(**kwargs)
def gotoFirstScreen(self):
self.get_screen('screen_first').ids.button1.focus = True
self.current = 'screen_first'
def gotoSecondScreen(self):
mytext = ''
for i in range(50):
mytext = mytext + 'Line nr. ' + str(i) + '\n'
self.get_screen('screen_second').ids.myList.text = mytext
self.get_screen('screen_second').ids.button3.focus = True
self.current = 'screen_second'
def donothing(self):
pass
class MyForm(App):
def build(self):
self.root = ScreenManagement()
return self.root
if __name__=="__main__":
pol = MyForm()
pol.run()
What am I doing wrong?
The class that is the child of ScrollView must not have:
size_hint_y: 1
because that is setting the Label height to the same as the ScrollView, and that means there is nothing to scroll. You want the height of the Label to grow as the text requires. Try changing that Label rule in your kv to:
Label:
id: myList
text: ''
size_hint_y: None
text_size: self.width, None
height: self.texture_size[1]
color: (0.0, 0.0, 0.0, 0.8)