3. StackContainer

Last page update: November 15, 2011

Note

StackContainer features:

• Type: Dojo widget
• Common attributes: check the common attributes section

• definition

• attributes

• examples:

  • simple example

3.1. definition

pane.stackContainer([**kwargs])

A container that has multiple children, but shows only one child at a time (like looking at the pages in a book one by one)

3.2. attributes

stackContainer’s attributes:

• selectedPage: allow to select a determined page. You have to define the pageName attribute in stackContainer’s children

attributes of the stackContainer’s children:

• pageName: allow to identify the selected page

3.3. examples

3.3.1. simple example

• stackContainer [basic]

• Description: the selectedPage is linked to the stackContainer with a FilteringSelect set on a slotToolbar

  Note

  example elements’ list:

  • classes: GnrCustomWebPage
  • components: TestHandlerFull
  • webpage variables: py_requires
  • widgets: BorderContainer, ContentPane, FilteringSelect, StackContainer

• Code:

  # -*- coding: UTF-8 -*-
  """Stack container"""
  
  class GnrCustomWebPage(object):
      py_requires = "gnrcomponents/testhandler:TestHandlerFull"
  
      def test_1_basic(self, pane):
          """Stack page"""
          bc = pane.borderContainer(height='300px')
          top = bc.contentPane(region='top') # height is given automatically through the slotToolbar
          sb = top.slotToolbar(slots='10,my_slot,*')
          sb.my_slot.filteringSelect(value='^.selectedPage',values='one:page one,two:page two,three:page three')
          center = bc.contentPane(region='center')
          sc = center.stackContainer(region='center', selectedPage='^.selectedPage')
          stack_one = sc.contentPane(background='#F0F1A5', pageName='one')
          stack_one.div('A div included in the first stack page',
                         margin='1em', display='inline-block',
                         border='3px solid gray', width='400px', height='100px',
                         rounded=5, font_size='1.3em', text_align='justify')
          stack_two = sc.contentPane(background='#ABDCEA', pageName='two')
          stack_two.div('A div included in the second stack page',
                         margin='2em', display='inline-block',
                         border='3px solid gray', width='400px', height='100px',
                         rounded=5, font_size='1.3em', text_align='justify')
          stack_three = sc.contentPane(background='#77C67C', pageName='three')
          stack_three.div('A div included in the third stack page',
                           margin='3em', display='inline-block',
                           border='3px solid gray', width='400px', height='100px',
                           rounded=5, font_size='1.3em', text_align='justify')