# 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: In iOS 26, Apple introduced the `UIGlassEffectView`, an alternative to classic blur views. See the [Titanium.UI.iOS.BlurView.glassEffect](https://titaniumsdk.com/docs/sdk/Titanium.UI.iOS.BlurView.md#glassEffect) property for more details.

- Source: https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.UI.iOS.BlurView
- Titanium SDK version: 13.4.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
const win = Ti.UI.createWindow({
    backgroundColor: "#fff"
});

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

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

img.add(blur);

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

// Available blur effects
const 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();
```

## Example: Glass Effect View (iOS 26+)

The following example shows how to create a blur view with the new glass effect:

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

const backgroundView = Ti.UI.createImageView({
    image: 'https://s1.directupload.eu/images/250817/ufgix5hy.jpg',
    width: Ti.UI.FILL,
    height: Ti.UI.FILL,
    scalingMode: Ti.Media.IMAGE_SCALING_ASPECT_FILL
});

const effectView = Ti.UI.iOS.createBlurView({
    width: 250,
    height: 250,
    glassEffect: {
        style: Ti.UI.iOS.GLASS_EFFECT_STYLE_CLEAR,
        interactive: true
    }
});

backgroundView.add(effectView);

const toggleButton = Ti.UI.createButton({
    title: "Toggle Glass Effect",
    bottom: 50
});

let isEnabled = true;
toggleButton.addEventListener("click", () => {
    isEnabled = !isEnabled;
    if (isEnabled) {
        backgroundView.add(effectView)
    } else {
        backgroundView.remove(effectView)
    }
});

win.add(backgroundView);
win.add(toggleButton);
win.open();
```

## Properties

### effect

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

The blur effect to apply to the effect 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`

### glassEffect

- Type: GlassEffectConfiguration
- Platforms: iPhone, iPad
- Since: Titanium SDK 13.0.0
- Requires: iOS 26.0+

The glass effect configuration to apply to the effect view.

Glass effects are an alternative to classic blur views introduced in iOS 26, providing
a more modern and visually appealing blur effect with additional customization options.

When the glass effect is enabled, it will override any value set to the `effect` property.
See [GlassEffectConfiguration](https://titaniumsdk.com/docs/sdk/GlassEffectConfiguration.md) for the available configuration options.

## Inherited members

78 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`, `removeEventListener`
- [Titanium.UI.View](https://titaniumsdk.com/docs/sdk/13.4.0/Titanium.UI.View.md): `accessibilityHidden`, `accessibilityHint`, `accessibilityLabel`, `accessibilityValue`, `add`, `anchorPoint`, `animate`, `animatedCenter`, `backgroundColor`, `backgroundGradient`, `backgroundImage`, `backgroundLeftCap`, `backgroundRepeat`, `backgroundSelectedColor`, `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`.