I want my ext js panel to be resizable, i.e when I put my mouse over the panel it must show
me the resize controls. How do I do the same ?
Use Ext.Resizable. Check this link:
http://docs.sencha.com/ext-js/4-1/#!/example/resizer/basic.html
Edit: Link updated.
Typically you don't resize the panel component, you resize whatever it is contained within.
If you have the panel in a window object, you resize the window and the panel will resize with it automatically; unless you have specified height/width figures specifically which disables the layout manager from handling it.
resizable: true,
Panels accept a "resizable" attribute that will automatically display Ext.resizer.Resizer handles around the panel.
Related
The initial loadMask covers the grid but I am still able to scroll while it is loading and it doesn't cover below the initial screen. I am looking for a way to either disable scrolling while loading the store, extend the loadMask so that it covers the whole grid panel including the scrollable content or have the loadMask stay in place even if the grid scrolls. I am targeting the grid for loadMask (the default).
Scroll while loading
I have a button and I want it to be always at the same location on my form (top-left corner of visible part of the form).
Here is the example:
So when I scroll vertically or horizontally, the button should always be at the top-left corner and it should be visible.
What should I do to make it fixed?
I guess you are using Form's AutoScroll feature.
What about placing Panel with AutoScroll = true on the form and use its scrolling instead? Then you will be able to place a button on a form but over this scrollable panel. So, the scroll rulers will scroll the view panel contents, but the button will stay pinned to the form.
If you don't want to add another container component, then you can add a handler on Scroll event and adjust the button position in response to form scrolling. The ScrollEventArgs argument has ScrollOrientation, NewValue and OldValue to calculate new X/Y position of the control.
On the form, you place a Panel and set: its Dock property to Fill, and AutoScroll property to True.
You place all the other controls inside this panel, but not the button you want to keep visible.
Right-click on the panel->Send-to-Back.
The Panel will adjust the size to match the form; the scrolling will only happen in the panel, so the button will always stay visible(you can set Anchor:Left,Top on it)
In order to be able to scroll(with the mouse wheel), the focus must be on a control inside the scrollable area(inside the Panel), NOT on the button. To prevent the button from getting focus: set TabStop to false on it; also, when it is clicked, you must also set the focus on an other control, by calling:
this.SelectNextControl(the_button, true, true, true, true);
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?
In my application I am invoking a PopUp by
Popup pop = new Popup;
then i add this:: pop.child(page); where "page" is the instance of a XAML page which is of type ChildWindow.
Now when the popup shows up on my MainPage, it becomes Non-Modal just like I want it to be!!
But the problem is, the popup window is not draggable through out the Mainpage. I know that the popup appears within the Boundaries of a Silverlight control hosted in a browser. And It's not a true window. But still my popup is not draggable within its boundaries..
Am i missing some declarations which define the draggable region of a popup control OR is it the ChildWindow which needs to be configured ??
In order to solve the issue I had to remove the fixed Height and Width attributes of the ChildWindow and used MaxHeight and MaxWidth values and set their values to 4000. Now my ChildWindow inside the popup is perfectly draggable throughout the silverlight application.
I have a viewport with a tab panel in it. I'm trying to create a standard panel dynamically and make it visible. I'm able to create the panel and isVisible() returns true after calling doLayout on the viewport but the panel is not visible on the screen. Is there any way to make it visible (i.e., to hover above the tab panel)?
If you create the panel as a child of the document body and position it absolutely it should show above your existing layout. You could also (more easily) use an Ext.Window to do this.