Updating layout after modification

[ignus]

So.. here's what im trying to do.

I have a class named MenuWidget which has "options" (array of Label's) and a container (VLayout).

I want to be able to change the current active option (menu option) based on where I am on the page. I already have this working, but my current approach requires instantiating a new MenuWidget each time I change page, because, after many attempts, I havent been able to re-use the same object of MenuWidget.

**This is my LayoutHelper (I use it to interact with the layout)**

public class LayoutHelper {

	private static MenuWidget menu;
	
	public static void render(String currentOption) {
		/**
		 * @todo: mejorar esto, se tiene que instanciar un menu cada vez que se cambia de página, debe haber alguna manera mejor
		 */
		
		if(menu == null) {
			menu = new MenuWidget();
			menu.setCurrentOption(currentOption);
			menu.build();
		} else {
			menu.setCurrentOption(currentOption); //this part
			menu.rebuild(); //doesnt work
		}		
		
		RootPanel.get("menu").clear();
		RootPanel.get("menu").add(menu.getCanvas());
	}
}

***Then, this is MenuWidget***

public class MenuWidget implements Widget {

	private Label[] options;
	private VLayout container;
	private String currentOption;

	public MenuWidget() {
		this.options = new Label[10];
		this.container = new VLayout();
	}

	@Override
	public Canvas getCanvas() {
		return container;
	}

	public void setupContainer() {
		container.setWidth("250");
		container.setBackgroundColor("#3f3f3f");
		
		for (int i = 0; i < this.options.length; ++i) {
			container.addMember(this.options[i]);
		}
	}
	
	public void setupOptions() {
		for (int i = 0; i < this.options.length; ++i) {
			options[i] = new Label();
			options[i].setStyleName("menu_nav");
			options[i].setHeight("25");
		}

		options[0].setContents("Inicio");
		options[0].addClickHandler(new ClickHandler() {

			@Override
			public void onClick(ClickEvent event) {
				EventBus.getEventBus().fireEvent(new HomeShowViewEvent());
			}
		});

		options[1].setContents("Usuarios");
		options[2].setContents("Clientes");
		options[3].setContents("Proveedores");

		options[4].setContents("Orden pedido");
		options[4].addClickHandler(new ClickHandler() {

			@Override
			public void onClick(ClickEvent event) {
				EventBus.getEventBus().fireEvent(new OpedidoShowViewEvent());
			}
		});

		options[5].setContents("Orden compra");
		options[6].setContents("Orden reparto");
		options[7].setContents("Orden recepción");
		options[8].setContents("Orden pago");
		
		updateCurrentOption();
	}
	
	public void updateCurrentOption() {
		for (int i = 0; i < this.options.length; ++i) {
			if (options[i].getContents().equals(this.currentOption)) {
				options[i].setStyleName("menu_nav_active");
				break;
			}
		}	
	}
	
	@Override
	public void build() {
		setupOptions();
		setupContainer();
	}
	
	public void rebuild() {
		updateCurrentOption();
		container.clear();
		setupContainer();
		//container.redraw();
	}

	public void setCurrentOption(String option) {
		currentOption = option;
	}
}

The first time I add the widget to the RootPanel, it renders fine, the second time, it shows nothing =/.

Any help would be greatly appreciated, and.. if someone knows a better way to do something I'm doing, suggestions are also welcomed (I havent been able to find good documentation besides the javadoc api =/)

[svjard]

Total overkill, you don't need to recreate the object everytime something changes, simply setStyleName() as you do in your update, call markForRedraw().

[ignus]

Thanks for your reply

If you look carefully at "rebuild()", that was what im trying to do... but for some reason it just doesnt work.

Is there somekind of documentation regarding how the pipeline of smartgwt works ? I'm asking this because I noticed that if I add a widget to say, a layout, and afterwards I modify that widget, the changes are not reflected when drawing the layout.

Also, when I add a widget to the RootPanel, does the RootPanel call draw at the layout and then insert it where it belongs ?

Thanks for the help. Still trying not to instantiate the object each time =/

[svjard]

Well first off what is the reason for using Widget? Are you mixing GWT components throughout your app? Tradionally, you don't need add to root panel, you would just call .draw() on the canvas. Your issue might be the mixing of components, I could provide you a totally SmartGwt solution if you want, then you'd have to play with the mixing, generally GWT components in SmartGwt ones are the better way to go.

[ignus]

Yeah.. I used the wrong word. Im not using GWT widgets, its just the name I'm using to identify my "components" throughout the application.

The only GWT-Smartgwt "mixing" I'm doing is using RootPanel.get("div").add(smartgwtcomponent). This is because I wanted to make the structure of the application using divs and css. If this is not recommended then I could switch to using smartgwt only (I couldn't find any information regarding this).

If you could provide me with the example application, that would be awesome.

Thanks again for helping me out!

[ignus]

So.. it looks like the problem is using RootPanel.get()..., I did a small prototype using just smartgwt and its working fine (marking for redraw, modifying the layout, etc).

[svjard]

Good deal, yeah I thought it had to do with that.