Resizing an image to variable/fixed dimensions?

Question

Let's say you have a GridLayout with 3 rows and 1 column. The first and last rows will be Labels, and the middle row will contain an image.

What is the best way to resize the image such that it has a fixed height (may or may not be the same height as the Labels), and its width is the same as the width of the layout? Is it possible to do this within kivy, or is it necessary to bring in some other module, such as PIL, and use an image buffer? Would it be reasonable just to create a non-binded button with the image as a background (thus, letting kivy take care of the resizing), or is there a problem with this solution? Thanks.

Answer 1

What is the best way to resize the image such that it has a fixed height (may or may not be the same height as the Labels), and its width is the same as the width of the layout?

I'm not sure exactly what you're asking here. Are you talking about the Image widget? You could do this with

Image:
    source: 'whatever'
    size_hint_y: None  # Tells the layout to ignore the size_hint in y dir
    height: dp(40)  # The fixed height you want

You can also control different image scaling possibilities (stretch, keep ratio etc.) by checking out the properties of the Image widget.

Is it possible to do this within kivy, or is it necessary to bring in some other module, such as PIL, and use an image buffer? Would it be reasonable just to create a non-binded button with the image as a background (thus, letting kivy take care of the resizing), or is there a problem with this solution?

Even if I misunderstood your question, I think whatever you want should be easy to do in kivy. I don't think your button solution would solve your problem though, or why you'd think it would - you would still need to give instructions on the size of the Image widget to make it scale, but then you didn't gain anything from putting it in a Button. And any scaling of the button's background_image properties is something you can easily accomplish without the Button - as above, you can control aspect ratio scaling etc. with the different properties of the Image widget.

Answer 2

In addition to the answer of the @inclement

  Image:
        source: './data/icon.png'
        allow_stretch: True
        keep_ratio: True
        size_hint_y: None
        size_hint_x: None
        width: self.parent.width
        height: self.parent.width/self.image_ratio

With these properties you can scale image and place image to the box without any gap. the width of the image is fixed to parent widget's width and the height calculates by ratio of the image automatically.