im very much a learner!
i am learning python and kivy and currently working on a custom designed button. i have defined 2 buttons in the .kv Rounded01 and Rounded02 as examples
all im trying to achieve is getting the defined settings for Rounded02 to display on the Rounded01 button on_press and then revert on_release.
ive been through that many vids and webpages i cant quite see the forest for the trees lol so im throwing myself on the mercy of you folks in the hope someone can show/help me with this final bit
PS - ive been working on this button for about 5 days lol learning and figuring out how to layer the canvas to display the design and these late nights have my eyes stinging lol
can a kind soul help a noob over the finish line?
PPS - i picked up along the way that i could use an image to achieve this in a much easier fashion but id like to ask you guys here if its possible before considering the easy route lol thanks!
from kivymd.app import MDApp
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.widget import Widget
from kivy.lang import Builder
from kivymd.uix.list import TwoLineListItem
from kivy.core.window import Window
#designate our kv design file
Builder.load_file('shd_proto_kv_cfg.kv')
class Search(TwoLineListItem):
pass
class MyLayout(BoxLayout):
pass
class BaseLayout(Widget):
pass
class ShdApp(MDApp):
def build(self):
Window.clearcolor = (1,1,1,1)
return BaseLayout()
ShdApp().run()
<BaseLayout>
BoxLayout:
target_btn: trgbtn
orientation: "vertical"
size: root.width, root.height
padding: 50
spacing: 20
Button:
text: "!!! Hello Folks !!!"
Rounded01:
id: trgbtn
text: "!!! im blue dab a dee dab a dai !!!"
pos_hint: {'center_x': 0.5}
size_hint: (1, .3)
#on_press:
#on_release:
Rounded02:
text: "!!! im green dab a dee dab a dai !!!"
pos_hint: {'center_x': 0.5}
size_hint: (1, .3)
<Rounded01@Button>:
id: bluebut
background_color: (0,0,0,0)
background_normal: ''
canvas.before:
Color:
rgba: (48/255, 84/255, 150/255, 1)
RoundedRectangle:
size: self.size
pos: self.pos
radius: [50]
<Rounded02@Button>:
id: grnbut
background_color: (0,0,0,0)
background_normal: ''
canvas.before:
Color:
rgba: (34/255, 168/255, 74/255, 1)
RoundedRectangle:
size: self.size
pos: self.pos
radius: [50]
canvas:
Color:
rgba: (255/255, 0/255, 0/255, 1)
Line:
rounded_rectangle: (self.pos[0], self.pos[1], self.size[0], self.size[1], 50)
width: 2
canvas.after:
Color:
rgba: (255/255, 0/255, 0/255, 1)
Line:
rounded_rectangle: (self.pos[0]+10, self.pos[1]+10, self.size[0]-20, self.size[1]-20, 50)
width: 2
ive been through that many vids and webpages i cant quite see the forest for the trees lol so im throwing myself on the mercy of you folks in the hope someone can show/help me with this final bit
all im trying to achieve is getting the defined settings for Rounded02 to display on the Rounded01 button on_press and then revert on_release.
Here is a hack that just uses duplicate code in the kv with conditionals:
<Rounded01@Button>:
id: bluebut
background_color: (0,0,0,0)
blue_color: (48/255, 84/255, 150/255, 1)
green_color: (34/255, 168/255, 74/255, 1)
background_normal: ''
canvas.before:
Color:
rgba: self.green_color if self.state == 'down' else self.blue_color
RoundedRectangle:
size: self.size
pos: self.pos
radius: [50]
canvas:
Color:
rgba: (255/255, 0/255, 0/255, 1)
Line:
rounded_rectangle: (self.pos[0], self.pos[1], self.size[0], self.size[1], 50) if self.state == 'down' else (0,0,0,0,0)
width: 2
canvas.after:
Color:
rgba: (255/255, 0/255, 0/255, 1)
Line:
rounded_rectangle: (self.pos[0]+10, self.pos[1]+10, self.size[0]-20, self.size[1]-20, 50) if self.state == 'down' else (0,0,0,0,0)
width: 2