UI Components
Placeholder
Helper UI component for rendering native views.
<Placeholder>
allows adding native views directly in your markup without creating a full View wrapper for it. When NativeScript is constructing the UI and encounters a Placeholder element, it emits a creatingView
event, allowing you to pass in any native view to be rendered by assigning it to the args.view
parameter.
xml
<Placeholder creatingView="creatingView" />
ts
import { Utils } from '@nativescript/core'
export function creatingView(args) {
let nativeView
if (global.isIOS) {
// Example with UITextView on iOS
nativeView = UITextView.new()
nativeView.text = 'Native View (iOS)'
} else if (global.isAndroid) {
// Example with TextView on Android
nativeView = new android.widget.TextView(
Utils.android.getApplicationContext()
)
nativeView.setText('Native View (Android)')
}
// assign it to args.view so NativeScript can place it into the UI
args.view = nativeView
}
Props
...Inherited
For additional inherited properties, refer to the API Reference.
Events
creatingView
ts
on('creatingView', (args: CreateViewEventData) => {
const placeholder = args.object as Placeholder
args.view = someNativeView
})
Emitted when building the UI, the event args allow passing a native view instance back via args.view
.