Skip to content

Latest commit

 

History

History
80 lines (63 loc) · 6.87 KB

File metadata and controls

80 lines (63 loc) · 6.87 KB
id title
text
Text

import PlatformTabs from '@theme/PlatformTabs';

Description

This is the base component of any static text element placed in your prism. These are single or multi-line text areas of UTF-8 encoded 2D text. Use them inside your prism as is, or call them from other components. Text cannot be modified by a user, but can be copied with the cursor.

Example

import React from 'react';
import { Text, View, Image, Prism, Scene } from 'magic-script-components';

export default class MyApp extends React.Component {
  render() {
    return (
      <Scene>
        <Prism size={[1, 1, 0.2]} >
          <View name="main-view" anchorPoint={'center-center'} position={[-0.31, 0, 0]}>
            <Text alignment={'center-left'} fontSize={0.1} weight={"bold"} textColor={"#85D834"} position={[0, 0.12, 0]}>
              Lorem Ipsum
            </Text>
            <Image alignment={'center-left'} height={0.07} width={0.07} icon={"phone"} />
            <Text alignment={'center-left'} fontSize={0.05} textColor={"#B5B5B5"} position={[0.1, 0, 0]}>
              (555)-123-1234
            </Text>
            <Image alignment={'center-left'} height={0.07} width={0.07} icon={"send"} position={[0, -0.1, 0]} />
            <Text alignment={'center-left'} fontSize={0.05} textColor={"#e0e0e0"} position={[0.1, -0.1, 0]}>
              [email protected]
            </Text>
          </View>
        </Prism>
      </Scene>
    );
  }
}

Create Properties

Name Type Default Value Required Description
text string n/a N The UTF-8 encoded text to initially set the text to.
style string normal N The style of the Magic Leap font.
weight string regular N The weight (i.e., thickness) of the Magic Leap font.

If text is empty, the content of the <text> tag will be used as text.

style options: FontStyle

weight options: FontWeight

Element Properties

Name Type Default Value Description
allCaps boolean n/a Displays the text in all caps if true.
letterSpacing number 0 Sets the additional character spacing that is applied between characters.
lineSpacing number 1.0 Sets the line spacing to adjust the distance between lines of text; e.g., use 1 for single-spaced text, 2 for double-spaced text.
style string normal Sets the style of the Magic Leap font.
weight string regular Sets the weight (i.e., thickness) of the Magic Leap font.
text string n/a Sets the UTF-8 encoded text. This call is ignored if there is a current localization key set. Set the localization key to an empty string, "", to unset it.
textAlign string left Aligns the text to the left, center, or right or justifies it.
textColor verc4 white Sets the RGBA color of the rendered text.
fontSize number 0.08 Sets the text render size height in scene units.
width number 0 Sets the text width in scene units. The default value of 0 indicates there is no bounds and the text can grow and does not wrap or truncate. Setting the bounds greater than 0 in both width and height will set the text bounds and cause the text to wrap or truncate within.
height number 0 Sets the text height in scene units. The default value of 0 indicates there is no bounds and the text can grow and does not wrap or truncate. Setting the bounds greater than 0 in both width and height will set the text bounds and cause the text to wrap or truncate within.
multiline boolean false Determined if the text can be shown in multiple lines

textAlignment options: HorizontalTextAlignment