PDA

View Full Version : scrollToTab not working?



Daniel Kurka
26 May 2008, 4:40 AM
Im Trying to replace a frame in a tabpanel. Everything seems to work fine, but i can not scroll to the inserted tabitem or show it.

the internal position of the tabitem is -1 (left) maybe this has something to do with it.

Any suggestions?

I have attached a little code example.


package com.mycompany.project.client;

/*
* Ext GWT - Ext for GWT
* Copyright(c) 2007, 2008, Ext JS, LLC.
* [email protected]
*
* http://extjs.com/license
*/

import com.extjs.gxt.ui.client.Events;
import com.extjs.gxt.ui.client.Style.Orientation;
import com.extjs.gxt.ui.client.Style.Scroll;
import com.extjs.gxt.ui.client.event.ComponentEvent;
import com.extjs.gxt.ui.client.event.Listener;
import com.extjs.gxt.ui.client.event.SelectionListener;
import com.extjs.gxt.ui.client.event.TabPanelEvent;
import com.extjs.gxt.ui.client.widget.Button;
import com.extjs.gxt.ui.client.widget.ButtonBar;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.Info;
import com.extjs.gxt.ui.client.widget.TabItem;
import com.extjs.gxt.ui.client.widget.TabPanel;
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.RowData;
import com.extjs.gxt.ui.client.widget.layout.RowLayout;
import com.extjs.gxt.ui.client.widget.layout.RowData.FillType;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.RootPanel;

import com.extjs.gxt.ui.client.widget.ContentPanel;

public class TabTest extends LayoutContainer implements EntryPoint {

public void onModuleLoad() {
this.setAutoHeight(true);
this.setAutoWidth(true);
Viewport v = new Viewport();
v.add(this);
v.layout(true);
v.setLayout(new FitLayout());

;
RootPanel.get().add(v);
}

int count = 1;

public TabTest() {
setData("layout", new FitLayout());
}

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

final TabPanel tabFolder = new TabPanel();
tabFolder.setTabScroll(true);
tabFolder.addListener(Events.SelectionChange, new Listener<TabPanelEvent>() {
public void handleEvent(TabPanelEvent tpe) {
TabItem item = tpe.item;
Info.display("Selection Changed", "The '{0}' item was selected", item.getText());
}
});
TabItem item = new TabItem();
item.setText("GWT");
item.setIconStyle("icon-tabs");
item.setUrl("http://code.google.com/webtoolkit");
tabFolder.add(item);
tabFolder.setSelection(item);

item = new TabItem();
item.setClosable(true);
item.setText("Close");
item.setIconStyle("icon-tabs");
// TODO: add close event to tab item
item.addListener(Events.Close, new Listener<ComponentEvent>() {
public void handleEvent(ComponentEvent ce) {
TabItem item = (TabItem) ce.component;
Info.display("Close", "Closing {0}", item.getText());
}
});
item.setScrollMode(Scroll.AUTO);
item.addText("asdfasdfasdfasdaf");
tabFolder.add(item);

item = new TabItem();
item.setClosable(true);
item.setText("Tab 3");
item.setIconStyle("icon-tabs");
item.addListener(Events.Close, new Listener<ComponentEvent>() {
public void handleEvent(ComponentEvent ce) {
TabItem item = (TabItem) ce.component;
Info.display("Close", "Closing {0}", item.getText());
}
});

tabFolder.add(item);

ButtonBar buttonBar = new ButtonBar();
buttonBar.add(new Button("Add TabItem", new SelectionListener() {

public void componentSelected(ComponentEvent ce) {
TabItem item = new TabItem();
item.setClosable(true);
item.setText("New Item " + count++);
tabFolder.add(item);
}

}));

buttonBar.add(new Button("Replace active Tab", new SelectionListener() {
public void componentSelected(ComponentEvent ce) {

//get index of current tab
int index = tabFolder.indexOf(tabFolder.getSelectedItem());

TabItem selectedItem = tabFolder.getSelectedItem();
//remove the current tab
tabFolder.remove(selectedItem);

//set up a new tab
TabItem item = new TabItem();
item.setClosable(true);
item.setText("asdf");
item.setUrl("http://www.google.de");
//insert the new tab at the right posstion
tabFolder.insert(item, index);


tabFolder.scrollToTab(item, true);

}
}));

RowLayout layout = new RowLayout(Orientation.VERTICAL);
layout.setMargin(15);
setLayout(layout);

tabFolder.setData(new RowData(FillType.BOTH));
add(tabFolder);
add(buttonBar);

}}

gslender
26 May 2008, 1:08 PM
Not 100% sure what you are trying to do, but if you just want to show a tabitem programatically, then you need to use setSelection(TabItem item)

scrollToTab is for when you have sooooo many tab items its not even shown (ie its scroll at the top off the left/right side and not visible).

Daniel Kurka
26 May 2008, 9:35 PM
yes i wanted to show the new added tab. works fine now thanks