PortalIcon

Description

The PortalIcon component represents a portal icon for use in the on-device app Launcher.

Example

import React from "react";
import { View, PortalIcon } from "magic-script-components";
export default class MyApp extends React.Component {
render() {
return (
<View name="main-view">
<PortalIcon text="Portal Icon" iconSize="extra-large" />
</View>
);
}
}

Common Events

Common Properties

Create Properties

NameTypeDefault ValueDescription
textstringn/aThe default, UTF-8 encoded portal icon label text.
iconSizestringsmallOne of the built-in sizes for the portal icon.

Element Properties

NameTypeDescription
hoverScalenumberSets the overall hover scale of the portal icon component. This value is provided as a multiplier, with 1 being normal scale, 2 being scaled two times normal, etc.
hoverZOffsetnumberSets the overall hover Z-offset of the portal icon component. This value is provided in local space to the portal icon component's +Z axis. Positive values move towards the camera.
iconActivateAnimationstringSets the icon activate animation name (optional). This is the animation played when the user opens the app.
iconContextMenuAnimationstringSets the icon context menu animation name (optional). This is the animation played when the user opens the app settings.
iconHoverAnimationstringSets the icon hover animation name (optional). This is the animation played when the user hovers on the icon, but no action is taken.
iconIdleAnimationstringSets the icon idle animation name (required). This is the default animation state when the user is not interacting with the icon.
iconHoverPositionvec3Sets the icon hover position relative to the portal sphere. This value is specified in local space to the portal component and is scaled with the rest of the portal elements during hover scale animation.
labelDisplayModestringSets the display mode for the portal icon label. The default value is kAlways, to always show the label.

iconSize options: PortalIconSize

labelDisplayMode options: LabelDisplayMode