Web Applications Blog

One of the last additions we made to widgets in the stages before releasing Opera 9.0 was giving widgets the ability to resize and move themselves.

The main use for resizing behavior is in those cases where you want to emulate UI widgets (yes, that other kind of widget) like maximize, restore, and regular resize and drag handlers.

interface Window {
  void resizeTo( in int w, in int h );
  void resizeBy( in int delta_w, in int delta_h );
  void moveTo( in int x, in int y );
  void moveBy( in int delta_x , in int delta_y );
};

window.resizeTo()

The window.resizeTo() method takes two positive integers as arguments: A width w and height h. These sizes are the desired dimensions of the widgets in pixels, and correspond to the width and height elements in a widget's configuration file. The method sets the window.outerWidth and window.outerHeight properties. Example:

// Resize the widget to 400x300 px
window.resizeTo( 400, 300 );

window.resizeBy()

The window.resizeBy method takes two integers as arguments: A delta_w that is the desired change in width, measured in pixels, and a delta_h that is the desired change in height, again measured in pixels. The width and height of the widget is then recalculated to be equivalent to the following pseudocode:

window.resizeTo( window.outerWidth + delta_x, window.outerHeight + delta_y );

In all cases of window resizing, the resizing happens from the lower-right corner of the widget window, while the upper-left corner remains static.

// Grow the widget by 100px horizontally
window.resizeBy( 100, 0 );

window.moveTo()

The window.moveTo method takes two integers as arguments: An x that is the desired x coordinate for the upper-left corner of the widget, and an y that is the desired y coordinate for the upper-left corner of the widget, with both values mentioned in pixels.

// Move the widget to the upper-left corner of the screen
window.moveTo( 0, 0 )

window.moveBy()

The window.resizeBy method takes two integers as arguments: A delta_x that is the desired change in x position, measured in pixels, and a delta_y that is the desired change in y position, again measured in pixels. Both values can be negative. Example:

// Move the 50px left and 50px down
window.moveBy( -50, 50 )

Closing note

If you change these settings for a widget, the settings are volatile, and the change will be lost if the widget is closed and then reopened. This means that if your widget relies on being a certain size, which may be different from the install-time default, you should make sure that you store the widget size in the persistent storage. The widget storage interface is compatible with Apple's interface, using the methods preferenceForKey and setPreferenceForKey.