| 24 | |
| 25 | class untitled(App): |
| 26 | def main(self): |
| 27 | mainContainer = Container(width=706, height=445, margin='0px auto', style="position: relative") |
| 28 | subContainer = HBox(width=630, height=277, style='position: absolute; left: 40px; top: 150px; background-color: #b6b6b6') |
| 29 | vbox = VBox(width=300, height=250) |
| 30 | bt1 = Button('bt1', width=100, height=30) |
| 31 | vbox.append(bt1,'bt1') |
| 32 | bt3 = Button('bt3', width=100, height=30) |
| 33 | vbox.append(bt3,'bt3') |
| 34 | bt2 = Button('bt2', width=100, height=30) |
| 35 | vbox.append(bt2,'bt2') |
| 36 | subContainer.append(vbox,'vbox') |
| 37 | hbox = HBox(width=300, height=250) |
| 38 | lbl1 = Label('lbl1', width=50, height=50, style='background-color: #ffb509') |
| 39 | hbox.append(lbl1,'lbl1') |
| 40 | lbl2 = Label('lbl2', width=50, height=50, style='background-color: #40ff2b') |
| 41 | hbox.append(lbl2,'lbl2') |
| 42 | lbl3 = Label('lbl3', width=50, height=50, style='background-color: #e706ff') |
| 43 | hbox.append(lbl3,'lbl3') |
| 44 | subContainer.append(hbox,'hbox') |
| 45 | mainContainer.append(subContainer,'subContainer') |
| 46 | comboJustifyContent = gui.DropDown.new_from_list(('flex-start','flex-end','center','space-between','space-around'), |
| 47 | style='left: 160px; position: absolute; top: 60px; width: 148px; height: 30px') |
| 48 | mainContainer.append(comboJustifyContent,'comboJustifyContent') |
| 49 | lblJustifyContent = Label('justify-content', style='left: 40px; position: absolute; top: 60px; width: 100px; height: 30px') |
| 50 | mainContainer.append(lblJustifyContent,'lblJustifyContent') |
| 51 | comboAlignItems = gui.DropDown.new_from_list(('stretch','center','flex-start','flex-end','baseline'), |
| 52 | style='left:160px; position:absolute; top:100px; width:152px; height: 30px') |
| 53 | mainContainer.append(comboAlignItems,'comboAlignItems') |
| 54 | lblAlignItems = Label('align-items', style='left:40px; position:absolute; top:100px; width:100px; height:30px') |
| 55 | mainContainer.append(lblAlignItems,'lblAlignItems') |
| 56 | mainContainer.children['comboJustifyContent'].onchange.do(self.onchange_comboJustifyContent,vbox,hbox) |
| 57 | mainContainer.children['comboAlignItems'].onchange.do(self.onchange_comboAlignItems,vbox,hbox) |
| 58 | |
| 59 | lblTitle = gui.Label("The following example shows the two main layout style properties for the VBox and HBox containers. Change the value of the two combo boxes.", |
| 60 | style='position:absolute; left:0px; top:0px') |
| 61 | mainContainer.append(lblTitle) |
| 62 | |
| 63 | self.mainContainer = mainContainer |
| 64 | return self.mainContainer |
| 65 | |
| 66 | def onchange_comboJustifyContent(self,emitter,new_value,vbox,hbox): |
| 67 | vbox.style['justify-content'] = new_value |