[Openmcl-devel] Lisp User Interface LUI

Alexander Repenning ralex at cs.colorado.edu
Fri Jan 9 22:37:04 PST 2009


On Jan 8, 2009, at 9:30 PM, Terje Norderhaug wrote:

> It would be beneficial to separate the layout/grouping from the  
> presentation style.


it probably would be. Style sheets tend to be a bit much in cases when  
one has just simple unique interfaces. The best compromise may be to  
allow both ways similar to HTML: allow the the use of inline formating/ 
layout OR use separate styles.

>
>
> <application-window title="Currency Converter" width="300"  
> height="180">
>  <column align="stretch" valign="stretch" padding="9">
>    <row align="stretch" minimize="vertical" valign="bottom">
>     <label text="Exchange Rate per $1:" align="right" flex="2"/>
>     <editable-number name="rate" text="1.0" flex="1"/>
>    </row>
>    <row align="stretch" minimize="vertical" valign="bottom">
>     <label text="Dollars to Convert:" align="right" flex="2"/>
>     <editable-number name="dollars" text="1.0" flex="1"/>
>    </row>
>    <row align="stretch" minimize="vertical" valign="bottom">
>     <label text="Amount in the other Currency:" align="right"  
> flex="2"/>
>     <editable-number  name="amount" text="1.0" flex="1"/>
>    </row>
>    <row align="right" valign="bottom" vflex="1">
>      <button text="Convert" action="convert-currency-action" default- 
> button="true"/>
>    </row>
>  </column>
> </application-window>
>
> This can be split into two parts, first layout:
>
> <application-window title="Currency Converter" >
>  <column>
>    <row>
>     <label text="Exchange Rate per $1:" />
>     <editable-number name="rate"/>
>    </row>
>    <row>
>     <label text="Dollars to Convert:"/>
>     <editable-number name="dollars" />
>    </row>
>    <row>
>     <label text="Amount in the other Currency:" />
>     <editable-number  name="amount""/>
>    </row>
>    <row class="convert">
>      <button text="Convert" action="convert-currency-action"/>
>    </row>
>  </column>
> </application-window>
>
> Here is an example of what a style sheet could look like that  
> combined with the layout would produce the same result as the  
> original example:
>
> <style select="application-window" width="300" height="180"/>
> <style select="column" align="stretch" valign="stretch" padding="9"/>
> <style select="row" align="stretch" minimize="vertical"  
> valign="bottom"/>
> <style select="row.convert" align="right" valign="bottom" vflex="1"/>
> <style select="label" align="right" flex="2"/>
> <style select="editable-number"  text="1.0 flex="1"/>
> <style select="row.convert button" default-button="true"/>
>
> End users (and others) can now customize the presentation style of  
> the window by adding a (separate) stylesheet containing the styles  
> they want to be different.
>
> One further step could be to facilitate internationalization of the  
> application by moving the english language labels into the style  
> sheet. That way, translating to another human language can be  
> achieved by amending the original stylesheet with one containing  
> just the alternative language for the labels.


internationalization, which is pretty important to us, may require  
further separation because typically only the strings used for labels  
visible in the interface need to be internationalized.

alex

Prof. Alexander Repenning

University of Colorado
Computer Science Department
Boulder, CO 80309-430

vCard: http://www.cs.colorado.edu/~ralex/AlexanderRepenning.vcf





More information about the Openmcl-devel mailing list