mip’s blog

Ok, maybe i’m not the brightest person around, but some things were not clear for me and i couldn’t find it in the lzx manual. So I decided to write this additional faq, and maybe it helps somebody.

To evaluate the value for you, i just provide a short info about my programming background to compare: I got excellent skills in flash, actionscript and php, i’m a decent html and css editor, know lots about C, C++ and Objective C and i’m quite familiar with Java.

Now, let’s get it on!

#1 How do I address Objects below the hierachy line?
Yeah, i struggled with this a bit, ’cause most examples address objects in the parent.
Just use the subNodes array which every object inheriting the LzNode class has.

#2 I’m setting an Object Attribute, but nothing happens. What’s wrong?
There is i.e. the visible attribute and if you set it (like you are used to from flash or java) nothing happens. This is quite wired at first glance and it has to do something with a missing screen update. Because if you check the attribute after setting it via the debug window, everything seems fine, but it doesn’t look like it! Best and only solution is looking for a setter function (i.e. setVisible()) or using the more general setAttribute function. Read more on attributes and getting/setting them here.

# 3. formatted text displaying weird
Ok, maybe you’ve something like this in your source:
<text><font size="16">some text...</font></text>
and the whole thing is cut horizontally, then maybe you should try replacing it by this:
<text fontsize="16">some text...</text>
This may work better because the compiler does the correct text size calculation in the second case. In the first the size of the textnode is calculated on basis of the surrounding font definitions.

# 4. Richtexteditor or how to get text selection
For a client project i needed a richtexteditor and thought, cool, there is a component called "richinputtext", so let’s use that. You can set the textformat of all or parts of the text with a LzTextFormat object and its setTextFormat method. But for that you need to have the selection coordinates (starting index,length).

I first tried to use the onfocus and onblur events to get the selection attributes, but no success, because the selection gets lost before the onblur event fires and onblur only gets called when not using the mouse.
Secondly I tried using a mouseevent on the object for detecting mouseactions and storing the selection, but then you can’t select any text in the inputfield.
Finally, after wasting couple of hours this is my solution:

<richinputtext name="content" width="300" height="150">
<attribute name="sel_start" value="-1" type="number"/>
<attribute name="sel_length" value="-1" type="number"/>
<handler name="onblur">
this.sel_start = -1;
this.sel_length = -1;
</handler>
<method name="checkSelection">
if (this.getSelectionPosition() != -1) { this.sel_start = this.getSelectionPosition(); }
if (this.getSelectionSize() != -1) { this.sel_length = this.getSelectionSize(); }
</method>
<button text="bold" onmouseover="content.checkSelection()" onclick="content.setFormat('bold')"/>

Usually you have buttons or some other input objects to set the format of the text or process on. You will have to use the onmouseover of these objects to call a function storing the selection data. The onmouseover of the formatting button is preceeding the onblur of the inputfield and onclick (obviously) of the button. Since the user has to do these movements this is the simplest solution, i guess.

# 5. Selections and clearSelection madness
In my project i’ve a list with listitems that are extentions of the normal baselistitem class.
My listitem uses the onselected event to open a subpage and animate that page.
I can go back to another page and clean up i disselect the listitem and revert the animation.
I used the clearSelection function on the list object. When clearSelection is called the onselected event is fired allthough this is not what mankind usually expects. To have a workaround use the getSelection function of the parenting object and check whether it is an object or null. Try the code and see:


<canvas debug="true" layout="axis:y">
<class name="mylistitem" extends="listitem">
<text text="sometext" width="100"/>
<handler name="onselected" args="what">
Debug.write(what);
Debug.write(this.parent.getSelection());
</handler>
</class>
<list name="newslist">
<mylistitem/>
<mylistitem/>
<mylistitem/>
<mylistitem/>
</list>
<button onclick="newslist.clearSelection()" text="clear"/>
</canvas>