# Titanium.UI.iOS.BlurView

> A [Titanium.UI.iOS.BlurView](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.BlurView.md) object gives you an easy way implement some complex visual effects. The blur effect is applied to every view the blur view is added to by default. You can also place the blur view above other views and all visible views layered under the blur view are blurred as well. For more information on BlurView, please refer to the official [Apple documentation](https://developer.apple.com/documentation/uikit/uivisualeffectview). Note: Apple introduced two new constants [Titanium.UI.iOS.BLUR_EFFECT_STYLE_REGULAR](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.md#BLUR_EFFECT_STYLE_REGULAR) and [Titanium.UI.iOS.BLUR_EFFECT_STYLE_PROMINENT](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.md#BLUR_EFFECT_STYLE_PROMINENT) in iOS 10. These are internally mapped to [Titanium.UI.iOS.BLUR_EFFECT_STYLE_LIGHT](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.md#BLUR_EFFECT_STYLE_LIGHT) and [Titanium.UI.iOS.BLUR_EFFECT_STYLE_EXTRA_LIGHT](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.md#BLUR_EFFECT_STYLE_EXTRA_LIGHT).

- Source: https://titaniumsdk.com/docs/sdk/12.8.0/Titanium.UI.iOS.BlurView
- Titanium SDK version: 12.8.0
- Kind: view
- Platforms: iPhone, iPad, macOS
- Since: Titanium SDK iPhone 5.4.0, iPad 5.4.0, macOS 9.2.0
- Extends: Titanium.UI.View
- Inheritance: Titanium.UI.View > Titanium.Proxy

## Example: Basic Blur View

The following example shows how to create a simple blur view:

``` js
var win = Ti.UI.createWindow({
    backgroundColor: "#fff"
});

// Reference image (or view)
var img = Ti.UI.createImageView({
    image: "/default_app_logo.png",
    top: 100,
    width: 300,
    height: 300
});

// Blur view
var blur = Ti.UI.iOS.createBlurView({
    width: Ti.UI.FILL,
    height: Ti.UI.FILL
});

img.add(blur);

// Effect controls
var tabs = Ti.UI.iOS.createTabbedBar({
    labels: ["Extra light", "Light", "Dark"],
    bottom: 100
});

// Available blur effects
var effects = [
    Ti.UI.iOS.BLUR_EFFECT_STYLE_EXTRA_LIGHT,
    Ti.UI.iOS.BLUR_EFFECT_STYLE_LIGHT,
    Ti.UI.iOS.BLUR_EFFECT_STYLE_DARK,
];

tabs.addEventListener("click", function(e) {
    blur.effect = effects[e.index];
});

win.add(tabs);
win.add(img);
win.open();
```

## Properties

### effect

- Type: Number
- Platforms: iPhone, iPad, macOS
- Default: `undefined (no effect is applied)`

The effect you provide for the view.

Accepts: `Titanium.UI.iOS.BLUR_EFFECT_STYLE_DARK`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_EXTRA_LIGHT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_LIGHT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_PROMINENT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_REGULAR`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_CHROME_MATERIAL`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_CHROME_MATERIAL_DARK`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_CHROME_MATERIAL_LIGHT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_MATERIAL`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_MATERIAL_DARK`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_MATERIAL_LIGHT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_THICK_MATERIAL`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_THICK_MATERIAL_DARK`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_THICK_MATERIAL_LIGHT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_THIN_MATERIAL`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_THIN_MATERIAL_DARK`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_THIN_MATERIAL_LIGHT`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_ULTRA_THIN_MATERIAL`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_ULTRA_THIN_MATERIAL_DARK`, `Titanium.UI.iOS.BLUR_EFFECT_STYLE_SYSTEM_ULTRA_THIN_MATERIAL_LIGHT`

## Inherited members

77 members are inherited. Each is documented on the type that declares it.

- [Titanium.Proxy](https://titaniumsdk.com/docs/sdk/12.8.0/Titanium.Proxy.md): `addEventListener`, `apiName`, `applyProperties`, `bubbleParent`, `fireEvent`, `removeEventListener`
- [Titanium.UI.View](https://titaniumsdk.com/docs/sdk/12.8.0/Titanium.UI.View.md): `accessibilityHidden`, `accessibilityHint`, `accessibilityLabel`, `accessibilityValue`, `add`, `anchorPoint`, `animate`, `animatedCenter`, `backgroundColor`, `backgroundGradient`, `backgroundImage`, `backgroundLeftCap`, `backgroundRepeat`, `backgroundTopCap`, `borderColor`, `borderRadius`, `borderWidth`, `bottom`, `center`, `children`, `clearMotionEffects`, `click`, `clipMode`, `convertPointToView`, `dblclick`, `doubletap`, `getViewById`, `height`, `hide`, `horizontalMotionEffect`, `horizontalWrap`, `id`, `insertAt`, `keypressed`, `layout`, `left`, `longpress`, `opacity`, `pinch`, `postlayout`, `previewContext`, `pullBackgroundColor`, `rect`, `remove`, `removeAllChildren`, `replaceAt`, `right`, `rotate`, `rotation`, `show`, `singletap`, `size`, `swipe`, `tintColor`, `toImage`, `tooltip`, `top`, `touchEnabled`, `touchcancel`, `touchend`, `touchmove`, `touchstart`, `transform`, `twofingertap`, `verticalMotionEffect`, `viewShadowColor`, `viewShadowOffset`, `viewShadowRadius`, `visible`, `width`, `zIndex`

---

- 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`.