Content

GlassView

Liquid Glass around any React Native content.

iOSUIGlassEffectAndroidA translucent capsuleReact Native tier — renders anywhere

GlassView on Android — AndroidA translucent capsule

Import

import {GlassView} from '@hzblj/kara-ui'

Props

iOS 26 Liquid Glass around a React Native subtree, shaped as a capsule — the React Native tier, so it needs no host and costs next to nothing in a list cell. Where there is no Liquid Glass (Android, and iOS before 26) it draws a capsule of tint instead, or of the glass buttons' translucent fill (btn.bg.glass.base) when there is none.

Also takes the React Native `sx` props.

Prop	Type	Default	Description
children	ReactNode	—	React Native views. Give them `pointerEvents="none"` when `interactive`, so the press reaches the `Pressable`.
interactive	boolean	iOS false	Swells toward the finger on touch, carrying the children with it. Wrap the view in a `Pressable` for the press.
testID	string	—	Test identifier, forwarded to the view.
tint	ColorToken	—	Tints the material. Unset leaves it clear.

children

ReactNode

React Native views. Give them pointerEvents="none" when interactive, so the press reaches the Pressable.

interactiveiOS false

boolean

Swells toward the finger on touch, carrying the children with it. Wrap the view in a Pressable for the press.

testID

string

Test identifier, forwarded to the view.

tint

ColorToken

Tints the material. Unset leaves it clear.

Platform notes

Liquid Glass on iOS 26, as a UIKit view — no host, so it is cheap enough for every cell of a list.
Below iOS 26 and on Android it is a capsule of tint, or of the translucent glass fill.
Interactive glass swells toward the finger and carries its children; the press itself belongs to a Pressable around it.