Docking and auto-hiding

Mark Birbeck's picture

To make an application dock itself to one of the edges of the desktop we use the property anchor with a value of true.

We can also indicate where we would like the application to start, by using the position property.

To auto-hide--i.e., slide off the desktop when the user moves their mouse away from the application--we use the property autohide with a value of true.

Setting options in the document

By adding the following settings to the Flickr Search web application we would dock the application to the top right of the screen, and make it auto-hide:

    <link rel="stylesheet" href="flickr.css" type="text/css" />
    <meta name="position" content="top-right" />
    <meta name="anchor" content="true" />
    <meta name="autohide" content="true" />
    <xf:model>

Note that the location of a window with a position of 'top right' and one with a position of 'right top' will be the same. The difference is only apparent when docking; the first will be docked to the top edge, whilst the second will be docked to the right edge. This means that when auto-hiding, a window that is positioned 'top right' will slide off the top, whilst a window that is positioned 'right top' will slide off the right.

The modified application is available here.

Setting options on the command-line

If the webapp is being loaded via the command-line then we can open the basic (unmodified) web application using the following command:

swviewer2 http://svn.x-port.net/svn/public/samples/flickr/flickr.webapp#meta(position=top-right,anchor,autohide)