topic Controlling model item opacity using Select option in Vuforia Studio

Controlling model item opacity using Select option

TM_9260611 — Tue, 24 Nov 2020 17:49:26 GMT

If I select modelitem-1 , it shows only that model item alone. But I want to show rest of the model items opacity in 0.5.

Example: If I Select Modelitem-1 , It should show Modelitem-1 in Opacity 1 and Modelitem-2, Modelitem-3 Opacity as 0.5.

If I select Modelitem-2 , It should show the Modelitem-2 in Opacity 1 and ModelItem-1 and Modelitem-3 opacity as 0.5.

@sdidier @Priya

How can I do that?. Any suggestion.

Re: Controlling model item opacity using Select option

sdidier — Wed, 25 Nov 2020 10:33:35 GMT

Hello,

To achieve this, I have used these threads in PTC Community about Select Widget:

https://community.ptc.com/t5/Vuforia-Studio/How-to-use-List-in-ThingWorx-Studio/td-p/522911

https://community.ptc.com/t5/Vuforia-Studio/What-is-the-format-for-quot-List-quot-in-the-Select-widget/m-p/550949

To populate the Select Widget, I have used the technics as explained in previous threads.

Nothing to add.

In Home.js node, I have created this Javascript function :

$scope.changeOpacity = function () { //console.warn($scope.app.view['Home'].wdg['select-1']); //console.log($scope.getWidgetProp('select-1', 'value')); switch ($scope.getWidgetProp('select-1', 'value')) { case '1': $scope.setWidgetProp('modelItem-1', 'opacity', 1); $scope.setWidgetProp('modelItem-2', 'opacity', 0.5); break; case '2': $scope.setWidgetProp('modelItem-1', 'opacity', 0.5); $scope.setWidgetProp('modelItem-2', 'opacity', 1); break; default: console.log(`Sorry, we are out of ${item}.`); } }

In Select Widget node, in SELECT-DETAILS panel, in EVENTS section, in Value Changed event, JS button, call to this function is done : changeOpacity();

How is it working ?

Opacity Properties of Model Item 1 and 2 is set to values expected when Item 1 is selected
In Select Widget, Item 1 and Item 2 are displayed and returns values 1 and 2
Select Widget is setup also to have Item 1 select by default when running Experience
When changing Item in Select Widget, Javascript function is ran and Model Items Opacities are modified as expected.

Please find attached an example Project.

Best regards,

Samuel

Re: Controlling model item opacity using Select option

TM_9260611 — Fri, 27 Nov 2020 09:56:00 GMT

Thanks @sdidier

Its works fine. If i want to add blinking for 3 seconds. how to do with this code?.

Re: Controlling model item opacity using Select option

sdidier — Fri, 27 Nov 2020 13:43:09 GMT

Hello,

I would recommend to have a look to this thread :

https://community.ptc.com/t5/Vuforia-Studio/blinking-of-a-3d-image/m-p/657207

W can find a snippet of a blinking behavior with a 3D Image.

A similar behavior can be done with Opacity of a Model Item.

Best regards,

Samuel