PDA

View Full Version : How to properly use resizable?



babyblue
26 Aug 2009, 9:48 AM
http://extjs.com/examples-dev/explorer.html#resizable

I'm having trouble with using resizable, see my example below. This is basically the same code as the Resizable example, just added another content panel. All is good until you try to change the height of the resizable content panel, when you do that, the other content panel will also jump.


package com.example.client;

import com.example.client.gxtsamples.TestData;
import com.extjs.gxt.ui.client.fx.Draggable;
import com.extjs.gxt.ui.client.fx.Resizable;
import com.extjs.gxt.ui.client.widget.Component;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.Viewport;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.extjs.gxt.ui.client.widget.layout.FlowLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.RootPanel;

public class TestResizable implements EntryPoint {

@Override
public void onModuleLoad(){
Viewport viewport = new Viewport();
viewport.setLayout(new FitLayout());
viewport.setEnableScroll(false);
viewport.add(new ResizableExample());
RootPanel.get().add(viewport);

}

private static class ResizableExample extends LayoutContainer {

@Override
protected void onRender(Element parent, int index) {
super.onRender(parent, index);

// original example
ContentPanel cp = new ContentPanel();
cp.setHeading("8-Way Resizing");
cp.setBodyStyleName("pad-text");
cp.addText(TestData.DUMMY_TEXT_SHORT);

cp.setSize(200, 125);
cp.setPosition(10, 10);

Draggable d = new Draggable(cp);
if (getParent() instanceof Component) {
d.setContainer((Component) getParent());
}
new Resizable(cp);

setLayout(new FlowLayout());
add(cp);


// additional box from draggable example

cp = new ContentPanel();
cp.setCollapsible(true);
cp.setBodyStyleName("pad-text");
cp.setHeading("Proxy Drag");
cp.addText(TestData.DUMMY_TEXT_SHORT);
cp.setWidth(200);

d = new Draggable(cp);
add(cp);

}

}
}