Desktop Packager Sencha Docs

Ion.ui.Window

A window in the application.

Defined By

Properties

Ion.ui.Window
: Object
Allows for (shared) data to be exchanged between window instances. ...

Allows for (shared) data to be exchanged between window instances.

// Create new win and share arbitrary data with it
var win = new Ion.ui.Window;
win.data = { "answer": "42" };

Available since: Sencha Desktop Packager 1.2.

Ion.ui.Window
: Objectreadonly
Gets the window's dimensions. ...

Gets the window's dimensions. The dimensions are for the entire window, and include the size of the frame and title bar if applicable.

Returns an object with the following structure:

  • width : Number
    The width of the window, including the frame.
  • height : Number
    The height of the window, including the frame.
// Let the user know how big the window is.
var win = Ion.ui.currentWindow;
var size = win.dimensions;
alert('The window is ' + size.width + 'px wide and ' + size.height + 'px tall!');
Ion.ui.Window
: Objectreadonly
Get the window's geometry (position + dimensions). ...

Get the window's geometry (position + dimensions).

Returns an object with the following structure:

  • x : Number
    The left side of the window.
  • y : Number
    The top of the window.
  • width : Number
    The width of the window, including the frame.
  • height : Number
    The height of the window, including the frame.
// Move the window ten pixels to the left, and make it ten pixels narrower
var win = Ion.ui.currentWindow;
var geom = win.geometry;
win.setGeometry(geom.x + 10, geom.y, geom.width - 10, geom.height);

See also setGeometry.

Ion.ui.Window
: Ion.ui.MenuBarreadonly
Returns a reference to the window's menu bar. ...

Returns a reference to the window's menu bar.

// Add a submenu to the main window's menu bar.
var newMenu = Ion.ui.currentWindow.menuBar.addMenu('My New Menu');

See also Ion.ui.MenuBar.addMenu.

Ion.ui.Window
: Objectreadonly
Gets the window's position for the screen on which it currently resides. ...

Gets the window's position for the screen on which it currently resides. If the window has a frame, this will be the top, left corner of the frame.

Returns an object with the following structure:

  • x : Number
    The left side of the window.
  • y : Number
    The top of the window.
// Move the window ten pixels to the left.
var win = Ion.ui.currentWindow;
var pos = win.position;
win.setPosition(pos.x + 10, pos.y);

See also setPosition.

Ion.ui.Window
: Objectreadonly
Get the geometry of the screen where this window currently resides. ...

Get the geometry of the screen where this window currently resides.

Returns an object with the following structure:

  • x : Number
    The relative left side of the screen amongst all available screens.
  • y : Number
    The relative top of the screen amongst all available screens.
  • width : Number
    The width of the screen.
  • height : Number
    The height of the screen.
// Get the user's current screen resolution
var win = Ion.ui.currentWindow;
var geom = win.screenGeometry;
alert('Your screen is ' + geom.width + 'x' + geom.height);
The sizing policy of the window. ...

The sizing policy of the window.

Allows you to set the horizontal and vertical sizing policies to either 'fixed' or 'resizable'. Also lets you specify minimum and maximum sizes for the window. See the Ion.ui.SizingPolicy documentation for details. // Create an empty window with sizing limits var win = new Ion.ui.Window; win.sizingPolicy.minimumWidth = 300; win.sizingPolicy.minimumHeight = 300; win.sizingPolicy.maximumWidth = 800; win.sizingPolicy.maximumHeight = 800; // The window cannot be resized by the user to less than 300 x 300 // or more than 800 x 800

    win.sizingPolicy.horizontal = 'fixed';
    // Now the window can only be resized vertically

Available since: Sencha Desktop Packager 1.2.

Ion.ui.Window
: Stringreadonly
Get the current state of the window. ...

Get the current state of the window. One of fullscreen, maximized, minimized or normal.

var win = Ion.ui.currentWindow;

// Perform some action only if the window is minimized.
if (win.state == 'minimized') {
    doSomething();
}
Ion.ui.Window
: Stringreadonly
Gets the window's title. ...

Gets the window's title. Will return the same value as document.title.

// Uppercase the window's title
var win = Ion.ui.currentWindow;
win.setTitle(win.title.toUpperCase());

See also setTitle.

Ion.ui.Window
: Stringreadonly
Get the current type of the window. ...

Get the current type of the window. Window type can be splashscreen or window.

var win = Ion.ui.currentWindow;

// Logs the window type
console.log('The window type is ' + win.type);
Ion.ui.Window
: Number
Get or set the current zoom factor of the window. ...

Get or set the current zoom factor of the window. The default value is 1, which means 100% zoom (normal scaling).

// Make everything twice as large
Ion.ui.currentWindow.zoomFactor = 2.0;

Available since: Sencha Desktop Packager 1.2.

Defined By

Methods

Ion.ui.Window
new( [options] ) : Ion.ui.Window
Create a new Ion.ui.Window object. ...

Create a new Ion.ui.Window object.

Available since: Sencha Desktop Packager 1.2.

Parameters

  • options : Object (optional)

    Options to define the new window:

    • url : String (optional)

      The url to be loaded in the new window.

    • visible : Boolean (optional)

      If true, the new window will be shown; if false the new window will be hidden.

    • title : String (optional)

      The title of the new window.

Returns

Ion.ui.Window
( )
Centers the window for the screen on which it currently resides. ...

Centers the window for the screen on which it currently resides.

Ion.ui.Window
( )
Closes the window and destroys it. ...

Closes the window and destroys it.

Ion.ui.Window
( )
Makes the window full screen with no window chrome around it. ...

Makes the window full screen with no window chrome around it. On multiple displays, the window will only go full screen for the screen on which the majority of the window resides.

NOTE: This is not the same as OS X 10.7+ fullscreen capability.

Ion.ui.Window
( )
Hides the window. ...

Hides the window.

Ion.ui.Window
( )
Maximizes the window to the max screen dimensions with the window chrome around it. ...

Maximizes the window to the max screen dimensions with the window chrome around it.

Ion.ui.Window
( )
Minimizes the window into the system tray or dock. ...

Minimizes the window into the system tray or dock.

Ion.ui.Window
( )
Bring the window back to a normal (un-minimized, un-maximized, un-fullscreened) state. ...

Bring the window back to a normal (un-minimized, un-maximized, un-fullscreened) state.

Ion.ui.Window
( width, height )
Sets the window's dimensions, including the frame. ...

Sets the window's dimensions, including the frame.

// shrink the window to half it's original size.
var win = Ion.ui.currentWindow;
var d = win.dimensions;
win.setDimensions(d.width / 2, d.height / 2);

If you want to set the inner dimensions of your window (the part you draw on, excluding the frame), use the following technique: // Make the inner dimensions of my window fit my 640 x 480 background artwork var w = 640 + (window.outerWidth - window.innerWidth); var h = 480 + (window.outerHeight - window.innerHeight);

var win = Ion.ui.currentWindow;
win.setDimensions(w, h);

Parameters

  • width : Number

    The desired width for the window, including the frame.

  • height : Number

    The desired height for the window, including the frame.

Ion.ui.Window
( x, y, width, height )
Sets the window's geometry (position + dimensions). ...

Sets the window's geometry (position + dimensions).

// Set the window's size to 640x480 and place it at (100, 200)
var win = Ion.ui.currentWindow;
win.setGeometry(100, 200, 640, 480);

See setDimensions for an example of how to set the size of the client area (the rectangle inside the frame) of the window.

Parameters

  • x : Number

    The left side of the window.

  • y : Number

    The top of the window.

  • width : Number

    The width of the window, including the frame.

  • height : Number

    The height of the window, including the frame.

Ion.ui.Window
( [iconPath] )
Sets the window's title bar icon. ...

Sets the window's title bar icon.

var win = Ion.ui.currentWindow;
win.setIcon('myicon.png');

// Clear the icon.
win.setIcon();

Valid image types include BMP, GIF, ICO, JPEG, and PNG. The image will be scaled to fit automatically for the respective platform. This typically means an icon size of 16x16.

Parameters

  • iconPath : String (optional)

    The path to the icon file. If this argument is omitted or the icon file is not able to be loaded, any icon currently present on the window will be cleared.

Ion.ui.Window
( x, y )
Set the window's position for the screen on which it current resides. ...

Set the window's position for the screen on which it current resides.

// Center the window on the screen, assuming it resides on the main screen.
var win = Ion.ui.currentWindow;
var desktopSize = Ion.ui.desktopSize;
var winSize = win.dimensions;
var left = desktopSize.width / 2 - winSize.width / 2;
var top = desktopSize.height / 2 - winSize.height / 2;

win.setPosition(left, top);

Parameters

  • x : Number

    The left side of the window.

  • y : Number

    The top of the window.

Ion.ui.Window
( state )
Sets the window's state. ...

Sets the window's state.

Parameters

  • state : String

    fullscreen, maximized, minimized or normal.

Ion.ui.Window
( title )
Sets the window's title. ...

Sets the window's title.

// Lowercase the window's title
var win = Ion.ui.currentWindow;
win.setTitle(win.title.toLowerCase());

See also title.

Parameters

  • title : String

    The string to use as the new title for the window.

Ion.ui.Window
( type )
Sets the type of window. ...

Sets the type of window.

var win = Ion.ui.currentWindow;
win.setType('splashscreen');

See also type.

Parameters

  • type : String

    splashscreen or window.

Ion.ui.Window
( )
Shows the window. ...

Shows the window.

Defined By

Events

Ion.ui.Window
( )
Fires when the window is being closed. ...

Fires when the window is being closed.

var win = Ion.ui.currentWindow;

// Arrange for your application to say "goodbye" to your user.
win.closing.connect(function() { alert('See you real soon!'); });
// When the window closes, the user will see the alert.
Ion.ui.Window
( )
Fires when the value contained in Ion.ui.Window.data changes. ...

Fires when the value contained in Ion.ui.Window.data changes.

 // In the main window:
 var input_value, win = new Ion.ui.Window({url: 'form.html'});
 win.onDataChange = function () {
   input_value = win.data.value;
   // do something interesting with the returned value
 }


 // In form.html:
 // Assume this function is called when the form is submitted.
 function onSubmit() {
   var value = document.getElementById('value_field').value;

   // This will cause the 'onDataChange' callback in the mainwindow to be executed.
   Ion.ui.currentWindow.data = {value: value};
 }

Available since: Sencha Desktop Packager 1.2.