GXT之旅：第八章：Portal&Drag-Drop——项目使用Portal重构(2)

实际上，Portlet components并不是那么复杂，大多数的工作，我们在上一节都完成了，Portlet其实只是一个包装。

• 新建包：com.danielvaughan.rssreader.client.portlets。在此包下，新建类NavPortlet extends Portlet（负责左侧导航区域）

package com.danielvaughan.rssreader.client.portlets;

import com.extjs.gxt.ui.client.widget.custom.Portlet;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;

public class NavPortlet extends Portlet {
	public NavPortlet() {
		setHeading("Navigation");
		setLayout(new FitLayout());
		setHeight(610);
	}
}

• 在RSSReaderConstants类里，定义一个新的恒量NAV_PORTLET

public static final String NAV_PORTLET = "navPortlet";

• 恒量设置之后，在NavPortlet类构造函数里，用其来设置ID

package com.danielvaughan.rssreader.client.portlets;

import com.danielvaughan.rssreader.client.RSSReaderConstants;
import com.extjs.gxt.ui.client.widget.custom.Portlet;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;

public class NavPortlet extends Portlet {
	public NavPortlet() {
		setHeading("Navigation");
		setLayout(new FitLayout());
		setHeight(610);
		
		setId(RSSReaderConstants.NAV_PORTLET);
	}
}

• 继续在此构造函数里，新建NavPanel，加入到NavPortlet里。

	public NavPortlet() {
		setHeading("Navigation");
		setLayout(new FitLayout());
		setHeight(610);

		setId(RSSReaderConstants.NAV_PORTLET);

		NavPanel navPanel = new NavPanel();
		navPanel.setHeaderVisible(false);
		add(navPanel);
	}

• NavPortlet的创建过程已经完毕，接下来需要通知portal，这一过程——通过派发NewPortletCreated事件，实现通知的过程。

package com.danielvaughan.rssreader.client.portlets;

import com.danielvaughan.rssreader.client.RSSReaderConstants;
import com.danielvaughan.rssreader.client.components.NavPanel;
import com.danielvaughan.rssreader.client.mvc.events.AppEvents;
import com.extjs.gxt.ui.client.mvc.Dispatcher;
import com.extjs.gxt.ui.client.widget.custom.Portlet;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;

public class NavPortlet extends Portlet {
    public NavPortlet() {
        setHeading("Navigation");
        setLayout(new FitLayout());
        setHeight(610);

        setId(RSSReaderConstants.NAV_PORTLET);

        NavPanel navPanel = new NavPanel();
        navPanel.setHeaderVisible(false);
        add(navPanel);
        
        Dispatcher.forwardEvent(AppEvents.NewPortletCreated , this);
    }
}

• NewPortletCreated事件派发出来之后，我们就需要在对应的View类里处理该事件——编辑PortalView类，新建onNewPortletCreated()方法，根据RSSReaderConstants.NAV_PORTLET来判断将传入的portlet加入到哪一列上。

	@Override
	protected void handleEvent(AppEvent event) {
		EventType eventType = event.getType();
		if (eventType.equals(AppEvents.NewPortletCreated)) {
			onNewPortletCreated(event);
		}
	}

	private void onNewPortletCreated(AppEvent event) {
		final Portlet portlet = (Portlet) event.getData();
		if (portlet.getId() == RSSReaderConstants.NAV_PORTLET) {
			portal.add(portlet, 0);
		} else {
			portal.add(portlet, 1);
		}
	}

• 目前我们所要做的就是，回到RSSReader.onModuleLoad方法，新建一个NavPortlet实例。剩下的操作，就交给MVC自动处理了～～～

package com.danielvaughan.rssreader.client;

import com.danielvaughan.rssreader.client.mvc.controllers.PortalController;
import com.danielvaughan.rssreader.client.portlets.NavPortlet;
import com.danielvaughan.rssreader.client.services.FeedService;
import com.danielvaughan.rssreader.client.services.FeedServiceAsync;
import com.extjs.gxt.ui.client.Registry;
import com.extjs.gxt.ui.client.mvc.Dispatcher;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;

/**
 * Entry point classes define <code>onModuleLoad()</code>.
 */
public class RSSReader implements EntryPoint {

	/**
	 * This is the entry point method.
	 */
	@Override
	public void onModuleLoad() {

		final FeedServiceAsync feedService = GWT.create(FeedService.class);
		Registry.register(RSSReaderConstants.FEED_SERVICE, feedService);
		Dispatcher dispatcher = Dispatcher.get();
		dispatcher.addController(new PortalController());
		
		new NavPortlet();
	}
}

• 最后，让我们来看看效果吧