{"id":1184,"date":"2021-12-26T14:09:16","date_gmt":"2021-12-26T14:09:16","guid":{"rendered":"http:\/\/mobilearlab.bxmc.poly.edu\/?p=1184"},"modified":"2022-01-18T16:17:45","modified_gmt":"2022-01-18T16:17:45","slug":"behavior-scripts-lens-studio-tutorial-__mobile_ar_lab__nyu","status":"publish","type":"post","link":"https:\/\/mobilearlab.bxmc.poly.edu\/?p=1184","title":{"rendered":"Behavior Scripts Lens Studio Tutorial __Mobile_AR_Lab__NYU"},"content":{"rendered":"\n

Calculating Distance with Behavior Scripts in Lens Studio<\/strong><\/h1>\n\n\n\n
\"\"\/<\/figure>\n\n\n\n

Open a New Project in Lens Studio<\/strong><\/p>\n\n\n\n

We will be using this Lens to calculate the distance between the user and a 3D object placed in the world.  That distance can then be used to change the output of objects in your scene.<\/p>\n\n\n\n














Click the Project Info<\/strong> button at the top-left of the screen and Uncheck the Front Facing Camera<\/strong> option.  We will be using this Lens as a window into a 3D augmented world with our phones as the viewport.<\/p>\n\n\n\n

In the Objects<\/strong> panel, click the +<\/strong> create a new Text3D<\/em><\/strong> <\/em>component.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n



Click +<\/strong> in the Objects Panel and search for World Object Controller<\/em><\/strong> under<\/p>\n\n\n\n

Helper Scripts.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Click the disclosure button to the left of the newly created World Object Controller<\/em><\/strong> and delete the example FBX Object.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n



Replace the deleted resource with the 3D text component and drag it to the top of the World Object Controller\u2019s hierarchy.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n
























We are going to add a component that will allow device tracking.  Select the Camera <\/strong>in the Objects<\/strong> panel.  Look for the Inspector <\/strong>and click the +Add Component<\/strong> button to search and add Device Tracking<\/em><\/strong>.  It will now be added as a component of the Camera.<\/strong><\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n






Back in the Objects<\/strong> panel, click the +<\/strong> to search and add a Behavior Script.<\/em><\/strong>  It is located under Helper Scripts -> Behavior Script.  Drag the Behavior Script<\/em><\/strong> <\/strong>over the World Object Controller <\/em><\/strong>object to make it a child of the World Object Controller.<\/em><\/strong><\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n


















In the Scene<\/strong> panel, use \u201cW\u201d, \u201cE\u201d, and \u201cR\u201d to activate the transform gizmos.<\/p>\n\n\n\n

\u201cW\u201d – Position<\/p>\n\n\n\n

\u201cE\u201d – Rotation<\/p>\n\n\n\n

\u201cR\u201d – Scale.<\/p>\n\n\n\n

Then move and scale the Text3D<\/em><\/strong> so that it sits on top of the green Ground Grid<\/em><\/strong> in the scene.<\/p>\n\n\n\n

Be sure that your cursor is in the scene panel when you use these shortcuts to avoid renaming your Objects<\/strong>.  <\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n





Select the newly created Behavior<\/em><\/strong> script and in the Inspector, switch the trigger<\/strong> to Distance Check.<\/em><\/strong><\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Underneath Trigger<\/em><\/strong>, set <\/strong>Object A<\/em><\/strong> to the World Object Controller<\/em><\/strong>.  Next, set Object B<\/em><\/strong> to the main Camera <\/strong>object that has the Device Camera Tracker<\/em> component.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Set the Compare Type<\/em><\/strong> to Is Less Than<\/em><\/strong> and provide a unit of distance to compare.  This example uses 50.0.  You may have to play with these numbers depending on your space.<\/em><\/p>\n\n\n\n

Under the Response Type<\/em><\/strong> drop down box, select \u201cSend Custom Trigger\u201d<\/em><\/strong> and set the Trigger Name<\/em><\/strong> to \u201cclose<\/em>\u201d.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n







Then right click on the Behavior<\/em><\/strong> script<\/strong> component and duplicate it.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Paste the copied Behavior<\/em><\/strong> script below and set the Compare Type equal to <\/strong>Is Greater Than<\/em><\/strong> and rename the Trigger Name to \u201cfar\u201d<\/em>.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Now create a new Script<\/em><\/strong> in the Resources Panel and attach it to the Behavior Script <\/em><\/strong>object.  Drag it below where our two Distance Check Behavior Scripts<\/em><\/strong> are located.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Double click the newly created Script in the Resources<\/strong> window to open the Script Editor<\/strong>. Start by adding a new component input with the following code. This will allow you to drag in the 3D Text Scene Object to be changed within our script.<\/p>\n\n\n\n

\/\/—–JS CODE—–<\/p>\n\n\n\n

\/\/@input Component.text3D words<\/p>\n\n\n\n

The \/\/@input adds access to any type of Lens Studio component.  So to access a Text3D<\/em><\/strong> component, you would have to declare the type (Component.text3D) and then name the variable you\u2019ll be referring to in your project (words).  Save the script and there will be an input on your script.<\/p>\n\n\n\n

The Behavior Scripts<\/em><\/strong> that we are using to check distance have a method to receive the custom triggers<\/em><\/strong> they are outputting when the Distance Check conditions are met.  You can double click the Behavior Script<\/em><\/strong> in the Resources<\/strong> panel and parse through the various methods included in the Behavior Script<\/em><\/strong>  For our case, we are interested in addCustomTriggerResponse() method.<\/p>\n\n\n\n

Go to the Resources <\/strong>pane and open the Scripts Folder under the World Object Controller<\/strong> to double click and expose the code of the Behavior Script.<\/em><\/strong><\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Let\u2019s extract this line and copy it into the script with the 3D Text <\/em><\/strong>component so we can make changes when either of the distance check conditions are triggered.<\/p>\n\n\n\n

 This method looks for the custom trigger with the same name as the \u201ctriggerName\u201d and runs the function callback when that trigger is active. As you are bringing in the distance check behavior scripts, make sure to match the triggerName to the trigger name from the Behavior <\/em>scripts. This value is passed in as a \u201cstring\u201d.<\/p>\n\n\n\n

Then set up your callback functions in the same script. For simplicity, you can name your callback functions the same as your custom trigger names. Because we have the 3D Text component input, we can set the text for the 3D object with either of these functions that are called when the custom trigger is sent.<\/p>\n\n\n\n


<\/strong>
<\/strong>
<\/strong>
<\/strong>
<\/strong>Example Code:<\/strong><\/p>\n\n\n\n

\/\/@input Component.Text3D words<\/p>\n\n\n\n

global.behaviorSystem.addCustomTriggerResponse(“close”, close);<\/p>\n\n\n\n

global.behaviorSystem.addCustomTriggerResponse(“far”, far);<\/p>\n\n\n\n

function close() {<\/p>\n\n\n\n

   script.words.text = “close”;<\/p>\n\n\n\n

  }<\/p>\n\n\n\n

function far() {<\/p>\n\n\n\n

   script.words.text = “far”;<\/p>\n\n\n\n

  }<\/p>\n\n\n\n


















Finally, preview the effects in the Preview Pane<\/strong> by selecting the environment in the upper part of the window.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n









You can also pair your Snapchat account and send the Lens to your device.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

The Text3D<\/em><\/strong> <\/em>Component is just one of many possibilities able to be controlled with Behavior Scripts.  Look through all of the Triggers on the Behavior script to see what else you can control!<\/p>\n\n\n\n

Tags:<\/p>\n\n\n\n

snapchat, lensstudio, augmentedreality, ar, nyu, idm, integrateddesignandmedia, newyorkuniversity, nyuar, mobilearlab, tutorials, script, javascript, behavior, filters, arprojects, easyarprojects, easyar, augmented, 3d, condition, distancecheck, seestrawrun, christopherstrawley, augmentedrealitytutorials, mark skwarek<\/p>\n\n\n

Behavior Scripts Lens Studio__Mobile_AR_Lab__NYU<\/a><\/p>\n

by Christopher Strawley<\/p>","protected":false},"excerpt":{"rendered":"

Calculating Distance with Behavior Scripts in Lens Studio Open a New Project in Lens Studio We will be using this Lens to calculate the distance between the user and a 3D object placed in the world.  That distance can then be used to change the output of objects in your scene. Click the Project Info … <\/p>\n

Continue reading “Behavior Scripts Lens Studio Tutorial __Mobile_AR_Lab__NYU”<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[254,21,251,255,14,241,260,249,259,257,256,253,252,250,16,242,248,240,114,245,243,3,244,247,258,200,246],"class_list":["post-1184","post","type-post","status-publish","format-standard","hentry","category-uncategorized","tag-3d","tag-ar","tag-arprojects","tag-augmented","tag-augmented-reality","tag-augmentedreality-2","tag-augmentedrealitytutorials","tag-behavior","tag-christopherstrawley","tag-condition","tag-distancecheck","tag-easyar","tag-easyarprojects","tag-filters","tag-idm","tag-integrateddesignandmedia","tag-javascript","tag-lensstudio","tag-mark-skwarek","tag-mobilearlab","tag-newyorkuniversity","tag-nyu","tag-nyuar","tag-script","tag-seestrawrun","tag-snapchat","tag-tutorials"],"_links":{"self":[{"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=\/wp\/v2\/posts\/1184","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1184"}],"version-history":[{"count":5,"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=\/wp\/v2\/posts\/1184\/revisions"}],"predecessor-version":[{"id":1212,"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=\/wp\/v2\/posts\/1184\/revisions\/1212"}],"wp:attachment":[{"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1184"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1184"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mobilearlab.bxmc.poly.edu\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1184"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}