Develop Reference

Kivy ScrollView cutting off part of label

I am currently experiencing an issue when trying to use a GridLayout with a ScrollView, in that the top half of the labels in the GridLayout are being cut off by the ScrollView.
For example, here is what it currently looks like:
And, here is the .kv code for this section (it is part of a BottomNavigation):
MDBottomNavigationItem:
id: hmNav
name: 'home'
text: 'Home'
icon: 'home'
GridLayout:
id: hmGrid
cols: 1
rows_minimum: {0: (self.parent.height) * 0.05, 1: (self.parent.height) * 0.2, 2: (self.parent.height) * 0.4, 3: (self.parent.height) * 0.1, 4: (self.parent.height) * 0.1}
row_force_default: True
MDLabel:
id: welcomeLabel
halign: 'center'
font_name: "DMSans"
text: "Hello, " + app.app.getId() + "!"
theme_text_color: "Custom"
font_size: '25sp'
size: self.texture_size
text_color: get_color_from_hex("#08421e")
MDLabel:
id: wLabel2
halign: 'center'
font_name: "DMSans"
text: "Here are your selected ingredients:"
theme_text_color: "Custom"
font_size: '15sp'
size: self.texture_size
text_color: get_color_from_hex("#08421e")
ScrollView:
id: selectedScroll
size: (self.parent.width, self.parent.height)
do_scroll_x: False
do_scroll_y: True
bar_width: 20
GridLayout:
id: selectedGrid
size_hint_y: None
spacing: 60
cols: 2
height: self.minimum_height
MDLabel:
halign: 'center'
text: "TEST1"
font_size: '15sp'
theme_text_color: "Custom"
text_color: get_color_from_hex("#08421e")
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST2"
font_size: '15sp'
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST1"
font_size: '15sp'
theme_text_color: "Custom"
text_color: get_color_from_hex("#08421e")
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST2"
font_size: '15sp'
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST1"
font_size: '15sp'
theme_text_color: "Custom"
text_color: get_color_from_hex("#08421e")
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST2"
font_size: '15sp'
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST 3"
font_size: '15sp'
size: self.texture_size
MDLabel:
halign: 'center'
text: "TEST 4"
font_size: '15sp'
size: self.texture_size
I have used a ScrollView with a BoxLayout successfully, using much of the same configuration as this GridLayout, but I'm unsure of why the top labels are being cut off in this particular instance.
Any help would be greatly appreciated!
Thanks.

When you use height: self.minimum_height in a GridLayout (and others), it calculates the height of the GridLayout based on the height of its children. This means that those children must have explicit height values. You have specified size: self.texture_size for each MDLabel, but that will have no effect if size_hint is left at the default of (1,1). To fix it, just add:
size_hint_y: None
to each of the MDLabels.

Create a recycle view(Gridlayout) inside a Boxlayout kivy

I need all the elements of my FirsWindow, put them in a recycleview. I'm thinking to do it from RecycleGridLayout instead of GridLayout, but I don't how to really apply it in the code. It's necesary that the GridLayout or RecycleGridLayout have cols:4, I think it's not necessary upload my py.file but I'm not sure. please I need help on this. thanks in advance.
kv.file
<FirstWindow>:
name: "Catalogue"
BoxLayout:
id: Boxmain
orientation: "vertical"
#size: root.width, root.height
#size_hint: 1, None
#height: 300
#padding: 50
spacing: 50
size: root.height, root.width
GridLayout:
cols: 4
padding: 4
Label:
text: "Items"
#font_size: 25
Label:
text: "Number"
Label:
text: "Price"
Label:
text: "Add to Cart"
Label:
text: "Tornillos"
text_size: self.size
halign: 'center'
valign: 'bottom'
Image:
id: image_tornillos
allow_stretch: True
keep_ratio: True
size_hint: 0.2,0.2
width: 60
height: 80
#pos_hint: {'center_x':1, 'center_y':1}
source: "images/tornillo.png"
center_x: self.parent.center_x
center_y: self.parent.center_y+10
TextInput:
id: input_tornillo
text: ""
halign: "right"
font_size: 18
multiline: True
#size_hint: (1, .15)
Label:
text: "0.0"
Button:
id: shopping1
#text: "Hello"
#font_size: 32
allow_stretch: True
keep_ratio: True
size_hint: .25,.30
pos_hint: {'center_x':0.5, 'center_y':0.5}
background_color: 0,0,0,0
#on_press: root.press_on()
#on_release: root.press_off()
on_press: root.ids.Shoppingcart1.source= root.var2
on_release: root.ids.Shoppingcart1.source= root.var1
Image:
id: Shoppingcart1
allow_stretch: True
keep_ratio: True
size_hint: 0.5,0.5
width: 60
height: 60
pos_hint: {'center_x':0.5, 'center_y':0.5}
source: root.var1
center_x: self.parent.center_x
center_y: self.parent.center_y
#------------------------
Button:
text:"lala"
Button:
text:"lal2"
Button:
text:"lale"
Button:
text:"lal5"
Button:
text:"lala"
Button:
text:"lal54"
Button:
text:"lala"
#------------------------------------------------------------

How to remove the space between two BoxLayouts in Kivy?

I state that I have already read the answers of other users to this question but none of them helped me. I'm trying to program a calculator in python with the kivy GUI interface,he problem is that i can't remove that space highlighted in red in the attached photo down here. I have already tried with: size_hint: None,None and size:root.size[0], "5dp" to scale the BoxLayouts but it doesn't worked
[1]: https://i.stack.imgur.com/y1ZwF.png
BoxLayoutExample:
<BoxLayoutExample>:
orientation: "vertical"
Label:
text: "0"
font_size: "30dp"
BoxLayout:
orientation: "horizontal"
Button:
text: "7"
size_hint: .1, .3
Button:
text: "4"
size_hint: .1, .3
Button:
text: "1"
size_hint: .1, .3
BoxLayout:
orientation: "horizontal"
Button:
text: ","
size_hint: .1, .3
Button:
text: "0"
size_hint: .1, .3
Button:
text: "="
size_hint: .1, .3

Your problem is that you are setting size_hint of the Buttons relative to its parent BoxLayout. So in effect your BoxLayout's are taking up 1/3 of the available space (because there are three widgets in BoxLayoutExample.
Here is how to fix it:
<BoxLayoutExample>:
orientation: "vertical"
Label:
text: "0"
font_size: "30dp"
size_hint: 1, .8
BoxLayout:
orientation: "horizontal"
size_hint: 1, .1
Button:
text: "7"
Button:
text: "4"
Button:
text: "1"
BoxLayout:
orientation: "horizontal"
size_hint: 1, .1
Button:
text: ","
Button:
text: "0"
Button:
text: "="
Adjust the size of the Label and the BoxLayout accordingly

Prevent KivyMD from drawing a widget several times

I am currently building a mobile app with Python and KivyMD. On my application I have an MDExpansionPanel which is called in the on_pre_enter method of the ScreenManager. Naturally this will cause that every time I enter to the same page, the widget will be drawn once again.
Is there a way to delete the previous widget before drawing the new one? I've tried several approaches however I have had no success.
The code for a minimal reproducible example is the following:
Python code:
from kivy.properties import ObjectProperty
from kivy.uix.screenmanager import ScreenManager, Screen
from kivymd.app import MDApp
from kivymd.uix.expansionpanel import MDExpansionPanel, MDExpansionPanelOneLine
from kivy.uix.boxlayout import BoxLayout
class MyContentAliment(BoxLayout):
pass
class MyContentCasetas(BoxLayout):
pass
class MyContentGasolina(BoxLayout):
pass
class MyContentHosped(BoxLayout):
pass
class MyContentVarios(BoxLayout):
pass
class LoginWindow(Screen):
pass
class TravelManagerWindow(Screen):
panel_container = ObjectProperty(None)
# EXPANSION PANEL PARA SOLICITAR GV
def set_expansion_panel(self):
# FOOD PANEL
self.ids.panel_container.add_widget(MDExpansionPanel(icon="food", content=MyContentAliment(),
panel_cls=MDExpansionPanelOneLine(text="Alimentacion")))
# CASETAS PANEL
self.ids.panel_container.add_widget(MDExpansionPanel(icon="food", content=MyContentCasetas(),
panel_cls=MDExpansionPanelOneLine(text="Casetas")))
# GAS PANEL
self.ids.panel_container.add_widget(MDExpansionPanel(icon="food", content=MyContentGasolina(),
panel_cls=MDExpansionPanelOneLine(text="Gasolina")))
# HOSPEDAJE PANEL
self.ids.panel_container.add_widget(MDExpansionPanel(icon="food", content=MyContentHosped(),
panel_cls=MDExpansionPanelOneLine(text="Hospedaje")))
# VARIOS PANEL
self.ids.panel_container.add_widget(MDExpansionPanel(icon="food", content=MyContentVarios(),
panel_cls=MDExpansionPanelOneLine(text="Varios")))
### WINDOW MANAGER ################################
class WindowManager(ScreenManager):
pass
ScreenManager().add_widget(LoginWindow(name='login'))
ScreenManager().add_widget(TravelManagerWindow(name='travelManager'))
class reprodExample(MDApp):
def build(self):
self.theme_cls.primary_palette = "Teal"
return WindowManager()
if __name__ == "__main__":
reprodExample().run()
Kivy code:
:
LoginWindow:
TravelManagerWindow:
<LoginWindow>:
name: 'login'
MDRaisedButton:
text: 'Enter'
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
size_hint: None, None
on_release:
root.manager.transition.direction = 'up'
root.manager.current = 'travelManager'
<TravelManagerWindow>:
name:'travelManager'
on_pre_enter: root.set_expansion_panel()
MDRaisedButton:
text: 'Back'
pos_hint: {'center_x': 0.5, 'center_y': 0.85}
size_hint: None, None
on_release:
root.manager.transition.direction = 'down'
root.manager.current = 'login'
BoxLayout:
orientation: 'vertical'
size_hint:1,0.85
pos_hint: {"center_x": 0.5, "center_y":0.37}
adaptive_height:True
height: self.minimum_height
ScrollView:
adaptive_height:True
GridLayout:
size_hint_y: None
cols: 1
row_default_height: root.height*0.10
height: self.minimum_height
BoxLayout:
adaptive_height: True
orientation: 'horizontal'
GridLayout:
id: panel_container
size_hint_x: 0.6
cols: 1
adaptive_height: True
BoxLayout:
size_hint_x: 0.05
MDCard:
id: resumen_solicitud
size_hint: None, None
size: "250dp", "300dp"
pos_hint: {"top": 0.9, "center_x": .5}
elevation: 0.1
MDBoxLayout:
orientation: 'vertical'
canvas.before:
Color:
rgba: 0.8, 0.8, 0.8, 1
Rectangle:
pos: self.pos
size: self.size
MDLabel:
text: 'Monto Total Solicitado'
font_style: 'Button'
halign: 'center'
font_size: (root.width**2 + root.height**2) / 15.5**4
size_hint_y: 0.2
MDSeparator:
height: "1dp"
MDTextField:
id: suma_solic_viaje
text: "$ 0.00"
bold: True
line_color_normal: app.theme_cls.primary_color
halign: "center"
size_hint_x: 0.8
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
MDSeparator:
height: "1dp"
BoxLayout:
id: expense_graph
halign: 'center'
<MyContentAliment>:
adaptive_height: True
MDBoxLayout:
orientation:'horizontal'
adaptive_height:True
size_hint_x:self.width
pos_hint: {"center_x":0.5, "center_y":0.5}
spacing: dp(10)
padding_horizontal: dp(10)
MDLabel:
text: 'Monto:'
multiline: 'True'
halign: 'center'
pos_hint: {"x":0, "top":0.5}
size_hint_x: 0.15
font_style: 'Button'
font_size: 19
MDTextField:
id: monto_aliment_viaje
hint_text: 'Monto a solicitar'
pos_hint: {"x":0, "top":0.5}
halign: 'left'
size_hint_x: 0.3
helper_text: 'Ingresar el monto a solicitar'
helper_text_mode: 'on_focus'
write_tab: False
required: True
MDRaisedButton:
id: boton_aliment_viaje
pos_hint: {"x":0, "top":0.5}
text:'Ingresar Gasto'
### CASETAS
<MyContentCasetas>:
adaptive_height: True
MDBoxLayout:
orientation:'horizontal'
adaptive_height:True
size_hint_x:self.width
pos_hint: {"center_x":0.5, "center_y":0.5}
spacing: dp(10)
padding_horizontal: dp(10)
MDLabel:
text: 'Monto:'
multiline: 'True'
halign: 'center'
pos_hint: {"x":0, "top":0.5}
size_hint_x: 0.15
font_style: 'Button'
font_size: 19
MDTextField:
id: monto_casetas_viaje
hint_text: 'Monto a solicitar'
pos_hint: {"x":0, "top":0.5}
halign: 'left'
size_hint_x: 0.3
helper_text: 'Ingresar el monto a solicitar'
helper_text_mode: 'on_focus'
write_tab: False
input_filter: 'float'
required: True
MDRaisedButton:
id: boton_casetas_viaje
pos_hint: {"x":0, "top":0.5}
text:'Ingresar Gasto'
BoxLayout:
size_hint_x: 0.05
### GASOLINA
<MyContentGasolina>:
adaptive_height: True
MDBoxLayout:
orientation:'horizontal'
adaptive_height:True
size_hint_x:self.width
pos_hint: {"center_x":0.5, "center_y":0.5}
spacing: dp(10)
padding_horizontal: dp(10)
MDLabel:
text: 'Monto:'
multiline: 'True'
halign: 'center'
pos_hint: {"x":0, "top":0.5}
size_hint_x: 0.15
font_style: 'Button'
font_size: 19
MDTextField:
id: monto_gas_viaje
hint_text: 'Monto a solicitar'
pos_hint: {"x":0, "top":0.5}
halign: 'left'
size_hint_x: 0.3
helper_text: 'Ingresar el monto a solicitar'
helper_text_mode: 'on_focus'
write_tab: False
input_filter: 'float'
required: True
MDRaisedButton:
id: boton_gas_viaje
pos_hint: {"x":0, "top":0.5}
text:'Ingresar Gasto'
BoxLayout:
size_hint_x: 0.05
Thanks a lot in advance.

How to use the RST module in Kivy?

I'm creating a fitness/nutrition app in Kivy. The problem is that most of the screens involve text for the viewer to read and I don't want the text to be just plain old text like that of a .txt file. I tried looking for something and I found there is a RST rendering module that will make my text look good but after trying for a couple of days, I can't seem to get it working with my code. Also I want to put the text that I will be using with RST into a seperate file so I can keep my code clean, how would I be able to do that?
Python Code(main.py):
import kivy
kivy.require('1.9.0')
from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.anchorlayout import AnchorLayout
from kivy.uix.stacklayout import StackLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.properties import ListProperty, StringProperty, OptionProperty, VariableListProperty
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.graphics import *
from kivy.base import runTouchApp
from kivy.uix.label import Label
class MainScreen(Screen):
pass
class NutritionScreen(Screen):
pass
class FitnessScreen(Screen):
pass
class CalorcalcScreen(Screen):
pass
class BigsixScreen(Screen):
pass
class ProteinScreen(Screen):
pass
class CarbScreen(Screen):
pass
class FatScreen(Screen):
pass
class VitaminScreen(Screen):
pass
class MineralScreen(Screen):
pass
class WaterScreen(Screen):
pass
class SuppleScreen(Screen):
pass
class DietScreen(Screen):
pass
class ExerciseScreen(Screen):
pass
class WorkoutplanScreen(Screen):
pass
class ScreenManagement(ScreenManager):
pass
presentation = Builder.load_file("nutrifit.kv")
class NutrifitApp(App):
def build(self):
return presentation
nfApp = NutrifitApp()
nfApp.run()
Kivy Code(nutrifit.kv):
#: import FadeTransition kivy.uix.screenmanager.FadeTransition
ScreenManagement:
transition: FadeTransition()
MainScreen:
NutritionScreen:
FitnessScreen:
CalorcalcScreen:
BigsixScreen:
SuppleScreen:
DietScreen:
ExerciseScreen:
WorkoutplanScreen:
ProteinScreen:
CarbScreen:
FatScreen:
VitaminScreen:
MineralScreen:
WaterScreen:
<MainScreen>:
name: 'main'
GridLayout:
cols: 1
rows: 3
spacing: 1
padding: 1
Button:
text: "Nutrition"
font_size: 25
on_release: app.root.current = "nutrition"
Button:
text: "Fitness"
font_size: 25
on_release: app.root.current = "fitness"
################################################################################
<NutritionScreen>:
name: 'nutrition'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Home'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "main"
Label:
text: 'Nutrition'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"center": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
Button:
text: "Caloric Calculator"
font_size: 25
on_release: app.root.current = "calorcalc"
Button:
text: "The Big Six"
font_size: 25
on_release: app.root.current = "bigsix"
Button:
text: "Supplementation"
font_size: 25
on_release: app.root.current = "supple"
Button:
text: "Diets"
font_size: 25
on_release: app.root.current = "diet"
<CalorcalcScreen>:
name: 'calorcalc'
<BackBar#ButtonBehavior+BoxLayout>:
orientation: 'horizontal'
bgcolor: [1, 0, 0, 1]
on_press: self.bgcolor = [1, 0, 0, .5]
on_release: self.bgcolor = [1, 0, 0, 1]
canvas:
Color:
rgba: root.bgcolor
Rectangle:
pos: self.pos
size: self.size
Label:
text: '<--'
size_hint_x: None
width: root.height
Label:
text: 'Current name'
text_size: self.size
halign: 'left'
valign: 'middle'
RstDocument:
text: root.text
<BigsixScreen>:
name: 'bigsix'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "nutrition"
GridLayout:
cols: 2
rows: 3
size_hint: 1, .9
Button:
text: 'Protein'
on_release: app.root.current = 'protein'
Button:
text: 'Carbohydrates'
on_release: app.root.current = 'carb'
Button:
text: 'Fats'
on_release: app.root.current = 'fat'
Button:
text: 'Vitamins'
on_release: app.root.current = 'vitamin'
Button:
text: 'Minerals'
on_release: app.root.current = 'mineral'
Button:
text: 'Water'
on_release: app.root.current = 'water'
<ProteinScreen>:
name: 'protein'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "bigsix"
Label:
text: 'Protein'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
FloatLayout:
Label:
text: 'this is protein'
pos_hint: {"center_x": .5, "center_y": .5}
<CarbScreen>:
name: 'carb'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "bigsix"
Label:
text: 'Carbohydrates'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
FloatLayout:
Label:
text: 'this is carbs'
pos_hint: {"center_x": .5, "center_y": .5}
<FatScreen>:
name: 'fat'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "bigsix"
Label:
text: 'Fats'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
FloatLayout:
Label:
text: 'this is fats'
pos_hint: {"center_x": .5, "center_y": .5}
<MineralScreen>:
name: 'mineral'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "bigsix"
Label:
text: 'Minerals'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
FloatLayout:
Label:
text: 'this is minerals'
pos_hint: {"center_x": .5, "center_y": .5}
<VitaminScreen>:
name: 'vitamin'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "bigsix"
Label:
text: 'Vitamins'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
FloatLayout:
Label:
text: 'this is vitamins'
pos_hint: {"center_x": .5, "center_y": .5}
<WaterScreen>:
name: 'water'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "bigsix"
Label:
text: 'Water'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
FloatLayout:
Label:
text: 'this is water'
pos_hint: {"center_x": .5, "center_y": .5}
<SuppleScreen>:
name: 'supple'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "nutrition"
Label:
text: 'Supplementation'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
<DietScreen>:
name: 'diet'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "nutrition"
Label:
text: 'Diets'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
################################################################################
<FitnessScreen>:
name: 'fitness'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Home'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "main"
Label:
text: 'Fitness'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
Button:
text: "Exercises"
font_size: 25
on_release: app.root.current = "exercise"
Button:
text: "The Big Six"
font_size: 25
on_release: app.root.current = "workoutplan"
<WorkoutplanScreen>:
name: 'workoutplan'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "fitness"
Label:
text: 'Workout Plans'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
<ExerciseScreen>:
name: 'exercise'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "fitness"
Label:
text: 'Exercises'
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
This is if I set it to vertical:
first example
This is if I enter the parameters:
size_hint: .5, .1
pos_hint: {"x": 0, "top": 1}
second example

How to use RST Document in Kivy?
Rreference: reStructuredText renderer
Reading text from an input File:
1. Create an input File - inFile.txt
Create a file called "inFile.txt" with the following text:
.. _top:
Hello world
===========
This is an **emphased text**, some ``interpreted text``.
And this is a reference to top_::
$ print("Hello world")
2. Edit class CalorcalcScreen
Replaced "pass" with the following code in your class CalorcalcScreen(Screen):
class CalorcalcScreen(Screen):
text = ""
with open("inFile.txt") as fobj:
for line in fobj:
text += line
3. Edit kv Rule file - nutrifit.kv
At <CalcorcalcScreen>, replace "Label" with "RstDocument" and remove "document = RstDocument..."
<CalorcalcScreen>:
name: 'calorcalc'
BoxLayout:
orientation: 'horizontal'
spacing: 1
padding: 1
Button:
text: 'Back'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
on_release: app.root.current = "nutrition"
Label:
text: ''
size_hint_y: .1
size_hint_x: 1
pos_hint: {"right": 1, "top": 1}
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
RstDocument:
text: root.text
<BigsixScreen>:
New Navigation Bar
Edit kv Rule file
Please update your kv rule file as follow:
<BackBar#ButtonBehavior+BoxLayout>:
orientation: 'horizontal'
bgcolor: [1, 0, 0, 1]
on_press: self.bgcolor = [1, 0, 0, .5]
on_release: self.bgcolor = [1, 0, 0, 1]
canvas:
Color:
rgba: root.bgcolor
Rectangle:
pos: self.pos
size: self.size
Label:
text: '<--'
size_hint: .25, .1
pos_hint: {"x": 0, "top": 1}
Label:
text: 'Current name'
text_size: self.size
halign: 'left'
valign: 'middle'
size_hint: 1, .1
pos_hint: {"right": 1, "top": 1}
<CalorcalcScreen>:
name: 'calorcalc'
BackBar:
BoxLayout:
orientation: 'vertical'
size_hint: 1, .9
RstDocument:
text: root.text
<BigsixScreen>:
Output