HOWTO - Sashipa development

How to set field bounds.

You don't like default field locations and/or sizes.

Using a second fieldContainer, included in the main fieldContainer

If there are many fields (for example checkBoxFields), then you can group them in several columns.

  <cardForm db='dbBase'>
    <title>Person card</title>
    <location x='10' y='10' />
    <cardSchemaTableRef schemaTable='tblPerson' queries='sudi'
                        updateAfterInsert='yes' multipleInsert='yes' />
    <fieldContainer>

      ... other fields ...

      <fieldContainer displaySubLabels='no'>
        <label>Languages</label>
        <size w='300' h='52' />
        <layout type='grid' gridRows='3' gridColumns='2' />
        <checkBoxField>
          <schemaColumnRef schemaColumn='tblPerson_Boolfrenchread' />
        </checkBoxField>
        <checkBoxField>
          <schemaColumnRef schemaColumn='tblPerson_Boolfrenchwritten' />
        </checkBoxField>
        <checkBoxField>
          <schemaColumnRef schemaColumn='tblPerson_Boolgermanread' />
        </checkBoxField>
        <checkBoxField>
          <schemaColumnRef schemaColumn='tblPerson_Boolgermanwritten' />
        </checkBoxField>
        <checkBoxField>
          <schemaColumnRef schemaColumn='tblPerson_Boolspanishread' />
        </checkBoxField>
        <checkBoxField>
          <schemaColumnRef schemaColumn='tblPerson_Boolspanishwritten' />
        </checkBoxField>
      </fieldContainer>

      ... other fields ...

    </fieldContainer>
  </cardForm>

Remarks about the included fieldContainer:

The attribute displaySubLabels='no' means that labels that are contained in the fieldContainer will not be displayed. We can do that because check-box fields display their labels.
A label is specified for the fieldContainer: it will be common for the six check-boxes.
A layout is specified. A layout is a location manager.
A size is specified for the fieldContainer. Otherwise the layout can't work.

A layout is a bounds manager. Available types are table, flow, grid, none:

table is the default layout. It displays fields on two columns, from left to right then top to bottom. It adapts its height and width to each fields. It can adjust too little field sizes like an Html table.
flow displays fields one by one from left to right. When maximal width is reached, it begins a new line.
grid creates a grid with gridColumns columns and gridRows rows (these values are specified as attributes). It displays fields from left to right then top to bottom. Previous field sizes are ignored, this layout redefines each size.
none removes the bounds manager. When this value is used, a manualFieldLocation element has to be specified for each sub-field.

Example with manual locations (without layout)

We want to display a 'name' field and a 'first-name' field at the left of the screen, and check-box fields on the right.

We'll define two included fieldContainers: one for name and first-name, then one for check-boxes. We set to 'none' the layout of the main fieldContainer and we set manually the locations of the two included fieldContainers. You can find here an example of 'flow' layout too.

  <cardForm db='dbBase'>
    <title>Person card</title>
    <location x='10' y='10' />
    <manualButtonsLocation x='0' y='60' horizontalAlignement='yes' />

    <cardSchemaTableRef schemaTable='tblPerson' queries='sudi'
                        updateAfterInsert='yes' multipleInsert='yes' />
    <fieldContainer displaySubLabels='no'>
      <layout type='none' />

      <fieldContainer>
        <manualFieldLocation xField='0' yField='0' />
        <textField>
          <schemaColumnRef schemaColumn='tblPerson_Name' />
        </textField>
        <textField>
          <schemaColumnRef schemaColumn='tblPerson_Firstname' />
        </textField>
      </fieldContainer>

      <fieldContainer>
        <manualFieldLocation xField='0' yField='300' />
        <fieldContainer displaySubLabels='no'>
          <label>French</label>
          <size w='240' h='32' />
          <layout type='flow' />
          <checkBoxField>
            <label>read</label>
            <schemaColumnRef schemaColumn='tblPerson_Boolfrenchread' />
            <size w='50' h='20' />
          </checkBoxField>
          <checkBoxField>
            <label>written</label>
            <schemaColumnRef schemaColumn='tblPerson_Boolfrenchwritten' />
            <size w='70' h='20' />
          </checkBoxField>
          <checkBoxField>
            <label>spoken</label>
            <schemaColumnRef schemaColumn='tblPerson_Boolfrenchspoken' />
            <size w='70' h='20' />
          </checkBoxField>
        </fieldContainer>
      </fieldContainer>

    </fieldContainer>
  </cardForm>

Remarks:

Because the layout of the fieldContainer is 'flow', size is redefined for each check-box. Otherwise these fields will take its default size, which is too big.

How to define default sizes

When you doesn't specify a size for your field, it takes its default size. Default sizes are defined in the defaultParameterSet element:

  <defaultParameterSet>
    <defaultParameter applyOn='field' type='size'>
      <size w='200' h='20' />
    </defaultParameter>
    <defaultParameter applyOn='writeChoiceFkField' type='size'>
      <size w='200' h='100' />
    </defaultParameter>
    <defaultParameter applyOn='textAreaField' type='size'>
      <size w='200' h='100' />
    </defaultParameter>
  </defaultParameterSet>

Definition order isn't significant. the element with applyOn='field' defines a default size for all fields, except if another size for a sub-category is specified. So here fields will take the size (200; 20), except writeChoiceFkField and textAreaField fields that will take (200; 100).

Several screens for one table row

A card screen has too many fields, or too many listForms. You need to put a few components in a second screen. This screen will be accessible through a button.

We can do that by adding a menuForm in the first screen:

  <screen name='SCtblPerson'>
    <title>Person card</title>
    <formSet>
      <cardForm db='dbBaseDemo'>
        <title>Person card</title>
        <location x='10' y='10' />
        <cardSchemaTableRef schemaTable='tblPerson' queries='sudi'
                            updateAfterInsert='yes' multipleInsert='no' />
        <fieldContainer>
          <textField>
            <schemaColumnRef schemaColumn='tblPerson_Name' />
          </textField>
          ...
        </fieldContainer>
      </cardForm>

      ... listForms ...

      <menuForm>
        <firstButtonLocation x='630' y='432' />
        <buttonSize w='100' h='30' />
        <menuButtonList>
          <menuButton screen='SCtblPerson_Details'>Details</menuButton>
        </menuButtonList>
      </menuForm>

    </formSet>
  </screen>

  <screen name='SCtblPerson_Details'>
    <title>Person card: Details</title>
    <formSet>
      <cardForm db='dbBaseDemo'>
        <title>Person card: Details</title>
        <location x='10' y='10' />
        <cardSchemaTableRef schemaTable='tblPerson' queries='sudi'
                            updateAfterInsert='yes' multipleInsert='no' />
        <fieldContainer>
          <textField readOnly='yes'>
            <schemaColumnRef schemaColumn='tblPerson_Name' />
          </textField>

          ... fields in the d�tails card ...

        </fieldContainer>
      </cardForm>

      ... listForms ...

    </formSet>
  </screen>

Important ! Field content is still saved on each screen change. So the first screen must contain all required fields (ie. not-null columns). Otherwise, adding won't work.

The verticalGap attribute isn't required because the menuForm contains a single button. No title is specified.

Remark: the tblPerson_Name field is displayed in the detail screen, in order to help user. It can be declared or not as read-only (readOnly='yes').

Top