import { ContextManager, Event, HorizontalAlignment, Observable, VerticalAlignment } from '@zcomponent/core'; import * as Zappar from '@zappar/zappar'; import { WorldTrackerContext } from '../trackers/WorldTrackerContext'; import * as THREE from 'three'; import { StaticGroup } from '../StaticObject3D'; import { ARContext } from '../arcontext'; interface UserPlacementAnchorGroupConstructorProps { /** * If true, this component will be in a mode that allows the user to choose a placement location when the experience starts. * If false, the content will be placed at the center of the first detected plane after the experience starts. * @zui * @zdefault false */ startInPlacementMode: boolean; } /** * @zcomponent * @zicon location_on * @zgroup AR * @ztag three/Object3D/Group/Zappar/UserPlacementAnchorGroup * @zlabel three/Object3D/Group/Zappar/UserPlacementAnchorGroup * @zparents three/Zappar/WorldTracker */ export declare class UserPlacementAnchorGroup extends StaticGroup { constructorProps: UserPlacementAnchorGroupConstructorProps; private _placeUI; private _placeButton; private _placeButtonText; private _placeButtonIcon; private _restartPlacementUI; private _restartPlacementButton; private _restartPlacementButtonText; private _restartPlacementButtonIcon; private _updateUI; /** * If true, a button will be shown during placement mode for the user to confirm their chosen position. * * @zgroup Placement Button * @zgrouppriority 20 * @zui * @zdefault true */ showPlaceButton: Observable; /** * If true, a tick icon will be displayed in the place button. * * @zgroup Placement Button * @zgrouppriority 20 * @zui * @zdefault true */ showPlaceButtonIcon: Observable; /** * Set to a text string to display on the place button. * * @zui * @zgroup Placement Button * @zgrouppriority 20 * @zdefault "" */ placeButtonText: Observable; /** * The horiztonal alignment of the restart placement button * * @zui * @zgroup Placement Button * @zgrouppriority 20 * @zdefault "center" */ placeButtonHorizontalAlignment: Observable; /** * The vertical alignment of the restart placement button * * @zui * @zgroup Placement Button * @zgrouppriority 20 * @zdefault "bottom" */ placeButtonVerticalAlignment: Observable; /** * If true, a button will be shown to allow the user to return to placement mode. * * @zgroup Restart Placement Button * @zgrouppriority 20 * @zui * @zdefault true */ showRestartPlacementButton: Observable; /** * If true, an icon will be displayed in the restart placement button. * * @zgroup Restart Placement Button * @zgrouppriority 20 * @zui * @zdefault true */ showRestartPlacementButtonIcon: Observable; /** * Set to a text string to display on the restart placement button. * * @zui * @zgroup Restart Placement Button * @zgrouppriority 20 * @zdefault "" */ restartPlacementButtonText: Observable; /** * The horiztonal alignment of the restart placement button * * @zui * @zgroup Restart Placement Button * @zgrouppriority 20 * @zdefault "left" */ restartPlacementButtonHorizontalAlignment: Observable; /** * The vertical alignment of the restart placement button * * @zui * @zgroup Restart Placement Button * @zgrouppriority 20 * @zdefault "bottom" */ restartPlacementButtonVerticalAlignment: Observable; /** * @zui * @zgrouppriority 20 * @zgroup Placement UI * @zdefault ["zcomponent-zappar-three-place-ui"] */ placeUIClassList: Observable; /** * Determines if the user can long press on the screen to enter placement mode. There are two modes available: 'hold' allows the user * to move the anchor while the keep their finger held on the screen, while 'toggle' enters placement mode allowing the user to release their finger. * * @zgroup Long Press * @zgrouppriority 20 * @zui * @zdefault "none" */ longPressToMove: Observable; /** * If true, the long press instruction message will be shown when the user has * completed placement * * @zui * @zgroup Long Press * @zgrouppriority 20 * @zdefault false */ showLongPressInstructionOnPlace: Observable; /** * If true, the long press instruction message will be shown when the user has * completed placement * * @zui * @zgroup Long Press * @zgrouppriority 20 * @zdefault "Tap and hold to move" */ longPressInstruction: Observable; /** * Determines the mode of the placement button. * If set to 'reset', the button will trigger a full reset of the world tracker. * If set to 'place', the button will trigger a mode that allows the user to choose a placement location. * @zui * @zgroup Functionality * @zgrouppriority 40 * @zdefault "reset" */ restartPlacementMode: Observable<"reset" | "place", never>; /** * If true, placement will be possible on planes detected in the world around the user. * * @zui * @zgroup Functionality * @zgrouppriority 40 * @zdefault true */ placeOnPlanes: Observable; /** * If true, placement will be possible on a 'ground' plane detected in the world around the user. * * @zui * @zgroup Functionality * @zgrouppriority 40 * @zdefault false */ placeOnGround: Observable; /** * If true, a visual representation of any planes detected in the world around the user will be shown on-screen. * * @zui * @zgroup Functionality * @zgrouppriority 40 * @zdefault true */ visualizePlanesDuringPlacement: Observable; /** * If true, a the children of this component will be shown during placement mode. Otherwise it will be hidden. * * @zui * @zgroup Functionality * @zgrouppriority 40 * @zdefault true */ showContentDuringPlacement: Observable; /** * Use this property to preview the appearance of placement mode during design time. * * @zui * @zgroup Design Time * @zgrouppriority 50 * @zdefault false */ previewPlacement: Observable; /** * A layer clip that will be played when this component enters user placement mode. * * @zui * @zgroup Animation * @zgrouppriority 10 * @zdefault false * @zvalues layerclipids */ placingLayerClip: Observable; /** * A layer clip that will be played when this component leaves user placement mode. * * @zui * @zgroup Animation * @zgrouppriority 10 * @zdefault false * @zvalues layerclipids */ notPlacingLayerClip: Observable; /** * A layer clip that will be played when, during placement mode, the user is pointing at a valid location to place the content. * * @zui * @zgroup Animation * @zgrouppriority 10 * @zdefault false * @zvalues layerclipids */ placementValidLayerClip: Observable; /** * A layer clip that will be played when, during placement mode, the user is not pointing at a valid location to place the content. * * @zui * @zgroup Animation * @zgrouppriority 10 * @zdefault false * @zvalues layerclipids */ placementNotValidLayerClip: Observable; /** * A layer clip that will be played the first time the content has a placement in space. * * @zui * @zgroup Animation * @zgrouppriority 10 * @zdefault false * @zvalues layerclipids */ firstPlacedLayerClip: Observable; /** @zui */ onPlacing: Event<[]>; /** @zui */ onNotPlacing: Event<[]>; /** @zui */ onPlacementValid: Event<[]>; /** @zui */ onPlacementNotValid: Event<[]>; /** @zui */ onFirstPlaced: Event<[]>; placementMode: Observable; ready: Observable; placementValid: Observable; private _planes; anchor: Zappar.WorldAnchor; customAnchor?: Zappar.CustomAnchor; protected _context: ARContext; protected _worldTrackerContext: WorldTrackerContext; protected _innerGroup: THREE.Group; private _fingerHeld; private _hasFirstPlaced; constructor(ctx: ContextManager, constructorProps: UserPlacementAnchorGroupConstructorProps); private _setupTouchListeners; private _restartPlacement; private _update; private _handleFirstPlaced; private _isReady; private _updateReadyStatus; private _playLayerClip; dispose(): never; } export declare namespace UserPlacementAnchorGroup { enum LongPressMode { none = "none", toggle = "toggle", hold = "hold" } } export {};