Skip to content
anidivr edited this page Jan 10, 2023 · 4 revisions

Basic clickable button with optional text

image

Code

Inputs

Name Type Default Description
text string blank Optional text to show in button
textjustify number, left, center, right center Text justification relative to center of button
fontsize number 0.07 Size of text within button
width number 0.5 Width of button in meters
height number 0.1 Height of button in meters
enabled boolean true When true, button can be pressed. When false, press and hover are disabled
buttonmaterial Material Theme button material (color #505050) Button color. Set to override with custom material
disabledmaterial Material Theme disabled material (color #666666) Disabled color. Set to override with custom material
labelmaterial Material Theme label material (color white) Material used for button text. Set to override with custom material
outlinematerial LineBasicMaterial Theme outline material (color white) Material used for button outline. Set to override with custom material
selectable InteractiveObjects undefined Add to list of objects ray caster can test for overlap
geometry BufferGeoemtry Rounded rectangle shape Override to provide your own button geometry

Outputs

Name Type Description
hover boolean Triggered when pointer over button. True when over, false when not
pressed boolean Triggered when button clicked

Examples

<flat-ui-button [text]="item.title" [width]="width-0.04" [selectable]="selectable" [enabled]="item.enabled"
                (pressed)="execute()">
</flat-ui-button>

<flat-ui-button [text]="'SIGN UP'" [labelmaterial]="labelmaterial" [selectable]="selectable"
                [geometry]="buttongeometry" [buttonmaterial]="signupmaterial" [enabled]="isinputvalid"
                [fontsize]="0.1" (pressed)="signupPressed()">
</flat-ui-button>
Clone this wiki locally