I have a perspective screen with a dropdown menu with labels of components on an embedded screen and a value of the x,y position of the component within the co-ordinate embedded view. Since the Co-Ordinate screen is around 4000 x 2000 it always has scroll bars. Is it possible to have the embedded view centre the scroll bars on the object that is selected on the dropdown menu?
1 Like
Picture >> 1000 words. Add one into your post.
This is a example. The drop down menu works correctly with the embedded view components, the X,Y Co-ordinates are correct. The part that I can't figure out is if it is possible to move the component selected in the dropdown to center the screen to the item?
Sounds like you want the view to scroll automatically. At the moment I don't believe it is possible.
Here are some previous discussions:
There's a solution using the focus() method of components.
I just tried and it works pretty much as expected.
Here's how I set it up:
Put a message handler on each component that you want to be able to target.
In this handler, check for an id passed with the payload, compare it with an unique identifier that you give to your components, and if it matches, call self.focus()
On your dropdown, add a change script on the value property, and call system.perspective.sendMessage from there.
Note that the doc says
Due to the nature of focus, calling the focus method is only effective on components that can have focus. Input components such as the Text Field and Numeric Entry Field components can gain focus, but Display components like Labels and Images can not gain focus.
But it actually works with labels, which is what I used to test the method.
There might be components for which this won't work, though.
Also, it doesn't really put the component in the center... but it does put it into view, which is better than nothing I guess ?
3 Likes
Actually, if you supply domId attributes to each of the components which could be "scrolled" to, you could perform a navigation call on value change of the Dropdown.
Suppose you had a Table and you set Table.meta.domId to a value of "MyCoolTable". you could invoke the following code as part of the change script of Dropdown.props.value to force the page to scroll to that Table:
system.perspective.navigate(page="/path/to/page#MyCoolTable") # should work
system.perspective.navigate(url="http://gateway_ip:port/data/perspective/client/ProjectName/path/to/page#MyCoolTable") # definitely works
This won't "center" the component, but it will scroll it into view.
6 Likes
I just tried this and it worked exactly how I wanted, thankyou so much.
I'm going to give this method a go, thank you for the reply.