Not sure if I can formulate the question correctly but, here we go...
I recently downloaded a Perspective resource which seems to be a take on the Rockwell PlantPAx framework, see below:
The author of this resources uses the flex container enable property to simulate switching tabs (using the left pane buttons).
Question: is this the preferred way to accomplish what seems to be a task for the tab container?
I have a feeling that this was really the best way to do it since the left side contains two parts. The changing tab view and the static status view (the part with state and lock symbol). Just curious if anyone else has done it differently.
I haven't looked at that resource, but I get a sense of what they are doing. I didn't really like this approach since switching "tabs" would always intialize.
I started using the carousel component. You can set lazyLoad so the views only load when necessary, but once you load them they continue to update and switching "tabs" is snappier and any values will remain unchanged.
1 Like
In your example, is it possible to change carousel views using the side buttons?
Yes, you can script the buttons to change the "activePane" property of the carousel
3 Likes
I missed this, a flex container doesn't have an enable prop.
Misspoke, it's the display property.
Depending on the requirements I do this so I can have the items in each flex container already rendered since the tab container destroys the instance of the closed tabs. There may be a property in a newer version that avoids that though, but I would have to check to verify.
Edit: Yes this does exist so that problem doesn't really exist with v8.1.5+
2 Likes
Another possible reason to not use the tab strip component in earlier versions of 8.1 was that there was no way to hide tabs easily. In later versions a "disabled" prop was added for each tab which, somewhat confusingly, hides the tab.
Edit: Actually, perhaps this was always there... Just requires CSS knowledge to know how to actually hide the tabs! (I found this in a colleague's project)
5 Likes
