user6142489
user6142489

Reputation: 532

Kivy: Can you subdivide a BoxLayout within another BoxLayout?

I'm trying to build the following mock up that I made:

enter image description here

I'm in the very early stages and I'm trying to figure out how I can sub-divide the top left corner (to display an image, the temperature, high low, city, sunrise, sunset). In what I've done so far, I displayed it as a button to see the region of interest. Everything I keep trying puts it into an entirely new region below (instead of subdividing the first cell). Thank you!

enter image description here

This is my python file to build it:

from kivy.app import App
from kivy.uix.gridlayout import GridLayout
from kivy.clock import Clock
from kivy.properties import StringProperty
from random import *
import time 
from weather import Weather

# In the kv file, everything to the right of the colon is pure python
# for loading python module in kv file, use format of #:  import keyword module_name

# Pull in the weather data
weather = Weather()
location = weather.lookup_by_location('New York, NY')
condition = location.condition()
forecasts = location.forecast()
astronomy = location.astronomy()

class WeatherWidget(GridLayout):
    TimeSeconds = StringProperty('')
    TimeMinutes = StringProperty('')
    TimeHours = StringProperty('')

    def current_location(self):
        return location.title().replace('Yahoo! Weather - ','')

    def current_temperature(self):
        return condition['temp'] + '° ' +condition['text']

    def update(self, dt):
        current_time = time.localtime()
        self.TimeHours = str(current_time.tm_hour).zfill(2)
        self.TimeMinutes = str(current_time.tm_min).zfill(2)
        self.TimeSeconds = str(current_time.tm_sec).zfill(2)

class DailyViewApp(App):
    def build(self):
        weather = WeatherWidget()
        Clock.schedule_interval(weather.update, 1)
        return weather

if __name__ == '__main__':
    DailyViewApp().run()

This is the Kivy code:

#:kivy 1.10.0
<WeatherWidget>:
    cols: 1
    BoxLayout:
        size_hint_y: None
        Button:
            text: root.current_temperature()
            size_hint_x: 1
        Label:
            text: 'Tomorrow'
            size_hint_x: 0.25
        Label:
            text: 'T+2'
            size_hint_x: 0.25
        Label:
            text: 'T+3'
            size_hint_x: 0.25
        Label:
            text: 'T+4'
            size_hint_x: 0.25
        Label:
            text: 'T+5'
            size_hint_x: 0.25
        BoxLayout:
            Label:
                text: root.TimeHours + ':' + root.TimeMinutes
                size_hint_x: 1
                font_size: 30
                bold: True

Upvotes: 0

Views: 416

Answers (1)

el3ien
el3ien

Reputation: 5405

Yes that is possible. You just nest another boxlayout.
Like this:

<WeatherWidget>:
    cols: 1
    BoxLayout:
        size_hint_y: None
        BoxLayout:
            size_hint_x: 1
            orientation: "vertical"
            Image:
                src: "yourimage"
            Button:
                text: root.current_temperature()
        Label:
            text: 'Tomorrow'
            size_hint_x: 0.25

Upvotes: 1

Related Questions