I have an extjs panel. This panel has dynamic contents added into it every time I press a button. This dynamic content gets added to the end of the panel, which is not visible until I do a manual horizontal scroll.
I want to scroll to the right most side everytime a new content is added and user see that content immediately (without manually having to scroll right)
Is there any way, I can automatically horizontally scroll the panel towards the end of the panel in the right
Thx
Related
I am facing an issue where the tabs don't fit the entire width of the panel, and the user has to scroll to the right to view the rightmost tabs.
To see what I mean, please can go to this Sencha example, add enough tabs to enable the scrolling in the tab header.
My questions:
Is there a way to make the tabs wrap rather than having the scrolling effect?
Is there a plugin that can be used to create a dropdown menu/list with all the tabs or perhaps with the tabs that are not visible on the top right corner?
Is there a way to configure the table panel such that when I click on the > button on the right side to scroll the tab items, they scroll enough to make the next item visible instead of scrolling in small increments?
Ultimately, I could simulate the tab panel by adding a toolbar and buttons, and using the cardlayout. That would be my plan B.
Thank you
Update: I can set the flex: 1 property for each tab (inside tabConfig). I still have to figure out tooltips and enable the elipsis on the longer tabs that get chopped off.
There is a tabBar config for tabpanels, see here. Within this you can set layout properties, including overflowHandler, and one possible value is menu. This will do what you asked for in question 2. Add this config to tabpanel definition:
tabBar: {
layout: {
overflowHandler: 'menu'
}
}
Referring to this question and answer by Shai Almog:
Rebuild list of containers without scrolling the list
I have a form with one container (TableLayout), which contains several rows with labels and buttons. Clicking a button changes the order of the rows and rebuilds the whole form (after myForm.removeAll() ). After myForm.revalidate() the form jumps to the top.
I am trying to implement this exact behaviour, to return to the same point (scroll position Y) after revalidating/changing the container contents.
I subclassed the Container-class to make setScrollY(int) visible. Using this with an arbitrary value does not scroll to the position, so it seems that the setScrollY method is not changing the scroll position of the content pane overall.
And myContainer.getScrollY() always returns "0". I only get the scroll position by calling getContentPane().getScrollY().
But it is obviously not possible to call the setScrollY()-method on the content pane - as it is not possible to subclass the content pane - to scroll back to the same position after revalidating the form.
Thanks for any advice!
Use border layout which disables the scrolling of the form/content pane.
Place your container (where you exposed setScroll) in the center and make sure to invoke setScrollableY(true) on that Container.
I am using TabPanel in my application. Now I have grids and tree panel on every tab.
So whenever I scroll grid or Tree Panel and shift to second tab and then return back to first Tab, Scroll goes to the Top. That's means it doesn't preserve its position.
Also this behavior is only on IE11. In case of Chrome, it works fine. What can be possibly wrong? Can anyone help?
I have this narrow panel which is basically a list of thumbnails, and i need to be able to scroll over them using buttons.
We have a panel (anchor layout), with containers in it, and each container contains the image.
there isn't space for a scrollbar, and anyway we don't want one.
I thought it would be as easy as in the listener for my button calling panel.getEL().scroll('b',20)
but this isn't working because the scrollHeight === ClientHeight so scroll does nothing.
Is there a technique I am missing or should this work?
So you're using a button to scroll through the images? What about having the button's listener remove/hide the containers/images at the front of the panel to allow the others to use the space?
I have a Silverlight application, containing a scrollviewer in a grid layout.
When I move the scroller down and close this grid with the close button, the scroller remains at the bottom whenever I reopen the grid.
Is there a way I can reset the scroller to the top position?
Hello supriya khamesra,
Please Try this.
Please Put your grid inside scroll viewer and then write your bellow code after grid selection change.
grdDetail.ScrollToVerticalOffset(0d);
OR
grdDetail.ScrollToTop();