Kivy: How do I use layouts within seperate screens while using ScreenManager? - python

I have some Kivy code which so far displays a Screen (BrickBreakerMenuScreen) with an Image and a Label, which, when pressed, changes to a blank Screen (GameScreen) with an image in the centre. However, this is not the aim of my code; as you can see from the Builder, the second screen should align the Image in the top right corner:
from kivy.lang import Builder
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.anchorlayout import AnchorLayout
from kivy.uix.image import Image
from kivy import Config
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.uix.widget import Widget
from kivy.animation import Animation
import time
Config.set('graphics', 'multisamples', '0')
Builder.load_string('''
<BrickBreakerMenuScreen>:
BoxLayout:
orientation: 'vertical'
Image:
source: 'brickbreaker log.png'
Label:
font_name: 'vgafix.fon'
text: 'Tap to start'
<GameScreen>:
AnchorLayout:
anchor_x: 'right'
anchor_y: 'top'
Image:
source: 'settings-cog.png'
''')
class BrickBreakerMenuScreen(Screen):
def __init__(self, **kwargs):
super(BrickBreakerMenuScreen, self).__init__(**kwargs)
def on_touch_down(self, touch):
sm.current = 'game'
class GameScreen(Screen):
def __init__(self, **kwargs):
super(GameScreen, self).__init__(**kwargs)
sm = ScreenManager(transition = FadeTransition())
sm.add_widget(BrickBreakerMenuScreen(name='menu'))
sm.add_widget(GameScreen(name='game'))
class BrickBreakerInsanityApp(App):
def build(self):
return sm
if __name__ == '__main__':
BrickBreakerInsanityApp().run()
Is this a problem due to the ScreenManager? I have changed the kv script to attempt to see if it's an issue with AnchorLayout, but none of the other layouts change the image's location on the GameScreen.
Any help is much appreciated. Thanks!
Images:

Your code is working OK. The image is at the top-right corner.
Your problem is the size of that Image widget. Its as big as the size of the window.
To fix this, you could add size_hint: .1, .1 to the Image properties and it will display as you want.
Image:
size_hint: .1, .1
source: 'settings-cog.png'

Related

How how to create a background from a picture on the screen in kivy?

I have a code, but when it executed it gives a black screen. Tell me what's wrong with it, please.
I try to make a background from a picture on the screen in kivy.
Here is my .py file:
from kivy.app import App
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.uix.floatlayout import FloatLayout
from kivy.lang import Builder
from kivy.graphics import Color, Rectangle
from kivy.uix.image import Image
Builder.load_file("Layout.kv")
class SpaceAdventure(App):
def build(self):
return RootManager()
class RootManager(ScreenManager):
pass
class StartScreen(Screen):
pass
if __name__ == '__main__':
SpaceAdventure().run()here
There is my kv file:
<RootScreen>:
transition: FadeTransition()
StartScreen:
<StartScreen>:
name: "start"
canvas.before:
Rectangle:
pos: self.pos
size: self.size
source: 'test.jpg'
FloatLayout:
orientation: 'vertical'
MyButton:
text: 'Start'
<MyButton#Button>:
background_color: 1, 1, 1, 1
bold: True
Your MyButton#Button overlayed background.
You add Rectangle to screen with background, then add FloatLayout, then add button with black background. No size hint for button so fill all empty space - actually all your screen.

Scroll view in Kivy is not scrolling, How could a fix this?

I want to be able to scroll within the buttons numbered 10-1 but it wont let me scroll. Any solutions? I was finally able to put the buttons in a scrollview but after all my effort I am not able to move it. It just crams into the space provided and doesn't move at all.
orientation: "vertical"
SongText:
size_hint: 1,0.35
PausePlay:
size_hint: 1,0.1
ScrollView:
orientation: "vertical"
PlayList:
orientation: "vertical"
AddDeleteShuffle:
size_hint: 1,0.2
<SongText>:
Label:
id: songtitle
text: "Song Title"
<PausePlay>:
Button:
id: play
text: "Play"
Button:
id: pause
text: "Pause"
This is the main area of focus I think nothing is needed here but who knows.
<PlayList>: #Main area of conceren
<AddDeleteShuffle>:
BoxLayout:
Button:
text: "Shuffle"
Button:
text: "Delete"
Button:
text: "Shuffle"
kv file ^
py file
import kivy
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
from kivy.uix.anchorlayout import AnchorLayout
from kivy.uix.scrollview import ScrollView
from kivy.uix.stacklayout import StackLayout
from kivy.uix.gridlayout import GridLayout
from kivy.metrics import dp
from kivy.core.audio import SoundLoader
from kivy.properties import ObjectProperty, StringProperty
from kivy.uix.screenmanager import ScreenManager, Screen
class AddDeleteShuffle(BoxLayout):
pass
class PlayList(BoxLayout):
def __init__(self,**kwargs):
super().__init__(**kwargs)
for i in range(0,10):
size = dp(100)
b = Button(text=str(i+1), size_hint=(1,None), size=(size,size))
self.add_widget(b)
Class for the playlist it is inside a scroll view, but I can't move it. Maybe I have to add a layout in the kv file. I have no idea.
class PausePlay(BoxLayout):
pass
class SongText(BoxLayout):
pass
class AppLayout(BoxLayout):
pass
class Sound5App(App):
def build(self):
return AppLayout()
if __name__ == "__main__":
Sound5App().run()

Cannot position a label relatively to stay at the middle top

This is the output I am getting.I am trying to place a label at the very top and centre of the top area(centre top), but when I try to do it it just goes out of the screen.Please help by changing the only code I am writing.
Thanks.
What I tried.
.py file:
from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.config import Config
from kivy.uix.widget import Widget
from kivy.graphics import Line, Color
from kivy.lang import Builder
from kivy.uix.image import Image
from kivy.uix.label import Label
from kivy.uix.relativelayout import RelativeLayout
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.anchorlayout import AnchorLayout
class kivyclass(Widget):
pass
class MainApp(App):
def build(self):
return kivyclass()
if __name__ == '__main__':
MainApp().run()
.kv file:
#:import utils kivy.utils
<kivyclass>:
canvas.before:
Color:
rgba: utils.get_color_from_hex('#d6fffc')
Rectangle:
size: self.size
pos: self.pos
AnchorLayout:
anchor_x: 'center'
anchor_y: 'top'
Label:
id: labcovid
text: 'Covid-19 Uttarakhand'
font_size: root.width/15
font_name: 'vollkorn.ttf'
color: utils.get_color_from_hex('#4a4a4a')
this is the output I am getting
Your problem is two-fold
Your root widget is a simple widget that does not handle its children in any way.
The Label that has the text gets as big as the whole window.
The solution to the first is to make a FloatLayout as root widget
class kivyclass(FloatLayout):
pass
and to the second, to add this to your label on the kv part
size_hint: None, None
size: self.texture_size

Python 3.7, Change button's colour when it's down

How do I change the button's color when it's down? As in, when you press the button, replace the blue-ish colour into another one?
I've tried fiddling around with background_color_down, background_color_normal, I tried using canvas and the sort but nothing seems to have the effect I intend it to
Or you could try giving the path to a png file with your design of the pressed button to the background_down attribute. Here my file is called "pressed.png" and is located within the same folder as the python programm. this is a link to something i made within 30 seconds in inkscape.
#!/usr/bin/python3.5
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.lang.builder import Builder
from kivy.properties import ObjectProperty, ListProperty
from kivy.atlas import Atlas
kv= Builder.load_string('''
<MainScreen>
my_but:my_but
orientation: "vertical"
size_hint:1,1
# size_hint: 0.3,0.3
# pos_hint:{"center_x": 1, "center_y":1}
Label:
size_hint: 0.5,0.4
text: "Look at my Button go:"
Button:
id:my_but
size_hint: 0.5,0.4
text: "klick me"
# background_normal: ""
background_down: "pressed.png"
''')
class MainScreen(BoxLayout):
my_but = ObjectProperty(None)
def __init__(self, **kwargs):
super(MainScreen, self).__init__(**kwargs)
class myApp(App):
def build(self):
return MainScreen()
if __name__ == "__main__":
myApp().run()

Update canvas pictures

I am new to kivy and try to grasp the concept behind the kivy language. I try to have a button that changes its background picture on click. With my current code, I get no Errors, but the button doesn't do anything if I try to click it...
This is my code:
<ScatterTextWidget>:
orientation: 'vertical'
my_picture: 'picture.png'
Button:
id: b1
canvas.after:
Rectangle:
id: m_r
source: root.my_picture
pos: self.pos
size: self.size
on_release: root.nextPicture()
.py:
from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.floatlayout import FloatLayout
class ScatterTextWidget(FloatLayout):
def nextPicture(self):
self.ids.my_picture = 'newPicture.png'
self.canvas.ask_update()
return
class GuiApp(App):
def build(self):
return ScatterTextWidget()
if __name__ == "__main__":
GuiApp().run()
What do I have to do to make my button show the new Picture?
Just change this line
self.ids.my_picture = 'newPicture.png'
to
self.my_picture = 'newPicture.png'
You are accessing a property not an id.

Categories

Resources