title: kivy image button size
body: <p>My goal is to have Buttons which are completely filled with an image. My screen is split in half. On the right hand side I would like to have nine buttons each completely filled with a different image, all buttons with same dimensions. I would like to reshape those image to fit the button, so the ratio would possibly have to change.</p>
  
  <p>This is how my GUI looks right now. The images do not fit the buttons</p>
  
  <p><a href="https://i.stack.imgur.com/QWu5V.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QWu5V.jpg" alt="enter image description here"></a></p>
  
  <p>I tried several adjustments in my kv file, but right now I am stuck.</p>
  
  <p>This is my kv file.</p>
  
  <pre><code>RadioRoot:
  &lt;RadioRoot@BoxLayout&gt;:
      BoxLayout:
          BoxLayout:
              BoxLayout:
                  orientation: "vertical"
                  Label:
                      size_hint_y: 4
                      text: "info about radio"
                  BoxLayout:
                      size_hint_y: 1
                      BoxLayout:
                          orientation: "vertical"
                          BoxLayout:
                              Button:
                                  text: "Previous"
                                  on_press: root.previous()
                              Button:
                                  text: "Play/Stop"
                                  on_press: root.play_stop()
                              Button:
                                  text: "Next"
                                  on_press: root.next()
                  Button:
                      size_hint_y: 1
                      text: "Shutdown"
                      on_press: root.shutdown()
  
          BoxLayout:
              BoxLayout:
                  orientation: "vertical"
                  BoxLayout:
  
  
                      Button:
                          text: "Channel1"
                          on_press: root.channel(1)
                          #size_hint_y: None
                          #size_hint_x: None
                          Image:
                              source: 'swr3.png'
                              size_hint_y: None
                              size_hint_x: None
                              y: self.parent.y + .5* self.parent.height -.5 * self.parent.width/self.image_ratio
                              x: self.parent.x
                              #heigth: self.parent.width/self.image_ratio
                              #heigth: self.parent.height
                              width: self.parent.width
                              keep_ratio: True
                              allow_stretch: True
                      Button:
                          text: "Channel2"
                          on_press: root.channel(2)
                          Image:
                              source: 'flux.png'
                              width: self.parent.width
                              size_hint_y: None
                              size_hint_x: None
                              y: self.parent.y + .5* self.parent.height -.5 * self.parent.width/self.image_ratio
                              x: self.parent.x
  
                              keep_ratio: True
                              allow_stretch: True
                      Button:
                          text: "Channel3"
                          on_press: root.channel(3)
                  BoxLayout:
  
                      Button:
                          text: "Channel4"
                          on_press: root.channel(4)
                      Button:
                          text: "Channel5"
                          on_press: root.channel(5)
                      Button:
                          text: "Channel6"
                          on_press: root.channel(6)
                  BoxLayout:
  
                      Button:
                          text: "Channel7"
                          on_press: root.channel(7)
                      Button:
                          text: "Channel8"
                          on_press: root.channel(8)
                      Button:
                          text: "Channel9"
                          on_press: root.channel(9)
  </code></pre>
  
  <p>This is the corresponding python file</p>
  
  <pre><code>from kivy.app import App
  from kivy.uix.boxlayout import BoxLayout
  from kivy.uix.label import Label
  
  
  class PhilippsRadioApp(App):
      pass
  
  class RadioRoot(BoxLayout):
  
      def previous(self):
          print("Previous")
  
      def play_stop(self):
          print("Play/Stop")
  
  
      def next(self):
          print("Next")
  
      def shutdown(self):
          print("Shutdown")
  
      def channel(self, num):
          print("Channel")
  
  
  if __name__ == '__main__':
      PhilippsRadioApp().run()
  </code></pre>