Julien,
As a follow up, I was able to do away with the slider and use the
mousescroll. Zooming is easy in laszlo.
<CODE>
<canvas debug="false" proxied="false" width="300" height="300">
<simplelayout axis="y" inset="10"/>
<resource name="zoomresource" src="background-fill.png"/>
*<attribute name="zoomValue" type="number" value="100" />*
*<handler name="onmousewheeldelta" reference="LzKeys" args="k">
if(k == "1") {
canvas.zoomValue += 30;
zoomable.setAttribute("zoomfactor", (0.0 + canvas.zoomValue) /
100.0);
}
else {
if(canvas.zoomValue - 30 >= 40) {
canvas.zoomValue -= 30;
zoomable.setAttribute("zoomfactor", (0.0 + canvas.zoomValue)
/ 100.0);
}
}
</handler>*
<view name="zoomable" resource="zoomresource" stretches="both"
align="center">
<attribute name="zoomfactor" type="number" value="1.0"/>
<attribute name="baseheight" type="number" value="100.0"/>
<attribute name="basewidth" type="number" value="100.0"/>
<attribute name="height" value="${this.baseheight * this.zoomfactor
}"/>
<attribute name="width" value="${this.basewidth * this.zoomfactor
}"/>
<view height="${parent.baseheight}" width="${parent.basewidth}"
clip="true">
<view width="20" height="20" bgcolor="red"/>
<view align="right" width="20" height="20" bgcolor="green"/>
<view align="left" valign="bottom" resource="http:content.png"/>
<text resize="true" align="center" y="35" text="${'Inner : ' +
parent.height + 'x' + parent.width }"/>
<text resize="true" align="center" y="50" text="${'Outer : ' +
zoomable.height + 'x' + zoomable.width }"/>
</view>
</view>
</canvas>
</CODE>
-Anthony Bargnesi
On Jan 6, 2008 3:15 PM, Anthony Bargnesi <[EMAIL PROTECTED]> wrote:
> Julien,
>
> Thanks so much for the example code. I took what you gave me and deployed
> it to my local LPS and the zooming worked awesome. It's cool that it will
> zoom every child element in the parent view.
>
> Thank again for this solution.
> - Anthony
>
>
> On Jan 5, 2008 1:34 PM, Julien Lépine <[EMAIL PROTECTED]> wrote:
>
> > Hi Anthony,
> >
> >
> >
> > Basically you create a transparent image the size of your parent view
> > not zoomed. (for simplicity say we have a 100x100px transparent png file).
> >
> >
> >
> > Attached you will find a zip containing a 100x100px png file, a small
> > png file with content, and a lzx test case for presenting what zooming looks
> > like.
> >
> >
> >
> > The main principles are :
> >
> >
> >
> > Get the parent view with stretches="both"
> >
> > Define an attribute called "zoomfactor".
> >
> > Bind the width and height of the parent view to the basewidth and
> > baseheight custom attributes multiplied by the zoom factor (height and width
> > can be the bound to the size of the inner view).
> >
> > Define an inner view, that will take the full width and height of the
> > parent view without the zoom factor.
> >
> >
> >
> > ---CODE
> >
> > <canvas debug="false" proxied="false" width="300" height="300">
> >
> > <simplelayout axis="y" inset="10"/>
> >
> > <resource name="zoomresource" src="background-fill.png"/>
> >
> > <slider width="200" align="center" minvalue="50" maxvalue="300"
> > value="100">
> >
> > <handler name="onvalue">
> >
> > <![CDATA[
> >
> > // access via zoomable because it is at the canvas
> > level.
> >
> > zoomable.setAttribute("zoomfactor", (0.0 + this.value) /
> > 100.0);
> >
> > ]]>
> >
> > </handler>
> >
> > </slider>
> >
> > <view name="zoomable" resource="zoomresource" stretches="both"
> > align="center">
> >
> > <attribute name="zoomfactor" type="number" value="1.0"/>
> >
> > <attribute name="baseheight" type="number" value="100.0"/>
> >
> > <attribute name="basewidth" type="number" value="100.0"/>
> >
> > <attribute name="height" value="${this.baseheight *
> > this.zoomfactor}"/>
> >
> > <attribute name="width" value="${this.basewidth *
> > this.zoomfactor}"/>
> >
> > <view height="${parent.baseheight}" width="${parent.basewidth}"
> > clip="true">
> >
> > <view width="20" height="20" bgcolor="red"/>
> >
> > <view align="right" width="20" height="20" bgcolor="green"/>
> >
> > <view align="left" valign="bottom" resource="http:
> > content.png"/>
> >
> > <text resize="true" align="center" y="35" text="${'Inner : '
> > + parent.height + 'x' + parent.width }"/>
> >
> > <text resize="true" align="center" y="50" text="${'Outer : '
> > + zoomable.height + 'x' + zoomable.width }"/>
> >
> > </view>
> >
> > </view>
> >
> > </canvas>
> >
> > ---CODE
> >
> >
> >
> > Get anything you want inside this inner view, it will be zoomed like a
> > charm.
> >
> >
> >
> >
> >
> > Note, for pngs files to load at run time instead of compile time, you
> > have to be in swf8 mode (this is just for the small image inside).
> >
> >
> >
> > Cheers,
> >
> > Julien
> >
> >
> > ------------------------------
> >
> > *De :* Anthony Bargnesi [mailto:[EMAIL PROTECTED]
> > *Envoyé :* samedi 5 janvier 2008 17:18
> > *À :* Julien Lépine
> > *Cc :* [email protected]
> > *Objet :* Re: [Laszlo-user] Is zooming in on views possible?
> >
> >
> >
> > Julien,
> >
> > Thanks for the info, it sounds like that might achieve the affect I
> > wanted. In order to get a better understanding of what you're saying, how
> > would that look in the laszlo code? I'm not sure what you mean by
> > transparent resource and what you would have to declare on the child views
> > within the parent.
> >
> > Thanks again.
> > - Anthony
> >
> > On Jan 5, 2008 5:51 AM, Julien Lépine <[EMAIL PROTECTED]> wrote:
> >
> > Hi Anthony,
> >
> >
> >
> > You can first try playing with a view that would have stretches="both"
> > defined (for the parent view, and that would have a transparent resource the
> > initial size of that view).
> >
> >
> >
> > When you will change the size of that view, it will zoom on the
> > resource, and on the side effect (or maybe a desired one, but the fact is
> > that it happens), all the child views will be zoomed along.
> >
> >
> >
> > So I guess this can achieve the effect you want.
> >
> >
> >
> > ++
> >
> > Julien
> >
> >
> > ------------------------------
> >
> > *De :* [EMAIL PROTECTED] [mailto:
> > [EMAIL PROTECTED] *De la part de* Anthony Bargnesi
> > *Envoyé :* samedi 5 janvier 2008 06:51
> > *À :* [email protected]
> > *Objet :* [Laszlo-user] Is zooming in on views possible?
> >
> >
> >
> > I was wondering if I have a parent view that has child views that can be
> > moved around, can I zoom in on the parent view and have the children resize
> > with it? I would like it to work similarly to how something like GoogleMaps
> > works.
> >
> > It could certainly be possible to accomplish this by resizing the
> > individual child views based on the zoom levels, but I was just curious if
> > openlaszlo supported this out of the box. Any direction would certainly
> > help at this point.
> >
> > Thanks,
> > Anthony
> >
> >
> >
>
>
