Related
When I double click on the video, it goes full screen, but if I double click on it again, it doesn't go back to normal. However, the rest of the window elements are partially visible. The part of my .kv code responsible for the VideoPlayer is given below:
<VideosWindow>:
name: 'vids'
FloatLayout:
FileChooserListView:
id:chooser
path: root.get_files_list()
canvas.before:
Color:
rgb: .4, .5, .5
Rectangle:
pos: self.pos
size: self.size
on_selection: root.select(chooser.selection)
size_hint: (.9, .15)
pos_hint: {'x':.05, 'y':.8}
VideoPlayer:
id:vid
options: {'eos':'loop'}
size_hint: (.9, .7)
pos_hint: {'x':.05, 'y':.05}
Button:
size_hint_y: 0.3
height: 48
text: "open"
disabled: not chooser.selection
on_release: root.select(chooser.selection)
size_hint: (.45, .05)
pos_hint: {'x':.05, 'y':.00}
Button:
text: 'Go Back'
color: (1,1,1,1)
background_normal:''
background_color: (0.3,0.6,0.7,1)
on_release:
vid.state = 'pause'
app.root.current = 'saved_files'
size_hint: (.45, .05)
pos_hint: {'x':.50, 'y':.00}
VideosWindow class code:
class VideosWindow(Screen):
def get_files_list(self):
files = os.sep.join([my_folder,'mp4'])
return files
def select(self, filename):
self.ids.vid.source = filename[0]
self.ids.vid.state = 'play'
The screenshots of my program before and after I go fullscreen mode:
before
after
Solved this issue by adding VideoPlayer widget to the GridLayout. Now .kv code looks like this:
<VideosWindow>:
name: 'vids'
FloatLayout:
FileChooserListView:
id:chooser
path: root.get_files_list()
canvas.before:
Color:
rgb: .4, .5, .5
Rectangle:
pos: self.pos
size: self.size
on_selection: root.select(chooser.selection)
size_hint: (.9, .15)
pos_hint: {'x':.05, 'y':.8}
GridLayout:
cols:1
size_hint: (.9, .7)
pos_hint: {'x':.05, 'y':.05}
VideoPlayer:
id:vid
options: {'eos':'loop'}
Button:
size_hint_y: 0.3
height: 48
text: "open"
disabled: not chooser.selection
on_release: root.select(chooser.selection)
size_hint: (.45, .05)
pos_hint: {'x':.05, 'y':.00}
Button:
text: 'Go Back'
color: (1,1,1,1)
background_normal:''
background_color: (0.3,0.6,0.7,1)
on_release:
vid.state = 'pause'
app.root.current = 'saved_files'
size_hint: (.45, .05)
pos_hint: {'x':.50, 'y':.00}
Don't know if it is good decision but it works.
I build tree of widgets in kivy-examples and all looking fine. But after i copy a code into pycharm i got something else. What i did bad? I have no idea how to fix it and what could be a reason of this...
<MyGrid>
BoxLayout:
orientation: 'vertical'
padding: 5
spacing: 5
BoxLayout:
text: "Button 1"
size_hint: 1, .08
Button:
BoxLayout:
size_hint: 1, .3
BoxLayout:
orientation: 'horizontal'
GridLayout:
cols: 2
Button:
Button:
Button:
Button:
Button:
Button:
Button:
Button:
GridLayout:
cols: 2
Button:
Button:
Button:
Button:
Button:
Button:
Button:
Button:
Button:
Button:
BoxLayout:
orientation: 'vertical'
Button:
GridLayout:
cols: 2
Button:
Button:
Button:
Button:
BoxLayout:
Button:
Button:
Button:
BoxLayout:
size_hint: 1, .5
Button:
BoxLayout:
size_hint: 1, .12
Button:
how it look in kivy-examples
and in pycharm
In your pycharm version the root widget is probably not a layout, so the top level BoxLayout has the default size of (100, 100). Presumably this is the MyGrid from your rule. Make MyGrid inherit from BoxLayout.
I am working on a calendar program with Kivy. My Problem is in the print_appointment_to_label function. I wrote appointment_label.text = appointment_name_file_content at the end of the function ,but the label doesn't update only when I restart the program.
If you wondering label_id_file_content stands for "1jal" which is the label id.
Thank you for your help
Julius
Python:
# diable multitouch
from kivy.config import Config
Config.set('input', 'mouse', 'mouse,multitouch_on_demand')
from kivy.app import App
from kivy.uix.screenmanager import Screen,ScreenManager
from kivy.lang.builder import Builder
from kivy.uix.popup import Popup
from kivy.uix.floatlayout import FloatLayout
from kivy.clock import Clock
class screenmanager(ScreenManager):
pass
class PopupContent(FloatLayout):
def store_appointment_name(self):
appointment_name = self.ids.appointment_name.text
with open("appointment_name_file","w") as appointment_name_file:
appointment_name_file.write(appointment_name)
with open("label_id_file","r") as label_id_file:
label_id_file_content = label_id_file.read()
#check month
if "ja" in label_id_file_content:
Ja = JanuaryWindow()
Ja.__init__()
class MonthWindow(Screen):
pass
class JanuaryWindow(Screen):
def __init__(self, **kwargs):
super(JanuaryWindow, self).__init__(**kwargs)
Clock.schedule_once(self.print_appointment_to_label)
def print_appointment_to_label(self,dt):
with open("appointment_name_file", "r") as appointment_name_file:
appointment_name_file_content = appointment_name_file.read()
with open("label_id_file", "r") as label_id_file:
label_id_file_content = label_id_file.read()
appointment_label = self.ids[label_id_file_content]
appointment_label.text = appointment_name_file_content
# Label Text is not showing up only when restart program
kv = Builder.load_file("Calendar-KIVY.kv")
class Calendar(App):
def create_popup_and_convert_button_id_in_label_id(self,button_id):
with open("button_id_file","w") as button_id_file:
button_id_file.write(button_id)
pcontent = PopupContent()
new_appointment_p = Popup(title="Make new appointment",content=pcontent,size_hint=(None,None),size=(1500,1000))
new_appointment_p.open()
#make label id
with open("button_id_file", "r") as button_id_file:
button_id_file_content = button_id_file.read()
label_id = button_id_file_content.replace("b", "l")
with open("label_id_file", "w") as label_id_file:
label_id_file.write(label_id)
def build(self):
return kv
Calendar().run()
Kv:
screenmanager:
MonthWindow:
JanuaryWindow:
<PopupContent>:
Label:
text: "Enter your appointment name"
size_hint: 0.4,0.1
pos_hint:{"x":0.1,"y":0.6}
TextInput:
id: appointment_name
size_hint: 0.4,0.06
pos_hint: {"x":0.478,"y":0.615}
multiline: False
Button:
text: "Create"
size_hint: 0.8,0.2
pos_hint: {"x":0.1,"y":0.09}
on_release:
root.store_appointment_name()
<MonthWindow>:
name : "MoW"
GridLayout:
cols:4
Button:
text:"January"
on_release:
app.root.current = "JaW"
Button:
text:"February"
on_release:
app.root.current = "FeW"
Button:
text:"March"
Button:
text:"April"
Button:
text:"May"
Button:
text:"June"
Button:
text:"July"
Button:
text:"August"
Button:
text:"September"
Button:
text:"October"
Button:
text:"November"
Button:
text:"December"
<JanuaryWindow>:
name : "JaW"
FloatLayout:
Label:
text:"January"
font_size: "30sp"
pos_hint: {"x":-0.426,"y":0.429}
BoxLayout:
orientation: "vertical"
pos_hint: {"x":-0.4,"y":-0.0015}
size_hint: 0.9,0.89
Label:
text:"1"
Label:
text:"2"
Label:
text:"3"
Label:
text:"4"
Label:
text:"5"
Label:
text:"6"
Label:
text:"7"
Label:
text:"8"
Label:
text:"9"
Label:
text:"10"
Label:
text:"11"
Label:
text:"12"
Label:
text:"13"
Label:
text:"14"
Label:
text:"15"
Label:
text:""
BoxLayout:
orientation: "vertical"
pos_hint: {"x":0,"y":-0.0015}
size_hint: 0.9,0.89
Label:
text:"16"
Label:
text:"17"
Label:
text:"18"
Label:
text:"19"
Label:
text:"20"
Label:
text:"21"
Label:
text:"22"
Label:
text:"23"
Label:
text:"24"
Label:
text:"25"
Label:
text:"26"
Label:
text:"27"
Label:
text:"28"
Label:
text:"29"
Label:
text:"30"
Label:
text:""
BoxLayout:
orientation: "vertical"
pos_hint: {"x":0.32,"y":-0.0015}
size_hint: 0.9,0.89
Label:
text:"31"
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.843}
size_hint: 0.02,0.03
text: "+"
on_release:
app.create_popup_and_convert_button_id_in_label_id("1jab")
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.7885}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.734}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.6795}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.6795}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.625}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.5705}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.516}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.4615}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.4615}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.407}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.3525}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.298}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.2435}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.2435}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.188}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.1235}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.38,"y":0.07}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.843}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.7885}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.734}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.6795}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.6795}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.625}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.5705}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.516}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.4615}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.4615}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.407}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.3525}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.298}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.2435}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.2435}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.188}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.1235}
size_hint: 0.02,0.03
text: "+"
FloatLayout:
Button:
pos_hint: {"x":0.7174,"y":0.07}
size_hint: 0.02,0.03
text: "+"
BoxLayout:
orientation: "vertical"
pos_hint: {"x":-0.36,"y":-0.0015}
size_hint: 0.9,0.89
Label:
id:1jal
text: ""
Label:
id:2jal
text:""
Label:
id:3jal
text:""
Label:
id:4jal
text:""
Label:
id:5jal
text:""
Label:
id:6jal
text:""
Label:
id:7jal
text:""
Label:
id:8jal
text:""
Label:
id:9jal
text:""
Label:
id:10jal
text:""
Label:
id:11jal
text:""
Label:
id:12jal
text:""
Label:
id:13jal
text:""
Label:
id:14jal
text:""
Label:
id:15jal
text:""
Label:
text:""
BoxLayout:
orientation: "vertical"
pos_hint: {"x":0,"y":-0.0015}
size_hint: 0.9,0.89
Label:
id:16jal
text:""
Label:
id:17jal
text:""
Label:
id:18jal
text:""
Label:
id:19jal
text:""
Label:
id:20jal
text:""
Label:
id:21jal
text:""
Label:
id:22jal
text:""
Label:
id:23jal
text:""
Label:
id:24jal
text:""
Label:
id:25jal
text:""
Label:
id:26jal
text:""
Label:
id:27jal
text:""
Label:
id:28jal
text:""
Label:
id:29jal
text:""
Label:
id:30jal
text:""
Label:
text:""
BoxLayout:
orientation: "vertical"
pos_hint: {"x":0.32,"y":-0.0015}
size_hint: 0.9,0.89
Label:
id:31jal
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
Label:
text:""
You are scheduling incorrectly,the following statement:
Clock.schedule_once(self.print_appointment_to_label)
Should be:
Clock.schedule_once(self.print_appointment_to_label, .5)
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
This: (https://imgur.com/a/Y9Xwl) (can't format it for some reason) is the user interface I am currently trying to create in Kivy. I am having difficulty recreating this as I do not understand the layout system and I have read a lot of documentation, watched a lot of Youtube videos, tinkered with the code and still I cannot get the desired result. So far this is my code, it has all the widgets that I need within it, they're just not sized/positioned how I want them:
from kivy.app import App
from kivy.uix.label import Label
from kivy.lang import Builder
from kivy.properties import ListProperty
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.dropdown import DropDown
from kivy.uix.button import Button
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
class CaloriesScreen(Screen):
pass
class categoriesScreen(Screen):
pass
class loginScreen(Screen):
pass
class registerScreen(Screen):
pass
class shoppingListScreen(Screen):
pass
class theScreenManager(ScreenManager):
pass
root_widget = Builder.load_string('''
#:import FadeTransition kivy.uix.screenmanager.FadeTransition
theScreenManager:
transition: FadeTransition()
CaloriesScreen:
<CaloriesScreen>:
name: 'calories'
BoxLayout:
orientation: 'vertical'
BoxLayout:
orientation: 'horizontal'
size_hint: 1, .3
Button:
text: '<'
size_hint: .1, 1
font_size: 75
background_normal: ""
background_color: 0.18, .5, .92, 1
on_release: app.root.current = 'main'
Label:
text: 'Calories'
halign: 'left'
font_size: 50
canvas.before:
Color:
rgb: 0.18, .5, .92
Rectangle:
pos: self.pos
size: self.size
Widget:
size_hint: .1, 1
canvas.before:
Color:
rgb: 0.18, .5, .92
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: 'horizontal'
size_hint: 1, .4
canvas.before:
Color:
rgb: 0.8, 0.8, 0.8
Rectangle:
pos: self.pos
size: self.size
Label:
text: 'Recipes'
font_size: 30
color: 0.18, .5, .92, 1
size_hint: 1, 1
Button:
id: btn
text: 'Select a recipe...'
on_release: dropdown.open(self)
height: '48dp'
size_hint: .5, .3
pos: self.x, .3
DropDown:
id: dropdown
on_parent: self.dismiss()
on_select: btn.text = '{}'.format(args[1])
Button:
text: 'First recipe'
size_hint_y: None
height: '48dp'
on_release: dropdown.select('First Item')
Button:
text: 'Second recipe'
size_hint_y: None
height: '48dp'
on_release: dropdown.select('Second Item')
Button:
text: 'Third recipe'
size_hint_y: None
height: '48dp'
on_release: dropdown.select('Third Item')
Button:
text: '+'
font_size: 30
background_normal: ""
background_color: 0.18, .5, .92, 1
#on_release:
BoxLayout:
orientation: 'vertical'
BoxLayout:
orientation: 'horizontal'
Label:
text: 'Food'
font_size: 30
color: 0.18, .5, .92, 1
Label:
text: 'Cal'
font_size: 30
color: 0.18, .5, .92, 1
BoxLayout:
orientation: 'horizontal'
Label:
text: 'Simple Cheese Omelette'
font_size: 30
color: 0.18, .5, .92, 1
Label:
text: '241'
font_size: 30
color: 0.18, .5, .92, 1
BoxLayout:
orientation: 'horizontal'
Label:
text: 'Burger'
font_size: 30
color: 0.18, .5, .92, 1
Label:
text: '295'
font_size: 30
color: 0.18, .5, .92, 1
BoxLayout:
orientation: 'horizontal'
Label:
text: 'Tomato and caper linguine '
font_size: 30
color: 0.18, .5, .92, 1
Label:
text: '393'
font_size: 30
color: 0.18, .5, .92, 1
BoxLayout:
orientation: 'vertical'
canvas.before:
Color:
rgb: 0.8, 0.8, 0.8
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation: 'horizontal'
Label:
text: 'Total Cal'
font_size: 30
color: 0.18, .5, .92, 1
Label:
text: '929'
font_size: 30
color: 0.18, .5, .92, 1
BoxLayout:
orientation: 'horizontal'
Label:
text: 'You are under calories'
font_size: 30
color: 0.18, .5, .92, 1
Button:
text: 'Clear'
font_size: 75
background_normal: ""
background_color: 0.18, .5, .92, 1
#on_release:
''')
class RecipeApp(App):
def build(self):
return root_widget
if __name__ == "__main__":
RecipeApp().run()
This(https://imgur.com/a/zW2z0) (can't format it for some reason) is what the output of that code looks like. The top bar with the "<" button is how I want it and I've only tried to edit the horizontal row of widgets below it. I cannot position the dropdown menu with the 'select your recipe' label how I would like it. I have tried altering it's y-axis multiple times but it always sinks to the botton of the boxlayout. I even tried giving it a new boxlayout just for the dropdown and tried doing: pos: self.parent.x, self.parent.y * 0.5 assuming it would go halfway up the y-axis of it's parent layout (the boxlayout) but still nothing. I am wondering whether it would be better to just use a floatlayout and manually position all the widgets but I am unsure how this will work well when I compile it into an APK for an Android device. What is the best way to go about positioning my widgets on the screen?
Use pos_hint for this.
If pos_hint: {'top': 1}, the top of the widget will hit the roof of the parent box.
So if your widgets height is 30% of its parent box (size_hint: 0.5, 0.3), and you want it to be centered vertically, you want pos_hint: {'top': 0.5 + 0.3/2}, which means the top of the widget will be half way to the roof + half of the widgets height which is 15% of the parent box.
That takes us 65% to the top :)
size_hint: 0.5, 0.3
pos_hint: { 'top' : 0.65}
If the widgets size_hint is dynamic you can do something like this.
pos_hint: {'top': 0.5 + self.size_hint[1]/2}
And lets take your Select recipe button as an example:
Button:
id: btn
text: 'Select a recipe...'
on_release: dropdown.open(self)
height: '48dp'
size_hint: .5, .3
pos_hint: {'top': 0.5 + self.size_hint[1]/2}