Note, I am using Firefox on MacOSX 10.5
On Thu, Mar 13, 2008 at 8:55 AM, Henry Minsky <[EMAIL PROTECTED]> wrote:
> Which version of Openlaszlo are you using? I don't see any flickering
> when I run it in the "top of tree" dev branch. Have you
> tried a recent nightly build ? Perhaps some issue has been fixed with
> image display recently?
>
> Note, I had to modify your example to set visible to true on the image
> views, otherwise it remained false, since it appears no other code was
> setting it to visible.
>
>
>
>
>
> On Thu, Mar 13, 2008 at 7:29 AM, Marc Bachstein <[EMAIL PROTECTED]> wrote:
> > Hello,
> >
> > I have written an application in which you can switch the image by
> clicking
> > on a navigation button. It is also possible to zoom into the image. When
> you
> > switch to another image the zoom factor keeps at the same value.
> >
> > Now there is a problem. If the zoom factor is different from 1, the image
> is
> > firstly visible in 100% and after a subsecond the image is shown in the
> > desired zoom setting. This causes a weird flickering as the image is
> painted
> > twice.
> >
> > As there is just one call of newImgView.setSource(imgUrl, "none")
> > I wanted to know whether this is bug in Laszlo and how I can avoid the
> > double painting of the image.
> >
> > Here is a test program, which demonstrates the problem.
> >
> > When you click a few times on the next and previous button, you'll
> > (sometimes) see the loaded image in the upper left corner visible in 100%
> > before it is shown in the desired zooming size (here 200%).
> >
> > Best Regards,
> > Marc
> >
> > -------------------
> >
> > <canvas height="100%" width="100%">
> > <library>
> > <class name="MyImage" extends="view">
> > <attribute name="active" type="boolean"
> > value="false"/>
> >
> > <handler name="onload"><![CDATA[
> > show();
> > ]]>
> > </handler>
> >
> > <method name="show"><![CDATA[
> > this.animate('opacity', 1, 100);
> > ]]>
> > </method>
> >
> > <method name="hide"><![CDATA[
> > this.animate('opacity', 0, 100);
> > ]]>
> > </method>
> > </class>
> > </library>
> >
> > <attribute name="currentIndex" value="1" type="number"/>
> >
> > <simplelayout axis="y" spacing="5" inset="100"/>
> >
> > <!-- This box contains the buttons for image navigation -->
> > <view name="functionBox" width="450" x="120" y="0" height="45"
> > bgcolor="#CCCCCC" options="ignorelayout" align="center">
> > <simplelayout axis="x" spacing="5" inset="5"/>
> >
> > <!-- Button first/initial Image -->
> > <button name="tbbfirst" text="first/init" y="3" width="100"
> > height="30">
> > <handler name="onclick"><![CDATA[
> > canvas.currentIndex = 1;
> > canvas.loadImage();
> > ]]>
> > </handler>
> > </button>
> >
> > <!-- Button previous Image -->
> > <button name="tbbprev" text="previous" y="3" width="100"
> > height="30">
> > <handler name="onclick"><![CDATA[
> > if (canvas.currentIndex > 1) {
> > canvas.currentIndex--;
> > canvas.loadImage();
> > }
> > ]]>
> > </handler>
> > </button>
> >
> > <!-- Button next Image -->
> > <button name="tbbnext" text="next" y="3" width="100"
> > height="30">
> > <handler name="onclick"><![CDATA[
> > if (canvas.currentIndex < 8) {
> > canvas.currentIndex++;
> > canvas.loadImage();
> > }
> > ]]>
> > </handler>
> > </button>
> >
> > <!-- Text field, which shows Image number -->
> > <text name ="textfield" id="tf" text="image nr: undefined">
> > </text>
> > </view>
> >
> > <view name="imagecontainer" x="${parent.width - this.width}"
> > width="1000" height="830" bgcolor="#000000">
> > <MyImage name="image1" id="image1" stretches="both"
> > x="${parent.width / 2 - this.width / 2}"
> > y="${parent.height / 2 - this.height / 2}"
> > visible="false" opacity="0">
> >
> > <handler name="onload">
> > // image zooming
> > image1.setWidth(2 * image1.resourcewidth);
> > image1.setHeight( 2*
> image1.resourceheight);
> > image1.active = true;
> > image2.active = false;
> > image1.bringToFront();
> > image2.unload();
> > </handler>
> > </MyImage>
> >
> > <MyImage name="image2" id="image2" stretches="both"
> > x="${parent.width / 2 - this.width / 2}"
> > y="${parent.height / 2 - this.height / 2}"
> > visible="false" opacity="0">
> >
> > <handler name="onload">
> > // image zooming
> > image2.setWidth(2 * image2.resourcewidth);
> > image2.setHeight( 2*
> image2.resourceheight);
> > image2.active = true;
> > image1.active = false;
> > image2.bringToFront();
> > image1.unload();
> > </handler>
> > </MyImage>
> > </view>
> >
> > <method name="loadImage"><![CDATA[
> > var curImgView;
> > var newImgView;
> >
> > if (imagecontainer.image1.active) {
> > Debug.write(" => paint new image in view
> > image2");
> > curImgView = imagecontainer.image1;
> > newImgView = imagecontainer.image2;
> > } else {
> > Debug.write(" => paint new image in view
> > image1");
> > curImgView = imagecontainer.image2;
> > newImgView = imagecontainer.image1;
> > }
> >
> > var d = new Date();
> > var t = d.getDate() + "-" + (d.getMonth()+1) + "-"
> +
> > d.getFullYear() + "_" + d.getHours()
> > + ":" + d.getMinutes() + ":" + d.getSeconds() + "."
> > + d.getMilliseconds();
> >
> >
> > //actualize text of image nr
> > tf.setText("image nr: "+canvas.currentIndex);
> >
> > // sources must be set !
> > if (this.currentIndex == 1) {
> > var imgUrl =
> > "http://www.openlaszlo.org/themes/manji/images/ol_logo_small.gif";;
> > } else if (this.currentIndex == 2) {
> > var imgUrl =
> > "http://www.openlaszlo.org/files/ol_java_bot.png";;
> > } else if (this.currentIndex == 3) {
> > var imgUrl =
> > "http://www.openlaszlo.org/files/lsl_action-small.jpg";;
> > } else if (this.currentIndex == 4) {
> > var imgUrl =
> > "http://www.openlaszlo.org/themes/manji/images/ol_logo_small.gif";;
> > } else if (this.currentIndex == 5) {
> > var imgUrl =
> > "http://www.openlaszlo.org/files/ol_java_bot.png";;
> > } else if (this.currentIndex == 6) {
> > var imgUrl =
> > "http://www.openlaszlo.org/files/lsl_action-small.jpg";;
> > } else if (this.currentIndex == 7) {
> > var imgUrl =
> > "http://www.openlaszlo.org/themes/manji/images/ol_logo_small.gif";;
> > } else if (this.currentIndex == 8) {
> > var imgUrl =
> > "http://www.openlaszlo.org/files/ol_java_bot.png";;
> > }
> >
> > newImgView.unload();
> >
> > newImgView.setSource(imgUrl, "none");
> >
> > Debug.write(" load Image URL:
> > "+imgUrl.toString());
> > ]]>
> > </method>
> > </canvas>
> >
> > -------------------
> >
> >
> >
>
>
>
> --
> Henry Minsky
> Software Architect
> [EMAIL PROTECTED]
>
--
Henry Minsky
Software Architect
[EMAIL PROTECTED]
![http://www.openlaszlo.org/themes/manji/images/ol_logo_small.gif"](http://www.openlaszlo.org/themes/manji/images/ol_logo_small.gif"){kind=link}
![http://www.openlaszlo.org/files/ol_java_bot.png"](http://www.openlaszlo.org/files/ol_java_bot.png"){kind=link}
![http://www.openlaszlo.org/files/lsl_action-small.jpg"](http://www.openlaszlo.org/files/lsl_action-small.jpg"){kind=link}