PageRenderTime 70ms CodeModel.GetById 61ms app.highlight 6ms RepoModel.GetById 1ms app.codeStats 0ms

/examples/kitchensink/Layouts.py

http://pyjamas.googlecode.com/
Python | 112 lines | 96 code | 16 blank | 0 comment | 2 complexity | 5f320a2b2622ea08570b1d1c160d71b7 MD5 | raw file
  1from Sink import Sink, SinkInfo
  2from ui import Button, CheckBox, VerticalPanel, HorizontalPanel, HTML, DockPanel, HasAlignment, FlowPanel, HTMLPanel, MenuBar, MenuItem, ScrollPanel
  3from Logger import Logger
  4import DOM
  5
  6class Layouts(Sink):
  7    def __init__(self):
  8        text="This is a <code>ScrollPanel</code> contained at "
  9        text+= "the center of a <code>DockPanel</code>.  "
 10        text+= "By putting some fairly large contents "
 11        text+= "in the middle and setting its size explicitly, it becomes a "
 12        text+= "scrollable area within the page, but without requiring the use of "
 13        text+= "an IFRAME."
 14        text+= "Here's quite a bit more meaningless text that will serve primarily "
 15        text+= "to make this thing scroll off the bottom of its visible area.  "
 16        text+= "Otherwise, you might have to make it really, really small in order "
 17        text+= "to see the nifty scroll bars!"
 18        
 19        contents = HTML(text)
 20        scroller = ScrollPanel(contents)
 21        scroller.setStyleName("ks-layouts-Scroller")
 22        
 23        dock = DockPanel()
 24        dock.setHorizontalAlignment(HasAlignment.ALIGN_CENTER)
 25        north0 = HTML("This is the <i>first</i> north component", True)
 26        east = HTML("<center>This<br>is<br>the<br>east<br>component</center>", True)
 27        south = HTML("This is the south component")
 28        west = HTML("<center>This<br>is<br>the<br>west<br>component</center>", True)
 29        north1 = HTML("This is the <b>second</b> north component", True)
 30        dock.add(north0, DockPanel.NORTH)
 31        dock.add(east, DockPanel.EAST)
 32        dock.add(south, DockPanel.SOUTH)
 33        dock.add(west, DockPanel.WEST)
 34        dock.add(north1, DockPanel.NORTH)
 35        dock.add(scroller, DockPanel.CENTER)
 36        
 37        Logger.write("Layouts", "TODO: flowpanel")
 38        flow = FlowPanel()
 39        for i in range(8):
 40            flow.add(CheckBox("Flow " + i))
 41
 42        horz = HorizontalPanel()
 43        horz.setVerticalAlignment(HasAlignment.ALIGN_MIDDLE)
 44        horz.add(Button("Button"))
 45        horz.add(HTML("<center>This is a<br>very<br>tall thing</center>", True))
 46        horz.add(Button("Button"))
 47
 48        vert = VerticalPanel()
 49        vert.setHorizontalAlignment(HasAlignment.ALIGN_CENTER)
 50        vert.add(Button("Small"))
 51        vert.add(Button("--- BigBigBigBig ---"))
 52        vert.add(Button("tiny"))
 53
 54        menu = MenuBar()
 55        menu0 = MenuBar(True)
 56        menu1 = MenuBar(True)
 57        menu.addItem("menu0", menu0)
 58        menu.addItem("menu1", menu1)
 59        menu0.addItem("child00")
 60        menu0.addItem("child01")
 61        menu0.addItem("child02")
 62        menu1.addItem("child10")
 63        menu1.addItem("child11")
 64        menu1.addItem("child12")
 65
 66        Logger.write("Layouts", "TODO: htmlpanel")
 67        id = HTMLPanel.createUniqueId()
 68        text="This is an <code>HTMLPanel</code>.  It allows you to add "
 69        text+="components inside existing HTML, like this:" + "<span id='" + id
 70        text+="'></span>" + "Notice how the menu just fits snugly in there?  Cute."
 71        html = HTMLPanel(text)
 72        
 73        DOM.setStyleAttribute(menu.getElement(), "display", "inline")
 74        html.add(menu, id)
 75
 76        panel = VerticalPanel()
 77        panel.setSpacing(8)
 78        panel.setHorizontalAlignment(HasAlignment.ALIGN_CENTER)
 79        
 80        panel.add(self.makeLabel("Dock Panel"))
 81        panel.add(dock)
 82        panel.add(self.makeLabel("Flow Panel"))
 83        panel.add(flow)
 84        panel.add(self.makeLabel("Horizontal Panel"))
 85        panel.add(horz)
 86        panel.add(self.makeLabel("Vertical Panel"))
 87        panel.add(vert)
 88        panel.add(self.makeLabel("HTML Panel"))
 89        panel.add(html)
 90        
 91        self.initWidget(panel)
 92        self.setStyleName("ks-layouts")
 93
 94    def onShow(self):
 95        pass
 96
 97    def makeLabel(self, caption):
 98        html = HTML(caption)
 99        html.setStyleName("ks-layouts-Label")
100        return html
101
102
103def init():
104    text="This page demonstrates some of the basic GWT panels, each of which"
105    text+="arranges its contained widgets differently.  "
106    text+="These panels are designed to take advantage of the browser's "
107    text+="built-in layout mechanics, which keeps the user interface snappy "
108    text+="and helps your AJAX code play nicely with existing HTML.  "
109    text+="On the other hand, if you need pixel-perfect control, "
110    text+="you can tweak things at a low level using the "
111    text+="<code>DOM</code> class."
112    return SinkInfo("Layouts", text, Layouts)