title: Positioning multiple widgets in a BoxLayout in Kivy.
body: <p>I have two widgets in a horizontal boxlayout. Afaik they will both stretch to fill half of the boxlayout. How do I go about resizing the widgets and repositioning within the boxlayout? Is it worth putting each widget in its own boxlayout so that it isn't affected by the widget beside it? Here is my code so far:</p>
  
  <pre><code>from kivy.app import App
  from kivy.uix.label import Label
  from kivy.lang import Builder
  from kivy.properties import ListProperty
  from kivy.uix.boxlayout import BoxLayout
  from kivy.uix.dropdown import DropDown
  from kivy.uix.button import Button
  from kivy.uix.textinput import TextInput
  
  from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
  
  class ShoppingListScreen(Screen):
      pass
  
  class theScreenManager(ScreenManager):
      pass
  
  root_widget = Builder.load_string('''
  #:import FadeTransition kivy.uix.screenmanager.FadeTransition
  
  theScreenManager:
      ShoppingListScreen:
  
  &lt;ShoppingListScreen&gt;:
      BoxLayout:
          orientation: 'vertical'
  
          BoxLayout:
              orientation: 'horizontal'
              size_hint: 1, .3
              Button:
                  text: '&lt;'
                  size_hint: .1, 1
                  font_size: 75
                  background_normal: ""
                  background_color: 0.18, .5, .92, 1
                  on_release: app.root.current = 'main' 
  
              Label:
                  text: 'Login'
                  halign: 'left'
                  font_size: 50
                  canvas.before:
                      Color:
                          rgb: 0.18, .5, .92
                      Rectangle:
                          pos: self.pos
                          size: self.size
              Widget:
                  size_hint: .1, 1
                  canvas.before:
                      Color:
                          rgb: 0.18, .5, .92
                      Rectangle:
                          pos: self.pos
                          size: self.size
          BoxLayout:
              orientation: 'vertical'
              canvas.before:
                  Color:
                      rgb: 1, 1, 1
                  Rectangle:
                      pos: self.pos
                      size: self.size
              BoxLayout:
                  orientation: 'horizontal'
                  padding_left: 250
                  Label:
                      text: 'Username:'
                      font_size: 25
                      color: 0.18, .5, .92, 1
                      size_hint: .2, .5
                      pos_hint: {'top': 1}
                  TextInput:
                      size_hint: .3, .1
          Button:
              text: 'Register'
              font_size: 35
              size_hint: 1, .3
              background_normal: ""
              background_color: 0.18, .5, .92, 1
              #on_release: app.root.current = 'main' 
  
          Label:
              text: 'Support'
              color: 0.18, .5, .92, 1
              halign: 'left'
              font_size: 25
              size_hint: 1, .3
              canvas.before:
                  Color:
                      rgb: 1, 1, 1
                  Rectangle:
                      pos: self.pos
                      size: self.size
  
  
  ''')
  
  class temprecipeapp(App):
      def build(self):
          return root_widget
  
  if __name__ == "__main__":
      temprecipeapp().run()
  </code></pre>
  
  <p>If you run this file you will see the username and textinput box are in skewered positions. I am trying to center them and put them both beside each other. How would I go about doing so? </p>