# Titanium.UI.Window > The Window is an empty drawing surface or container. - Source: https://titaniumsdk.com/docs/sdk/13.0.1/Titanium.UI.Window - Titanium SDK version: 13.0.1 - Kind: view - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK 0.9 - Extends: Titanium.UI.View - Inheritance: Titanium.UI.View > Titanium.Proxy To create a window, use the [Titanium.UI.createWindow](https://titaniumsdk.com/docs/sdk/Titanium.UI.md#createWindow) method or a **``** Alloy element. A window is a top-level container which can contain other views. Windows can be *opened* and *closed*. Opening a window causes the window and its child views to be added to the application's render stack, on top of any previously opened windows. Closing a window removes the window and its children from the render stack. Windows *contain* other views, but in general they are not *contained* inside other views. There are a few specialized views that manage windows: * [NavigationWindow](https://titaniumsdk.com/docs/sdk/Titanium.UI.NavigationWindow.md) * [SplitWindow](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.SplitWindow.md) * [TabGroup](https://titaniumsdk.com/docs/sdk/Titanium.UI.TabGroup.md) * [Tab](https://titaniumsdk.com/docs/sdk/Titanium.UI.Tab.md) By default, windows occupy the entire screen except for the navigation bar, status bar, and in the case of windows contained in tab groups, the tab bar. To take up the entire screen, covering any other UI, specify `fullscreen:true` when creating the window. ### Pass Context Between Windows To pass data between windows, use a [CommonJS module](https://titaniumsdk.com/guide/Titanium_SDK/Titanium_SDK_Guide/Best_Practices_and_Recommendations/CommonJS_Modules_in_Titanium.html) to save information from one window then retrieve it in another. In the example below, the foo module exposes two methods to store and retrieve an object. The first window of the project loads the foo module and uses the set method to store some data before opening the second window. The second window loads the same module and is able to retrieve the content saved by the first window with the get method. Note that for Alloy projects, you can simply pass the context as the second argument of the Alloy.createController method, then retrieve the data with the special variable `$.args` in the controller code. `app/lib/foo.js`: ``` js // For a classic Titanium project, save the file to 'Resources/foo.js' var data = {}; function setData (obj){ data = obj; } function getData () { return data; } // The special variable 'exports' exposes the functions as public exports.setData = setData; exports.getData = getData; ``` `app/views/index.xml`: ``` xml ``` `app/controllers/index.js`: ``` js var foo = require('foo'); foo.setData({foobar: 42}); function openWindow () { var win2 = Alloy.createController('win2').getView(); // For Alloy projects, you can pass context // to the controller in the Alloy.createController method. // var win2 = Alloy.createController('win2', {foobar: 42}).getView(); win2.open(); } $.index.open(); ``` `app/views/win2.xml`: ``` xml ``` `app/controllers/win2.js`: ``` js var foo = require('foo'); $.label.text = foo.getData().foobar; // For Alloy projects, you can also pass in context // with the Alloy.createController method and retrieve // it in the controller code. // $.label.text = $.args.foobar; ``` ### Modal Windows In the user interface, a modal window is a window that blocks the main application UI until the modal window is dismissed. A modal window requires the user to interact with it to resume the normal flow of the application. For example, if an action requires the user to login, the application can present a login window, then after the user is authenticated, the normal flow of the application can be resumed. To create a modal window, set the `modal` property to `true` in the dictionary passed to either the `Titanium.UI.createWindow()` method or the Window object's `open()` method. #### Android Behavior The Android platform does not has the concept of a modal window but instead uses modal dialogs. You are probably looking for a [Titanium.UI.AlertDialog](https://titaniumsdk.com/docs/sdk/Titanium.UI.AlertDialog.md) or [Titanium.UI.OptionDialog](https://titaniumsdk.com/docs/sdk/Titanium.UI.OptionDialog.md) and the `androidView` property rather than a modal window. However, if you know what you are doing and use `modal`, Titanium creates a window with a translucent background (if the background properties are not set). The combination of `fullscreen:true` and `modal:true` will not work as expected. If the background window displays the status bar or action bar, it will be visible behind the modal window. Note that Titanium will allow a non-modal window to open on top of a modal window on Android. #### iOS Behavior By default, if you do not set a `backgroundColor`, the modal's background color will be the value set to `Titanium.UI.backgroundColor`. The modal window will not show the background window stack even if you make the modal translucent. For fullscreen modals, when the modal appears, the background window stack is removed. For non-fullscreen modals on the iPad, the background will be opaque gray if a background color is not specified. By default, modal windows appear from the bottom of the screen and slide up. To change the default transition, set the `modalTransitionStyle` property to a `Titanium.UI.iOS.MODAL_TRANSITION_STYLE_*` constant in the dictionary passed to the Window object's `open()` method. Modal windows should not support orientation modes that the window they are opened over do not support. Doing otherwise *may* cause bad visual/redraw behavior after the modal is dismissed, due to how iOS manages modal transitions. Starting with Release 3.1.3, if the `orientationModes` property of a modal window is undefined, then the orientations supported by this window would be the orientation modes specified by the `tiapp.xml` with the `UISupportedInterfaceOrientations` key. iOS does not allow opening non-modal windows on top of a modal window. ##### iPad Features In addition to full-screen modal windows, iPad supports "Page sheet" and "Form sheet" style windows: * **Page sheet** style windows have a fixed width, equal to the width of the screen in portait mode, and a height equal to the *current* height of the screen. This means that in portrait mode, the window covers the entire screen. In landscape mode, the window is centered on the screen horizontally. * **Form sheet** style windows are smaller than the screen size, and centered on the screen. The example below is a modal window using the Form sheet style: You can create this type of modal window on iPad with the following code snippet: ``` js var win = Ti.UI.createNavigationWindow({ window: Ti.UI.createWindow({ title: "Modal Window" }) }); win.open({ modal: true, modalTransitionStyle: Ti.UI.iOS.MODAL_TRANSITION_STYLE_FLIP_HORIZONTAL, modalStyle: Ti.UI.iOS.MODAL_PRESENTATION_FORMSHEET }); ``` ### Animations Windows can be animated like a [View](https://titaniumsdk.com/docs/sdk/Titanium.UI.View.md), such as using an animation to open or close a window. The example below creates a window that opens from small to large with a bounce effect. This is done by applying a transformation at initialization time that scales the original size of the window to 0. When the window is opened, a new 2D transformation is applied that will scale the window size from 0 to 110% of it's original size, then, after 1/20th of a second, it is scaled back to it's original size at 100%. This gives the bounce effect during animation. `app/views/index.xml`: ``` xml ``` `app/controllers/index.js`: ``` js $.index.transform = Titanium.UI.createMatrix2D().scale(0); $.index.open(); var a = Ti.UI.createAnimation({ transform : Ti.UI.createMatrix2D().scale(1.1), duration : 2000, }); a.addEventListener('complete', function() { $.index.animate({ transform: Ti.UI.createMatrix2D(), duration: 200 }); }); function animateOpen() { $.index.animate(a); } ``` Note that to animate an Android window while you open it, you need to follow a specific procedure which is explained below in "Window Transitions in Android". ### iOS Platform Notes #### iOS Transition Animations iOS contains built-in transition animations when switching between non-modal windows. In the Window's `open` method, set the `transition` property to a `Titanium.UI.iOS.AnimationStyle` constant to use an animation. For example, to flip right-to-left between two windows: `app/views/index.xml`: ``` xml ``` `app/controllers/index.js` ``` js function animateOpen() { Alloy.createController('win2').getView().open({ transition: Ti.UI.iOS.AnimationStyle.FLIP_FROM_LEFT }); } $.index.open(); ``` `app/views/win2.xml`: ``` xml ``` In the above example, the red window will be animated from the right-to-left over the blue window. You can create transition animations when opening and closing windows in either a [Titanium.UI.iOS.NavigationWindow](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.NavigationWindow.md) or [Titanium.UI.Tab](https://titaniumsdk.com/docs/sdk/Titanium.UI.Tab.md). Use the [Titanium.UI.iOS.createTransitionAnimation](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.md#createTransitionAnimation) method to specify an animation objects to hide and show the window, then set the newly created TransitionAnimation object to the window's [Titanium.UI.Window.transitionAnimation](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#transitionAnimation) property. In the example below, the windows are closed by rotating them upside down while simulatenously making them transparent: `app/views/index.xml`: ``` xml ``` `app/controllers/index.js`: ``` js function openBlueWindow(e) { var bluewin = Alloy.createController('bluewin').getView(); $.index.openWindow(bluewin); } $.redwin.transitionAnimation = Ti.UI.iOS.createTransitionAnimation({ duration: 300, // The show transition makes the window opaque and rotates it correctly transitionTo: { opacity: 1, duration: 300, transform: Ti.UI.createMatrix2D() }, // The hide transition makes the window transparent and rotates it upside down transitionFrom: { opacity: 0, duration: 300 / 2, transform: Ti.UI.createMatrix2D().rotate(180), } }); $.index.open(); ``` `app/views/bluewin.xml`: ``` xml ``` `app/controllers/bluewin.js`: ``` js function closeWindow(){ $.bluewin.close(); } $.bluewin.transitionAnimation = Ti.UI.iOS.createTransitionAnimation({ duration: 300, // The show transition makes the window opaque and rotates it correctly transitionTo: { opacity: 1, duration: 300, transform: Ti.UI.createMatrix2D() }, // The hide transition makes the window transparent and rotates it upside down transitionFrom: { opacity: 0, duration: 300 / 2, transform: Ti.UI.createMatrix2D().rotate(180), } }); $.bluewin.transform = Ti.UI.createMatrix2D().rotate(180); ``` ### Android Platform Notes #### Window Transitions in Android A window is associated with a new Android [Activity](https://titaniumsdk.com/docs/sdk/Titanium.Android.Activity.md). The only way to animate the opening or closing of an Activity in Android is to apply an animation _resource_ to it. Passing a [Titanium.UI.Animation](https://titaniumsdk.com/docs/sdk/Titanium.UI.Animation.md) object as a parameter to [Titanium.UI.Window.open](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#open) or [Titanium.UI.Window.close](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#close) will have no effect. Instead, in the parameter dictionary you pass to [Titanium.UI.Window.open](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#open) or [Titanium.UI.Window.close](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#close), you should set the `activityEnterAnimation` and `activityExitAnimation` keys to animation resources. `activityEnterAnimation` should be set to the animation you want to run on the incoming activity, while `activityExitAnimation` should be set to the animation you want to run on the outgoing activity that you are leaving. Animation resources are available through the `R` object. Use either [Titanium.Android.R](https://titaniumsdk.com/docs/sdk/Titanium.Android.R.md) for built-in resources or [Titanium.App.Android.R](https://titaniumsdk.com/docs/sdk/Titanium.App.Android.md#R) for resources that you package in your application. As an example, you may wish for the window that you are opening to fade in while the window you are leaving should fade out: ``` js var win2 = Ti.UI.createWindow(); win2.open({ activityEnterAnimation: Ti.Android.R.anim.fade_in, activityExitAnimation: Ti.Android.R.anim.fade_out }); ``` See the official Android [R.anim](https://developer.android.com/reference/android/R.anim.html) documentation for information about built-in animations. For information on creating your own animation resource XML files, see "[View Animation](https://developer.android.com/guide/topics/resources/animation-resource.html#View)" in Android's Resources documentation. After creating an animation resource file, you can place it under `platform/android/res/anim` in your Titanium project folder and it will be packaged in your app's APK and then available via [Titanium.App.Android.R](https://titaniumsdk.com/docs/sdk/Titanium.App.Android.md#R). #### Material design transitions in Android You can provide transition between common elements among participating activities. For example in a master-detail pattern, clicking on a row item animates the common elements of image, title smoothly into details activity as if they are part of the same scene. This seamless animation is called shared element transition and can be achieved by the following steps. Say window A is opening window B. Firstly, specify a unique `transitionName` to the common UI elements between the two windows. Next use `addSharedElement` method on window B passing the window A common UI element and the transition name. This tells the system which views are shared between windows and performs the transition between them. Note that we specify the UI elements of window A since the system needs the source element and connects the destination element from the shared transition name once window B is created and shown. For example to transition a preview ImageView in window A to a full-width ImageView in window B. ``` js const windowA = Ti.UI.createWindow({ title: "overview" }); // Create an item in window A with a unique transitionName. const viewA = Ti.UI.createImageView({ top: 10, left: 10, scalingMode: Titanium.Media.IMAGE_SCALING_ASPECT_FILL, image: "https://api.lorem.space/image/shoes?w=500&h=500", height: 100, width: 100, transitionName: 'title' }); const btn = Ti.UI.createButton({ bottom: 10, title: "open new window" }) btn.addEventListener("click", function() { // Before opening window B specify the common UI elements. windowB.addSharedElement(viewA, "title"); windowB.open(); windowB.activity.onCreate = () => { const actionBar = windowB.activity.actionBar; if (actionBar) { actionBar.displayHomeAsUp = true; actionBar.title = "New Title"; actionBar.onHomeIconItemSelected = () => { windowB.close(); }; } }; }) windowA.add([viewA, btn]); windowA.open(); // Creating an item in window B, note that the same transitionName is used. const windowB = Ti.UI.createWindow({}); const viewB = Ti.UI.createImageView({ scalingMode: Titanium.Media.IMAGE_SCALING_ASPECT_FILL, top: 0, left: 0, image: "https://api.lorem.space/image/shoes?w=500&h=500", height: 200, width: Ti.UI.FILL, transitionName: 'title' }); const labelB = Ti.UI.createLabel({ top: 210, left: 10, text: "Detail window" }) windowB.add([viewB, labelB]); ``` Further you can use `activityEnterTransition`, `activityExitTransition`, `activityReenterTransition` and `activityReturnTransition` to customize the way activities transition into the scene. These are intended to be used with views set up as "shared elements" via the `addSharedElement()` method where these views will be moved from window to the other. As of Titanium 8.0.1, you don't have to add views as shared elements to use these transition animations, while in older version of Titanium that was required. See the official Android [Activity Transitions](https://developer.android.com/training/material/animations.html#Transitions) documentation for more information and supported transitons. #### Android "root" Windows In Android, you may wish to specify that a window which you create (such as the first window) should be considered the root window and that the application should exit when the back button is pressed from that window. This is particularly useful if your application is not using a Tab Group and therefore the splash screen window is appearing whenever you press the back button from your lowest window on the stack. To indicate that a particular window should cause an application to exit when the back button is pressed, pass `exitOnClose: true` as one of the creation arguments, as shown here: ``` js var win = Titanium.UI.createWindow({ title: 'My Root Window', exitOnClose: true }); ``` Starting with Release 3.2.0, the root window's `exitOnClose` property is set to `true` by default. Prior to Release 3.2.0, the default value of the property was `false` for all windows. ## Example: Full Screen Window example Create a fullscreen window with a red background. ``` js var window = Titanium.UI.createWindow({ backgroundColor:'red' }); window.open({fullscreen:true}); ``` ## Example: Alloy XML Markup Previous example as an Alloy view. ``` xml ``` ## Properties ### activity - Type: Titanium.Android.Activity - Platforms: Android - Permission: read-only Contains a reference to the Android Activity object associated with this window. An Activity object is not created until the window is opened. Before the window is opened, `activity` refers to an empty JavaScript object. You can be set properties on this object, but cannot invoke any Activity methods on it. Once the window is opened, the actual Activity object is created, using any properties set on the JavaScript object. At this point, you can call methods on the activity and access any properties that are set when the activity is created, for example, [actionBar](https://titaniumsdk.com/docs/sdk/Titanium.Android.Activity.md#actionBar). ### activityEnterTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `If not specified uses platform theme transition.` The type of transition used when activity is entering. Activity B's enter transition determines how views in B are animated when A starts B. Applicable for Android 5.0 and above. This transition property will be ignored if `animated` is set to false. Will also be ignored unless at least 1 view has been assigned to the `addSharedElement()` method, except on Titanium 8.0.1 and higher where shared elements are no longer required to do transitions. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_EXPLODE`, `Titanium.UI.Android.TRANSITION_FADE_IN`, `Titanium.UI.Android.TRANSITION_FADE_OUT`, `Titanium.UI.Android.TRANSITION_NONE`, `Titanium.UI.Android.TRANSITION_SLIDE_BOTTOM`, `Titanium.UI.Android.TRANSITION_SLIDE_LEFT`, `Titanium.UI.Android.TRANSITION_SLIDE_RIGHT`, `Titanium.UI.Android.TRANSITION_SLIDE_TOP` ### activityExitTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `If not specified uses platform theme transition.` The type of transition used when activity is exiting. Activity A's exit transition determines how views in A are animated when A starts B. Applicable for Android 5.0 and above. This transition property will be ignored if `animated` is set to false. Will also be ignored unless at least 1 view has been assigned to the `addSharedElement()` method, except on Titanium 8.0.1 and higher where shared elements are no longer required to do transitions. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_EXPLODE`, `Titanium.UI.Android.TRANSITION_FADE_IN`, `Titanium.UI.Android.TRANSITION_FADE_OUT`, `Titanium.UI.Android.TRANSITION_NONE`, `Titanium.UI.Android.TRANSITION_SLIDE_BOTTOM`, `Titanium.UI.Android.TRANSITION_SLIDE_LEFT`, `Titanium.UI.Android.TRANSITION_SLIDE_RIGHT`, `Titanium.UI.Android.TRANSITION_SLIDE_TOP` ### activityReenterTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `If not specified uses `activityExitTransition`.` The type of transition used when reentering to a previously started activity. Activity A's reenter transition determines how views in A are animated when B returns to A. Applicable for Android 5.0 and above. This transition property will be ignored if `animated` is set to false. Will also be ignored unless at least 1 view has been assigned to the `addSharedElement()` method, except on Titanium 8.0.1 and higher where shared elements are no longer required to do transitions. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_EXPLODE`, `Titanium.UI.Android.TRANSITION_FADE_IN`, `Titanium.UI.Android.TRANSITION_FADE_OUT`, `Titanium.UI.Android.TRANSITION_NONE`, `Titanium.UI.Android.TRANSITION_SLIDE_BOTTOM`, `Titanium.UI.Android.TRANSITION_SLIDE_LEFT`, `Titanium.UI.Android.TRANSITION_SLIDE_RIGHT`, `Titanium.UI.Android.TRANSITION_SLIDE_TOP` ### activityReturnTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `If not specified uses `activityEnterTransition`.` The type of transition used when returning from a previously started activity. Activity B's return transition determines how views in B are animated when B returns to A. Applicable for Android 5.0 and above. This transition property will be ignored if `animated` is set to false. Will also be ignored unless at least 1 view has been assigned to the `addSharedElement()` method, except on Titanium 8.0.1 and higher where shared elements are no longer required to do transitions. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_EXPLODE`, `Titanium.UI.Android.TRANSITION_FADE_IN`, `Titanium.UI.Android.TRANSITION_FADE_OUT`, `Titanium.UI.Android.TRANSITION_NONE`, `Titanium.UI.Android.TRANSITION_SLIDE_BOTTOM`, `Titanium.UI.Android.TRANSITION_SLIDE_LEFT`, `Titanium.UI.Android.TRANSITION_SLIDE_RIGHT`, `Titanium.UI.Android.TRANSITION_SLIDE_TOP` ### activitySharedElementEnterTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `Defaults to android platform's [move](https://github.com/android/platform_frameworks_base/blob/lollipop-release/core/res/res/transition/move.xml) transition. ` The type of enter transition used when animating shared elements between two activities. Activity B's shared element enter transition determines how shared elements animate from A to B. Applicable for Android 5.0 and above. This value will be ignored if `animated` is set to false. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_CHANGE_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_CLIP_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_IMAGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_CHANGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_NONE` ### activitySharedElementExitTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `Defaults to android platform's [move](https://github.com/android/platform_frameworks_base/blob/lollipop-release/core/res/res/transition/move.xml) transition. ` The type of exit transition used when animating shared elements between two activities. Activity A's shared element exit transition animates shared elements before they transition from A to B Applicable for Android 5.0 and above. This value will be ignored if `animated` is set to false. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_CHANGE_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_CLIP_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_IMAGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_CHANGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_NONE` ### activitySharedElementReenterTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `Defaults to android platform's [move](https://github.com/android/platform_frameworks_base/blob/lollipop-release/core/res/res/transition/move.xml) transition. ` The type of reenter transition used when animating shared elements between two activities. Activity A's shared element reenter transition animates shared elements after they have transitioned from B to A. Applicable for Android 5.0 and above. This value will be ignored if `animated` is set to false. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_CHANGE_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_CLIP_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_IMAGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_CHANGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_NONE` ### activitySharedElementReturnTransition - Type: Number - Platforms: Android - Since: Titanium SDK 5.2.0 - Requires: Android 5+ - Default: `Defaults to android platform's [move](https://github.com/android/platform_frameworks_base/blob/lollipop-release/core/res/res/transition/move.xml) transition. ` The type of return transition used when animating shared elements between two activities. Activity B's shared element return transition determines how shared elements animate from B to A. Applicable for Android 5.0 and above. This value will be ignored if `animated` is set to false. See "Material design activity transitions in Android" in the main description of Titanium.UI.Window for more information. Accepts: `Titanium.UI.Android.TRANSITION_CHANGE_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_CLIP_BOUNDS`, `Titanium.UI.Android.TRANSITION_CHANGE_IMAGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_CHANGE_TRANSFORM`, `Titanium.UI.Android.TRANSITION_NONE` ### autoAdjustScrollViewInsets - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 3.1.3, iPad 3.1.3, macOS 9.2.0 Specifies whether or not the view controller should automatically adjust its scroll view insets. When the value is true, it allows the view controller to adjust its scroll view insets in response to the screen areas consumed by the status bar, navigation bar, toolbar and tab bar. The default behavior assumes that this is false. Must be specified before **opening** the window. ### backButtonTitle - Type: String - Platforms: iPhone, iPad, macOS Title for the back button. This is only valid when the window is a child of a tab. ### backButtonTitleImage - Type: String | Titanium.Blob - Platforms: iPhone, iPad, macOS The image to show as the back button. This is only valid when the window is a child of a tab. ### backgroundColor - Type: String | Titanium.UI.Color - Platforms: Android, iPhone, iPad, macOS - Default: `Transparent` Background color of the window, as a color name or hex triplet. On Android, to specify a semi-transparent background, set the alpha value using the [opacity](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#opacity) property before opening the window. For information about color values, see the "Colors" section of [Titanium.UI](https://titaniumsdk.com/docs/sdk/Titanium.UI.md). ### barColor - Type: String | Titanium.UI.Color - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK Android 8.0.1, iPhone 0.9, iPad 0.9 Background color for the nav bar, as a color name or hex triplet. For information about color values, see the "Colors" section of [Titanium.UI](https://titaniumsdk.com/docs/sdk/Titanium.UI.md). ### barImage - Type: String - Platforms: iPhone, iPad, macOS Background image for the nav bar, specified as a URL to a local image. The behavior of this API on iOS has changed from version 3.2.0. Previous versions of the SDK created a custom image view and inserted it as a child of the navigation bar. The titanium sdk now uses the native call to set the background image of the navigation bar. You can set it to a 1px transparent png to use a combination of `barColor` and `hideShadow:true`. ### bottom - Type: Number | String - Platforms: Android, iPhone, iPad, macOS - Default: `0` Window's bottom position, in platform-specific units. On Android, this property has no effect. ### closed - Type: Boolean - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK 9.1.0 - Permission: read-only - Default: `true` Determines whether this Window is closed. ### exitOnClose - Type: Boolean - Platforms: Android - Default: `true if this is the first window launched else false; prior to Release 3.3.0, the default was always false. ` Boolean value indicating if the application should exit when the Android Back button is pressed while the window is being shown or when the window is closed programmatically. Starting in 3.4.2 you can set this property at any time. In earlier releases you can only set this as a createWindow({...}) option. ### extendEdges - Type: Array - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 3.1.3, iPad 3.1.3, macOS 9.2.0 An array of supported values specified using the EXTEND_EDGE constants in [Titanium.UI](https://titaniumsdk.com/docs/sdk/Titanium.UI.md). This is only valid for windows hosted by navigation controllers or tab bar controllers. This property is used to determine the layout of the window within its parent view controller. For example if the window is specified to extend its top edge and it is hosted in a navigation controller, then the top edge of the window is extended underneath the navigation bar so that part of the window is obscured. If the navigation bar is opaque (translucent property on window is false), then the top edge of the window will only extend if [Titanium.UI.Window.includeOpaqueBars](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#includeOpaqueBars) is set to true. The default behavior is to assume that no edges are to be extended. Must be specified before **opening** the window. Accepts: `Titanium.UI.EXTEND_EDGE_ALL`, `Titanium.UI.EXTEND_EDGE_BOTTOM`, `Titanium.UI.EXTEND_EDGE_LEFT`, `Titanium.UI.EXTEND_EDGE_NONE`, `Titanium.UI.EXTEND_EDGE_RIGHT`, `Titanium.UI.EXTEND_EDGE_TOP` ### extendSafeArea - Type: Boolean - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK Android 7.5.0, iPhone 6.3.0, iPad 6.3.0, macOS 9.2.0 - Default: ``false` on Android, `true` on iOS.` Specifies whether the screen insets/notches are allowed to overlap the window's content or not. If set `true`, then the contents of the window will be extended to fill the whole screen and allow the system's UI elements (such as a translucent status-bar) and physical obstructions (such as the iPhone X rounded corners and top sensor housing) to overlap the window's content. In this case, it is the app developer's responsibility to position views so that they're unobstructed. On Android, you can use the [Window.safeAreaPadding](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#safeAreaPadding) property after the window has been opened to layout your content within the insets. If set `false`, then the window's content will be laid out within the safe-area and its child views will be unobstructed. For example, you will not need to position a view below the top status-bar. Read more about the safe-area layout-guide in the [Human Interface Guidelines](https://developer.apple.com/ios/human-interface-guidelines/overview/iphone-x/). ### flagSecure - Type: Boolean - Platforms: Android - Since: Titanium SDK 3.3.0 - Default: `false` Treat the content of the window as secure, preventing it from appearing in screenshots or from being viewed on non-secure displays. When the value is true, preventing it from appearing in screenshots or from being viewed on non-secure displays. ### focused - Type: Boolean - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK 9.1.0 - Permission: read-only - Default: `false` Determines whether this TextArea has focus. ### fullscreen - Type: Boolean - Platforms: Android, iPhone, iPad, macOS - Default: `false` Boolean value indicating if the window is fullscreen. A fullscreen window occupies all of the screen space, hiding the status bar. Must be specified at creation time or in the `options` dictionary passed to the [Window.open](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#open) method. On iOS the behavior of this property has changed. Starting from 3.1.3, if this property is undefined then the property is set to the value for UIStatusBarHidden defined in tiapp.xml. If that is not defined it is treated as **explicit false**. On earlier versions, opening a window with this property undefined would not effect the status bar appearance. ### hidesBackButton - Type: Boolean - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK Android 8.0.0, iPhone 7.5.0, iPad 7.5.0, macOS 9.2.0 - Default: `false` Set this to true to hide the back button of navigation bar. When this property is set to `true`, the navigation window hides its back button. ### hidesBarsOnSwipe - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 6.0.0, iPad 6.0.0, macOS 9.2.0 - Default: `false` Set this to true to hide the navigation bar on swipe. When this property is set to true, an upward swipe hides the navigation bar and toolbar. A downward swipe shows both bars again. If the toolbar does not have any items, it remains visible even after a swipe. ### hidesBarsOnTap - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 6.0.0, iPad 6.0.0, macOS 9.2.0 - Default: `false` Set this to true to hide the navigation bar on tap. When the value of this property is true, the navigation controller toggles the hiding and showing of its navigation bar and toolbar in response to an otherwise unhandled tap in the content area. ### hidesBarsWhenKeyboardAppears - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 6.0.0, iPad 6.0.0, macOS 9.2.0 - Default: `false` Set this to true to hide the navigation bar when the keyboard appears. When this property is set to true, the appearance of the keyboard causes the navigation controller to hide its navigation bar and toolbar. ### hideShadow - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 3.2.0, iPad 3.2.0, macOS 9.2.0 - Default: `false` Set this to true to hide the shadow image of the navigation bar. This property is only honored if a valid value is specified for the [barImage](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#barImage) property. ### hidesSearchBarWhenScrolling - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 8.1.0, iPad 8.1.0, macOS 9.2.0 - Default: `true` A Boolean value indicating whether the integrated search bar is hidden when scrolling any underlying content. When the value of this property is true, the search bar is visible only when the scroll position equals the top of your content view. When the user scrolls down, the search bar collapses into the navigation bar. Scrolling back to the top reveals the search bar again. When the value of this property is false, the search bar remains regardless of the current scroll position. You must set [Titanium.UI.ListView.showSearchBarInNavBar](https://titaniumsdk.com/docs/sdk/Titanium.UI.ListView.md#showSearchBarInNavBar) or [Titanium.UI.TableView.showSearchBarInNavBar](https://titaniumsdk.com/docs/sdk/Titanium.UI.TableView.md#showSearchBarInNavBar) property for this property to have any effect. ### homeIndicatorAutoHidden - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 7.3.0, iPad 7.3.0, macOS 9.2.0 - Default: `false` Boolean value indicating whether the system is allowed to hide the visual indicator for returning to the Home screen. Set this value true, if you want the system to determine when to hide the indicator. Set this value false, if you want the indicator shown at all times. The system takes your preference into account, but setting true is no guarantee that the indicator will be hidden. ### includeOpaqueBars - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 3.1.3, iPad 3.1.3, macOS 9.2.0 Specifies if the edges should extend beyond opaque bars (navigation bar, tab bar, toolbar). By default edges are only extended to include translucent bars. However if this is set to true, then edges are extended beyond opaque bars as well. The default behavior assumes that this is false. Must be specified before **opening** the window. ### largeTitleDisplayMode - Type: Number - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 6.3.0, iPad 6.3.0, macOS 9.2.0 - Default: `Titanium.UI.iOS.LARGE_TITLE_DISPLAY_MODE_AUTOMATIC` The mode to use when displaying the title of the navigation bar. Automatically use the large out-of-line title based on the state of the previous item in the navigation bar. An item with `largeTitleDisplayMode = Ti.UI.iOS.LARGE_TITLE_DISPLAY_MODE_AUTOMATIC` will show or hide the large title based on the request of the previous navigation item. If the first item pushed is set to Automatic, then it will show the large title if the navigation bar has `largeTitleEnabled = true`. Accepts: `Titanium.UI.iOS.LARGE_TITLE_DISPLAY_MODE_ALWAYS`, `Titanium.UI.iOS.LARGE_TITLE_DISPLAY_MODE_AUTOMATIC`, `Titanium.UI.iOS.LARGE_TITLE_DISPLAY_MODE_NEVER` ### largeTitleEnabled - Type: Boolean - Platforms: iPhone, iPad, macOS - Since: Titanium SDK iPhone 6.3.0, iPad 6.3.0, macOS 9.2.0 - Default: `false` A Boolean value indicating whether the title should be displayed in a large format. When set to `true`, the navigation bar will use a larger out-of-line title view when requested by the current navigation item. To specify when the large out-of-line title view appears, see [Titanium.UI.Window.largeTitleDisplayMode](https://titaniumsdk.com/docs/sdk/Titanium.UI.Window.md#largeTitleDisplayMode). ### left - Type: Number | String - Platforms: Android, iPhone, iPad, macOS - Default: `0` Window's left position, in platform-specific units. On Android, this property has no effect. ### leftNavButton - Type: Titanium.UI.View - Platforms: iPhone, iPad, macOS View to show in the left nav bar area. In an Alloy application you can specify this property with a `` element inside the `` element, for example: ``` xml