transfer format of image on button from py to kv file

[Luigi Marongiu]

Dear all,

I would like to place an image at the centre of a button. I got a good answer from a previous post (https://groups.google.com/forum/#!msg/kivy-users/Stjcau8sxPE/zc14GVG4BwAJ) but this answer placed the source of the image on the python file as in here:

```

# python file

import kivy
from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.uix.behaviors import ButtonBehavior
from kivy.uix.image import Image


class Screen(GridLayout):
    pass


class ImageButton(ButtonBehavior,Image):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.source = 'Actions-media-playback-start-icon.png'

    def on_press(self):
        self.source = 'Actions-media-playback-pause-icon.png'

    def on_release(self):
        self.source = 'Actions-media-playback-start-icon.png'

class HandyApp(App):
    def build(self):
        return Screen()

if __name__ == "__main__":
    HandyApp().run()

# kivy file

<Screen>:
    rows:2
    padding: 20
    spacing: 20
    Button:
        text: 'Unchanged button'
        on_press: print('unchanged button pressed')
    Button:
        id: b_12
        text: 'Change Image of button'
        color: [0,0,0,1]
        background_down: 'Actions-media-playback-pause-icon.png'     # create new images for the button up and down
        background_normal: 'Actions-media-playback-start-icon.png'
        on_press: print('button with changed images pressed')
    BoxLayout:
        canvas.after:
            Rectangle:
                size: (self.size[0] *.5, self.size[1] *.5)
                pos: (self.pos[0] + self.size[0]* .25, self.pos[1] + self.size[1] *.25)
                source: 'Actions-media-playback-start-icon.png'
        Button:
            text: 'image on top'
            # text_size = self.texture_size
            text_size: self.size
            halign: 'center'
            valign: 'bottom'
            on_press: print('image on top pressed')

    ImageButton:
        on_press: print('ImageButton pressed')

```

I am attaching the icons for reproducibility.

Since I would like to follow the Kivy's phylosophy of keeping the formatting on the kivy file and the logic on python's, is it posible to move the 'source' bit into the kivy file? This needs to take into account that the icon is going to change after pressing the button...

Thank you

[Elliot Garbus]

I haven’t had a chance to try this, but the following should work:

In python leave the class declaration and the constructor, but drop the source assignment statement.  (You May be able to even drop the constructor (the __init__) and just declare the ImageButton class.  

Remove the on_press and on_release methods. 

In KV write

ImageButton:

    source: ‘initial_image.png’

    on_press:

        source: ‘pressed_image.png’

   on_release:

        source: ‘released_image.png’

Sent from my iPad

--
You received this message because you are subscribed to the Google Groups "Kivy users support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
To post to this group, send email to kivy-...@googlegroups.com.
Visit this group at https://groups.google.com/group/kivy-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/897888e9-efd6-4fb9-93a4-0d03ee6b1117%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

<Actions-media-playback-pause-icon.png>

<Actions-media-playback-start-icon.png>

[Luigi Marongiu]

Hello,
I tried to modify the files with:
```
# kivy
#:kivy 1.10.1
<myLayout@BoxLayout>:
orientation: "vertical"
ImageButton:
size_hint_x: 1
size_hint_y: 0.8
source: './Actions-media-playback-pause-icon.png'
on_release:
source: './Actions-media-playback-start-icon.png'
Label:
size_hint_x: 1
size_hint_y: 0.2
text: "Label here"

# python
import kivy
kivy.require('1.10.1')
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout

from kivy.uix.behaviors import ButtonBehavior
from kivy.uix.image import Image

class myLayout(BoxLayout):
pass

class ImageButton(ButtonBehavior, Image):
def __init__(self, **kwargs):
super().__init__(**kwargs)
def on_release(self):
pass

class MyApp(App):
def build(self):
return myLayout()

if __name__ == "__main__":
MyApp().run()
```
but now it stucks:
```
$ python ./my.py
[INFO ] [Logger ] Record log in
/home/gigiux/.kivy/logs/kivy_19-06-13_18.txt
[INFO ] [Kivy ] v1.10.1
[INFO ] [Python ] v2.7.15rc1 (default, Apr 15 2018, 21:51:34)
[GCC 7.3.0]
[INFO ] [Factory ] 194 symbols loaded
[INFO ] [Image ] Providers: img_tex, img_dds, img_sdl2,
img_gif (img_pil, img_ffpyplayer ignored)
Traceback (most recent call last):
File "./my.py", line 22, in <module>
MyApp().run()
File "/usr/lib/python2.7/dist-packages/kivy/app.py", line 799, in run
self.load_kv(filename=self.kv_file)
File "/usr/lib/python2.7/dist-packages/kivy/app.py", line 596, in load_kv
root = Builder.load_file(rfilename)
File "/usr/lib/python2.7/dist-packages/kivy/lang/builder.py", line
301, in load_file
return self.load_string(data, **kwargs)
File "/usr/lib/python2.7/dist-packages/kivy/lang/builder.py", line
368, in load_string
parser = Parser(content=string, filename=fn)
File "/usr/lib/python2.7/dist-packages/kivy/lang/parser.py", line
392, in __init__
self.parse(content)
File "/usr/lib/python2.7/dist-packages/kivy/lang/parser.py", line
505, in parse
rule.precompile()
File "/usr/lib/python2.7/dist-packages/kivy/lang/parser.py", line
261, in precompile
x.precompile()
File "/usr/lib/python2.7/dist-packages/kivy/lang/parser.py", line
259, in precompile
x.precompile()
File "/usr/lib/python2.7/dist-packages/kivy/lang/parser.py", line
184, in precompile
self.co_value = compile(value, self.ctx.filename or '<string>', mode)
File "/home/gigiux/Downloads/my.kv", line 9
source: './Actions-media-playback-start-icon.png'
^
SyntaxError: invalid syntax
```
I don't know why 'source' is invalid...
I set
```
def on_release(self):
pass
```
to declare this operation of python but then put the formatting on kivy.
Any tips?
Tx

> To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/47B195FA-1619-4B40-8014-77E0E8419E54%40cox.net.

> For more options, visit https://groups.google.com/d/optout.

--
Best regards,
Luigi

[Elliot Garbus]

I’m traveling so I can’t try this myself,
But here are a few things to try.

Change:

class ImageButton(ButtonBehavior, Image):
def __init__(self, **kwargs):
super().__init__(**kwargs)
def on_release(self):
pass

To:
class ImageButton(ButtonBehavior, Image):
pass

I also noticed your using Python 2.7, the syntax for super() is different in Python 3, this is the Python 3 syntax. I’m not sure you’ll need it.

Sent from my iPhone

[Luigi Marongiu]

Thank you!
It works but I still have one issue: When I press the button (o better
after releasing it), the icon should change, but it does not. Does
this step need to be declared in the python file? or can it go on the
kivy file?

> --
> You received this message because you are subscribed to the Google Groups "Kivy users support" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.
> To post to this group, send email to kivy-...@googlegroups.com.
> Visit this group at https://groups.google.com/group/kivy-users.

> To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/B521973A-899A-4017-B06C-5354A165C79F%40cox.net.

[Elliot Garbus]

Please show your or attach your code.

It should look like this:

ImageButton:
source:’file1’
on_press: self.source = ‘file2’
on_release: self.source = ‘file3’

Sent from my iPad

> To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/CAMk%2Bs2SmMgTs7YNHqQ4QyE%3DA1eGPERaZaqAoFE4Y-rLNrwMCwg%40mail.gmail.com.

[Luigi Marongiu]

I think it is already in this format:

```
# python file
import kivy

kivy.require('1.10.1')
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.behaviors import ButtonBehavior
from kivy.uix.image import Image

class myLayout(BoxLayout):
pass

class ImageButton(ButtonBehavior, Image):

pass

class MyApp(App):
def build(self):
return myLayout()

if __name__ == "__main__":
MyApp().run()

# kivy file

#:kivy 1.10.1
<myLayout@BoxLayout>:
orientation: "vertical"
ImageButton:
size_hint_x: 1
size_hint_y: 0.8
source: './Actions-media-playback-pause-icon.png'
on_release:
source: './Actions-media-playback-start-icon.png'
Label:
size_hint_x: 1
size_hint_y: 0.2
text: "Label here"

```

> To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/BD91EC31-927F-4AA5-95D7-128C77D0C29A%40cox.net.

[Elliot Garbus]

The ImageButton code should look like this:

ImageButton:
    source: 'Actions-media-playback-start-icon.png'
    on_press: self.source = 'Actions-media-playback-pause-icon.png'
    on_release: self.source = 'Actions-media-playback-start-icon.png'

when the event, on_press occurs, the code on the right side is executed,  That code changes the file to be displayed to the pause icon.  Note that it is setting self.source = ''Actions-media-playback-pause-icon.png'

Your code below is:

ImageButton: 
    size_hint_x: 1 
    size_hint_y: 0.8 
    source: './Actions-media-playback-pause-icon.png' 
    on_release: 
      source: './Actions-media-playback-start-icon.png' 

change to:

ImageButton: 
    size_hint_x: 1 
    size_hint_y: 0.8 

    source: './Actions-media-playback-play-icon.png' 
    on_release: self.source = './Actions-media-playback-play-icon.png'

    on_press: self.source = './Actions-media-playback-pause-icon.png' 

> >> To unsubscribe from this group and stop receiving emails from it, send an email to kivy-...@googlegroups.com.

> >> To post to this group, send email to kivy-...@googlegroups.com.
> >> Visit this group at https://groups.google.com/group/kivy-users.
> >> To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/B521973A-899A-4017-B06C-5354A165C79F%40cox.net.
> >> For more options, visit https://groups.google.com/d/optout.
> >
> >
> >
> > --
> > Best regards,
> > Luigi
> >
> > --
> > You received this message because you are subscribed to the Google Groups "Kivy users support" group.

> > To unsubscribe from this group and stop receiving emails from it, send an email to kivy-...@googlegroups.com.

> > To post to this group, send email to kivy-...@googlegroups.com.
> > Visit this group at https://groups.google.com/group/kivy-users.
> > To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/CAMk%2Bs2SmMgTs7YNHqQ4QyE%3DA1eGPERaZaqAoFE4Y-rLNrwMCwg%40mail.gmail.com.
> > For more options, visit https://groups.google.com/d/optout.
>
> --
> You received this message because you are subscribed to the Google Groups "Kivy users support" group.

> To unsubscribe from this group and stop receiving emails from it, send an email to kivy-...@googlegroups.com.

[Luigi Marongiu]

Thank you! it worked

> To unsubscribe from this group and stop receiving emails from it, send an email to kivy-users+...@googlegroups.com.

> To post to this group, send email to kivy-...@googlegroups.com.
> Visit this group at https://groups.google.com/group/kivy-users.

> To view this discussion on the web visit https://groups.google.com/d/msgid/kivy-users/b64d6a2a-5e2d-4d16-9c1d-8e8daccf5e9a%40googlegroups.com.