scrollbar does not work with dynamic views

[madtux666]

Hi lads,

I have experienced problem with scrollbar that does not scroll dynamically created views. I have provided sample code. Please notice that second (orange) view will not update scrollbar after creating views. It is definitely a bug, any ideas? Do you have a workaround? I have checked classes responsible for scrollbar functionality, it is pretty big piece of code, it will be very difficult to rewrite it ;-)


<canvas width="800" height="800">

<simplelayout axis="y" spacing="10"/>

<view name="staticview" width="500" height="200" bgcolor="yellow" clip="true">

<view name="container">

<simplelayout axis="y" spacing="2"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>
<view width="100" height="50" bgcolor="red"/>

</view>

<scrollbar/>

</view>

<view name="dynamicview" width="500" height="200" bgcolor="orange" clip="true">

<scrollbar/>

</view>

<button name="createViews" text="Create 10 views in dynamicView">

<handler name="onclick">
<![CDATA[

//create contaier view with
var newview= new LzView(canvas.dynamicview, { name: 'container',
width: 150 } );

//with layout
new lz.simplelayout(newview, { axis: 'y',
spacing: 2 } );

//create child views
for( var i= 0; i< 10; i++)
new LzView(newview, { width: 100,
height: 50,
bgcolor: '0x0000FF' } );

Debug.write( 'Scrollbar is still disabled' );
Debug.write();
Debug.write( 'dynamicview.container subviews:', dynamicview.container.subviews );
Debug.write( 'dynamicview.container.height:', dynamicview.container.height );

]]>
</handler>

</button>

</canvas>



Thanks for any comments.


Regards,
Madtux

[Daimyo]

i think you need to make it a dataset.

i have a dynamic text view that updates.. from an xml.

[madtux666]

Hi Daimyo,

Your solution is really elegant, sadly I can not follow your advice. In simple cases this approach is perfect, I use it widely in my app. However this time I need working scrollbar with dynamic views.

Going into details:

1. application makes data requests, proper method: "addSource" creates datasets (one per url) and tree components (not Laszlo tree/opttree),

2. trees are placed in order created by simplelayout (axis='y'), nodes in tree are "lazy replicated" for every XML node in related dataset,

Following your advice I might take data from dynamic datasets, join them using temporary buffer dataset and then use only one tree. However I would like to keep data in few separated trees. Key point for tree is to allow user to change size independently (first tree could be big, another trees will be adequately smaller and scrollable).



Regards,
Madtux

[pugmaster]

If you examine the scrollbar's scrolltarget attribute in the debugger, you will notice that it doesn't have a value. The scrolltarget must be set to its parent node (container). You have a timing problem, when the scrollbar is instantiated, the container must also exist. Right now, they are split. So you need to either statically instantiate the "container" view before the scrollbar or dynamically instantiate the scrollbar after the "container" view.

Shameless plug: Laszlo in Action contains a nice section on debugging broken scrollbars.

-- Norman Klein
Author: Laszlo in Action

[madtux666]

Hi Norman,

Timing problem - that is true. I have created scrollbar after all views and this approach solved problem. Thank you for detailed explanation. I was not aware of timing in this case. I thought that scrollbar works with everything that we throw inside view (by constrains or handlers) and whenever we do it. I was wrong.

I have checked advised paragraph 12.2.4: "Basics of a scrollbar". Why I have not remembered below fragment? I don not know.
"If you encounter any problems with a broken scrollbar, examine the key attributes in table 12.1. They are powerful tools for diagnosing scroll-related problems."

To be honest I think it is essential position for Laszlo developers. I have found it as a complete reference, explaining a lot of Laszlo's catches step by step. Good job! ;-)



Regards,
Madtux