# Titanium.UI.ActivityIndicator > An activity indicator that lets the user know an action is taking place. - Source: https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.UI.ActivityIndicator - Titanium SDK version: 13.4.0 - Kind: view - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK 0.8 - Extends: Titanium.UI.View - Inheritance: Titanium.UI.View > Titanium.Proxy | Android | iOS | | ------- | --- | | ![Android](./activityindicator_android.png) | ![iOS](./activityindicator_ios.png) | An activity indicator can be used to show the progress of an operation in the UI to let the user know that some action is taking place. An activity indicator consists of a spinning animation and an optional text message, and is used to indicate an ongoing activity of indeterminate length. To show progress, use [Titanium.UI.ProgressBar](https://titaniumsdk.com/docs/sdk/Titanium.UI.ProgressBar.md) instead. Use the [Titanium.UI.createActivityIndicator](https://titaniumsdk.com/docs/sdk/Titanium.UI.md#createActivityIndicator) method or **``** Alloy element to create an `ActivityIndicator` object. `ActivityIndicator` is a view and, like any view, must be added to a window or other top-level view before it can be shown. Unlike most views, `ActivityIndicator` is hidden by default and must be shown explicitly by calling its [Titanium.UI.ActivityIndicator.show](https://titaniumsdk.com/docs/sdk/Titanium.UI.ActivityIndicator.md#show) method. ## Example: Simple Activity Indicator Open a yellow window immediately after a blue window. Show an activity indicator while some code executes and hide it on completion. Then close the yellow window. ``` js Ti.UI.backgroundColor = 'white'; var win1 = Ti.UI.createWindow({ backgroundColor: 'blue' }); var win2 = Ti.UI.createWindow({ backgroundColor: 'yellow' }); var activityIndicator = Ti.UI.createActivityIndicator({ color: 'green', message: 'Loading ...', style: Ti.UI.ActivityIndicatorStyle.DARK, top: 10, left: 10, height: Ti.UI.SIZE, width: Ti.UI.SIZE }); // The activity indicator must be added to a window or view for it to appear win2.add(activityIndicator); // eventListeners must always be loaded before the event is likely to fire // hence, the open() method must be positioned before the window is opened win2.addEventListener('open', function (e) { activityIndicator.show(); // do some work that takes 6 seconds // ie. replace the following setTimeout block with your code setTimeout(function() { e.source.close(); activityIndicator.hide(); }, 6000); }); win1.open(); win2.open(); ``` ## Example: Alloy XML Markup Previous example as two Alloy views. win1.xml: ``` xml ``` win1.js: ``` js function openWin2 () { var win2 = Alloy.createController('win2').getView(); win2.open(); } ``` win2.xml: ``` xml ``` win2.js: ``` js function showIndicator(e) { $.activityIndicator.show(); // do some work that takes 6 seconds // ie. replace the following setTimeout block with your code setTimeout(function() { e.source.close(); $.activityIndicator.hide(); }, 6000); } ``` ## Properties ### bottom - Type: Number | String - Platforms: Android, iPhone, iPad, macOS Bottom position of the view. Determines the absolute position of the view relative to its parent. Can be either a float value or a dimension string (for example `100` or `'50%'`.) ### color - Type: String | Titanium.UI.Color - Platforms: Android, iPhone, iPad, macOS Color of the message text, 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). ### font - Type: Font - Platforms: Android, iPhone, iPad, macOS Font used for the message text. ### height - Type: String - Platforms: Android, iPhone, iPad, macOS Width of the view. Only accepts value of [Titanium.UI.SIZE](https://titaniumsdk.com/docs/sdk/Titanium.UI.md#SIZE), which must be explicitly set in order to display the message and to position the view correctly. Accepts: `Titanium.UI.SIZE` ### indicatorColor - Type: String | Titanium.UI.Color - Platforms: Android, iPhone, iPad, macOS - Since: Titanium SDK 2.1.0 - Default: `white` Color of the animated indicator. For information about color values, see the "Colors" section of [Titanium.UI](https://titaniumsdk.com/docs/sdk/Titanium.UI.md). ### left - Type: Number | String - Platforms: Android, iPhone, iPad, macOS Left position of the view. Determines the absolute position of the view relative to its parent. Can be either a float value or a dimension string (for example `100` or `'50%'`.) ### message - Type: String - Platforms: Android, iPhone, iPad, macOS Message text. ### messageid - Type: String - Platforms: Android, iPhone, iPad, macOS Key identifying a string in the locale file to use for the message text. Only one of `message` or `messageid` should be specified. ### right - Type: Number | String - Platforms: Android, iPhone, iPad, macOS Right position of the view. Determines the absolute position of the view relative to its parent. Can be either a float value or a dimension string (for example `100` or `'50%'`.) ### style - Type: Number - Platforms: Android, iPhone, iPad, macOS - Default: `` The style for the activity indicator. One of the activity indicator style constants. See also: [indicatorColor](https://titaniumsdk.com/docs/sdk/Titanium.UI.ActivityIndicator.md#indicatorColor) Accepts: `Titanium.UI.ActivityIndicatorStyle.BIG`, `Titanium.UI.ActivityIndicatorStyle.BIG_DARK`, `Titanium.UI.ActivityIndicatorStyle.DARK`, `Titanium.UI.ActivityIndicatorStyle.PLAIN` ### top - Type: Number | String - Platforms: Android, iPhone, iPad, macOS Top position of the view. Determines the absolute position of the view relative to its parent. Can be either a float value or a dimension string (for example `100` or`'50%'`.) ### width - Type: String - Platforms: Android, iPhone, iPad, macOS Width of the view. Only accepts value of [Titanium.UI.SIZE](https://titaniumsdk.com/docs/sdk/Titanium.UI.md#SIZE), which must be explicitly set in order to display the message and to position the view correctly. Accepts: `Titanium.UI.SIZE` ## Methods ### hide - Platforms: Android, iPhone, iPad, macOS Hides the activity indicator and stops the animation. ### show - Platforms: Android, iPhone, iPad, macOS Shows the activity indicator and starts the animation. Remember to add the activity indicator to a parent view first, so it centers properly. This is optional for Android and required for iOS. ## Inherited members 33 members are inherited. Each is documented on the type that declares it. - [Titanium.Proxy](https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.Proxy.md): `addEventListener`, `apiName`, `applyProperties`, `bubbleParent`, `fireEvent`, `lifecycleContainer`, `removeEventListener` - [Titanium.UI.View](https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.UI.View.md): `accessibilityDisableLongPress`, `clearMotionEffects`, `elevation`, `filterTouchesWhenObscured`, `getViewById`, `hiddenBehavior`, `horizontalMotionEffect`, `id`, `insertAt`, `keepHardwareMode`, `previewContext`, `rotate`, `rotation`, `rotationX`, `rotationY`, `scaleX`, `scaleY`, `stopAnimation`, `tooltip`, `touchFeedback`, `touchFeedbackColor`, `transitionName`, `translationX`, `translationY`, `translationZ`, `verticalMotionEffect` --- - This corpus documents Titanium SDK 13.4.1. Anything here that does not name a version describes 13.4.1. - Titanium is maintained by TiDev. The Appcelerator toolchain is retired: there is no `appc` CLI, no Appcelerator Studio and no hosted build service. The supported CLI is `titanium` on npm, invoked as `ti`.