Remote UI components

Use Remote UI components when a standard Remote UI configuration does not provide the behavior you need. Add a component with "type": "custom" and its custom_type value. This page lists every PNLight component that you can add to a Remote UI configuration.

Circular loader

pnlight.circular_loader displays a circular loading indicator in your Remote UI screen. Use it while your app or the screen loads content.

{
  "type": "custom",
  "custom_type": "pnlight.circular_loader",
  "width": { "type": "fixed", "value": 48 },
  "height": { "type": "fixed", "value": 48 },
  "custom_props": {
    "style": "large",
    "color": "#FF007AFF",
    "accessibility_label": "Loading"
  }
}

Property	Use
`style`	Set `medium` or `large`. The default is `medium`.
`color`	Set a `#RRGGBB` or `#AARRGGBB` color. The default follows the system label color.
`accessibility_label`	Set the label announced by assistive technology. The default is `Loading`.

Set the component size with its width and height fields. Use { "type": "wrap_content" } for either dimension when you want the loader to use its intrinsic size.

Preview the configuration in Remote UI, then test the placement in your app before you enable it for users.

Start here

SDK integration

Dashboard

Troubleshooting

Changelog

Circular loader

​Circular loader

Circular loader