Personal tools

Tips and Tricks

From OpenLaszlo

Contents

[edit]

Command-Line Debugging

If you are debugging and you want to call lzc directly, and you want to see log messages for just a few specific classes in the console, you can do that, like so:

Create a file named $LPS_HOME/console- debug.properties containing something like this: 

log4j.logger.org.openlaszlo.compiler.CanvasCompiler=DEBUG

that is: 

log4j.logger.<package or class name>=<loglevel>

In your source code, create a logger for that class, or use the existing logger. CanvasCompiler.java declares: 

private static Logger mLogger = Logger.getLogger(CanvasCompiler.class);

Then call methods on mLogger: debug, info, error, warn 

mLogger.debug("(debug) Compiling canvas."); 
mLogger.info("(info) Compiling canvas.");
mLogger.error("(error) Compiling canvas.");

Then invoke the compiler with -lp console-debug.properties: 

lzc -lp console-debug.properties test/hello.lzx

...and you'll see log messages for the level you specified and higher, for that class or package only.

[edit]

Developing and Debugging SWF10 Programs

If you are developing an app for the SWF10 runtime, it can be useful to have the Flash Debug Player installed. This can be downloaded from the adobe web site [1] and [2]

You can use the Flex command line debugger to debug your Laszlo app while it runs in the browser. To do this, invoke your app from fdb using 

fdb "http://127.0.0.1:8080/lps/your/app/path.lzx?lzr=swf10"

The app will load into the browser, and then the fdb console will pause so you can set breakpoints if you wish. Type "C" to continue. 

badtzmaru:trunk6 hqm$ fdb "http://127.0.0.1:8080/trunk6/test/smoke/mixin-simple.lzx?lzr=swf10"
Adobe fdb (Flash Player Debugger) [build 0]
Copyright (c) 2004-2007 Adobe, Inc. All rights reserved.
Attempting to launch and connect to Player using URL
http://127.0.0.1:8080/trunk6/test/smoke/mixin-simple.lzx?lzr=swf10
Player connected; session starting.
Set breakpoints and then type 'continue' to resume the session.
[SWF] /trunk6/test/smoke/mixin-simple.lzx - 1,663,924 bytes after decompression
(fdb) c
Additional ActionScript code has been loaded from a SWF or a frame.
To see all currently loaded files, type 'info files'.
Set additional breakpoints as desired, and then type 'continue'.
(fdb) c
[SWF] /trunk6/test/smoke/mixin-simple.lzx - 357 bytes after decompression
[SWF] /trunk6/test/smoke/mixin-simple.lzx - 345 bytes after decompression
...
[edit]

Flex 4 SDK Info and Documentation

OpenLaszlo currently ships with a copy of the Flex 4 Compiler SDK (Adobe's code name is Gumbo), specifically the last 'stable build', which is flex_sdk_4.0.0.6898 May 14

I am not sure which Adobe documentation web page corresponds most closely to this flex build. They are up to a Flex 4 Beta 2 release now, but I don't know how much the API differs from the milestone build we're using.

I've been using this URL for documentation of the Flex SDK http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/index.html?filter_flex=4

[edit]

Using Actionscript 3 code in a SWF10 Application

There are several ways to get actionscript 3 runtime-specific code into an OpenLaszlo application.

If you are writing AS3-specific code, it is very important to understand how OpenLaszlo code is converted into actionscript 3. In AS3, generally every block of code must belong to an AS3 class and package.

The OpenLaszlo compiler parses your application and generates a set of intermediate as3 class files.

If you need to access some Flex4 classes in your code, you will need to add as3 "import" statements for each class. You can do that inside of an LZX class with the <passthrough> tag. For example, see the lps/components/incubator/uploader/fileupload.lzx example 

<library>
   <class name="fileupload">

    <switch>
      <when property="$as3">
        <passthrough>
          import flash.events.*;
          import flash.net.*;
        </passthrough>
      </when>
    </switch>

This is a cross-(Flash)-runtime portable class definition that has the correct import statements for as3.


[edit]
Declaring AS3 code in script

If you are writing your classes in straight "javascript", you would do something like this. Note that "when=immediate" is required for the script tag, so that it inserts the code block at the top level. 

     <script when="immediate"><![CDATA[

       dynamic class $lzc$class_drawview extends LzView with DrawviewShared {
           if ($as3) {
               #passthrough (toplevel:true) {
               import flash.geom.Matrix;
               import flash.geom.Rectangle;
               import flash.display.BitmapData;
               import flash.display.Graphics;
               import flash.display.Sprite;
               }#
           }
[edit]

Linking AS3 .swc libraries into your application

You can link you application against external .swc libraries, just by placing them into the directory WEB-INF/flexlib. For example, the Google Maps Flash 10 API is distributed as a file named map_1_7a.swc. Simply place this into your WEB-INF/flexlib directory, and the compiler will be able to link those classes into your application.

You still need to use "import" statements in your code to tell these the compiler to reference the classes in the libraries, for example, for the Google Maps api, this script block declares a class which references the com.google.maps.* classes: 

 <script when="immediate"><![CDATA[
        class FlashMapOL {
            #passthrough (toplevel: true) {
                import com.google.maps.*;
                import com.google.maps.controls.*;
                import com.google.maps.overlays.*;
                import com.google.maps.services.*;
                import flash.geom.*;
                import flash.events.*;
            }#
[edit]

Unsupported Features

[edit]

Compiler Warnings

In LPS3.0b2: The compiler can already warn when you are making a global assignment, which is almost never what you want to do. The warning is off for now, because I need to add a pragma for silencing it when you actually mean to make a global assignment. But if you want to just proof an app to look for bugs like this, use 

 lzc --options warnGlobalAssignments=true <your app>

and sift through the warnings by hand.

Other warnings you can enable in the same fashion: 

 warnUnusedLocals -- warns if you declare a local variable and never use it
 warnUnusedParameters -- ditto for function parameters
[edit]

Call Profiler

The call profiler generates statistics that can be used to measure the time spent in each function, and to generate a call graph.

[edit]

XPath Debugging

These can be handy for XPath debugging:

[edit]

Lazy Replication for Seamless scrolling of Images

To obtain smooth scrolling of images using BaseGrid you must alter basegrid.lzx in the LPS source.

First, add <simplelayout axis="y"/> after <view name="rowparent" width="${parent.width}"> on line 94. Second, change "lazy" to "normal" for the replication attribute at line 411.

These changes will allow smooth scrolling of images in a grid. If not modified the grid will lazily load images which will cause them to occasionally not render.

[edit]

Checking for Whether a Property Exists (without warnings)

See CheckingPropertyExists.

[edit]

Multi line edittext with scrollbar (Text Area)

Issue generally faced is that scrollbar wont show up or scroll bar doesn't move down as text is added 

Step 1 Create Multi line Text area
  • <view x="10" y="20" width="175" height="140" clip="true" bgcolor="0x6895F0">
  • <text id="chatMsg" multiline="true" fgcolor="white"/>
  • <scrollbar id="scroll"/>
  • </view>

Step 2 Add Scroll bar

Step 3 Move Text area down when text is added(As text is added scrollbar doesn't move automatically when text is added )

  • scroll.page(1);
Retrieved from "http://wiki.openlaszlo.org/Tips_and_Tricks"