IIIMF CommonAux UI description Draft

Target Aux

  • Palette
  • IM Configration dialog.
  • Preedit, Virtual Keyboard etc. will use pre-defined implementation.

Data type and supported renderType

type/tag: renderType:
string label, lineEdit, textArea, passwd, file, font
int spinButton, progressBar, sliderBar, color
boolean toggleButton
(in check menu group, it's checkMenuItem;
while in radio menu group, it's radioMenuItem)
command pushButton, URLLink
(in menu group, it's normal menuitem)
group menu, tab, card, folder, frame
checkGroup checkGroup(default), listBox, menu
(only contains boolean item)
radioGroup radioGroup(default), listBox, comboBox, menu
(only contains boolean item)

Composite pattern

+--------------+
| propertyItem |
+--------------+
| key/id/*     |
| label        |           +---------------+
| value        |<|-------<>| propertyGroup |
| type*        |           +---------------+
| renderType*  |           | layout        | (Horizental, Vertical)
| tooltip      |           | children      |
| icon         |           +---------------+
| state        |
| visible      |
+--------------+

Example 1: A radio group

<!-- The value of this radioGroup is the selected key. -->
<radioGroup id="radioGroup1" renderType="listBox">
  <boolean id="key1" label="key1" value="val1"/>
  <boolean id="key2" label="key2" value="val2"/>
  <boolean id="key3" label="key3" value="val3"/>
</radioGroup>

Example 2: A check group

<!-- checkGroup does not have value of itself -->
<checkGroup id="checkGroup1" renderType="checkGroup">
  <boolean id="key4" label="key4" value="val4"/>
  <boolean id="key5" label="key5" value="val5"/>
  <boolean id="key6" label="key6" value="val6"/>
</checkGroup>

Example 3: IM palette

<group id="palette" layout="Horizental">

  <boolean id="Eng_Ch" label="中英" icon="Chinese.jpg" renderType="toggleButton"/>
  <boolean id="Full_Half" label="全半角" icon="Full.jpg" renderType="toggleButton"/>

  <group id="menu1" renderType="menu>
    <group id="subMenu1" label="subMenu1" renderType="menu">
      <command id="cmd1" label="cmd1"/>
      <command id="cmd2" label="cmd2"/>

      <checkGroup id="subMenu2" label="subMenu2" renderType="menu">
        <boolean id="key7" lable="key7" value="val7"/>
        <boolean id="key8" label="key8" value="val8"/>
      </checkGroup>
    </group>

    <!-- anonymous group (i.e. label is empty) here is a flat menu group, not cascading submenu -->
    <radioGroup id="nolabel1" renderType="menu">
      <boolean id="key9" label="key9" value="val9"/>
      <boolean id="key10" label="key10" value="val10"/>
      <boolean id="key11" label="key11" value="val10"/>
    </radioGroup>

    <command id="cmd3" label="cmd3"/>
  </group>

</group>

+---+---+-------+
|E/C|F/H| Menu1 |
+---+---+-------+------+
          | subMenu1 >+------------+
          +-----------| cmd1       |
          | * key9    | cmd2       |
          | * key10   | subMenu2 >+---------+
          | * key11   +-----------| [] key7 |
          +------------+          | [] key8 |
          | cmd3       |          +---------+
          +------------+

Example 4: IM Configuration Dialog

<group id="im_config" label="IME Configuration" renderType="frame">

  <group id="tabs" renderType="tab">

    <group id="tab1" label="tab1">
      <radioGroup id="input_style" label="Input Style" renderType="comboBox">
        <boolean id="classic_style" label="Classic Style"/>
        <boolean id="converting_on_fly" label="Converting on Fly"/>
      </radioGropu>

      <radioGroup id="charset" label="Charset" renderType="comboBox">
        <boolean id="gb2312" label="GB2312"/>
        <boolean id="gbk" label="GBK"/>
      </radioGroup>
    </group>

    <group id="tab2" label="tab2">
    </group>

  </group>

</group>

How to calculate the size of a group?

void group_size (group, w, h)
{
  w = h = 0;

  for (item in group) {
    int x, y;
    if (item is group)
      group_size (group, x, y) /* recursive call */
    else
      item_size (item, x, y) /* icon size, label string size */

    if (group.layout = Horizental) {
      h = max (h, y);
      w += x;
    } else { /* default is Vertical */
      w = max (w, x);
      h += y;
    }
  }

}

How to locate the icon?

iiimp://iiim_server_hostname_or_IP/le_name/the/relative/path/under/le
e.g., iiimp://localhost/cle/images/full.png

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

To submit your comment, click the image below where it asks you to...
Clickcha - The One-Click Captcha