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

Overview

其实对于Portlet来说,他适合作为一个summary的显示效果。先前的章节里面,我们使用过FeedOverviewView来显示一个feed的summary信息。现在我们就要新建一个OverviewPortlet包含FeedOverviewView。

  • 新建OverviewPortlet:

package com.danielvaughan.rssreader.client.portlets;

import java.util.List;

import com.danielvaughan.rssreader.client.RSSReaderConstants;
import com.danielvaughan.rssreader.client.lists.FeedOverviewView;
import com.danielvaughan.rssreader.client.mvc.events.AppEvents;
import com.extjs.gxt.ui.client.data.BeanModel;
import com.extjs.gxt.ui.client.dnd.DND;
import com.extjs.gxt.ui.client.dnd.DropTarget;
import com.extjs.gxt.ui.client.event.DNDEvent;
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 OverviewPortlet extends Portlet {
	public OverviewPortlet() {
		setHeading("Overview");
		setLayout(new FitLayout());
		setHeight(250);
		setId(RSSReaderConstants.OVERVIEW_PORTLET);
		final FeedOverviewView feedOverviewView = new FeedOverviewView();
		add(feedOverviewView);
		DropTarget target = new DropTarget(this) {
			@Override
			protected void onDragDrop(DNDEvent event) {
				super.onDragDrop(event);
				List beanModels = event.getData();
				feedOverviewView.addFeeds(beanModels);
			}
		};
		target.setOperation(DND.Operation.COPY);
		target.setGroup(RSSReaderConstants.FEED_DD_GROUP);
		Dispatcher.forwardEvent(AppEvents.NewPortletCreated, this);
	}
}

  • 在RSSReaderConstants类里加入OVERVIEW_PORTLET定义

public static final String OVERVIEW_PORTLET = "overviewPortlet";
  • 修改FeedOverviewView,如下:

package com.danielvaughan.rssreader.client.lists;

import java.util.List;

import com.extjs.gxt.ui.client.Style.Scroll;
import com.extjs.gxt.ui.client.data.BeanModel;
import com.extjs.gxt.ui.client.event.Events;
import com.extjs.gxt.ui.client.event.Listener;
import com.extjs.gxt.ui.client.event.SelectionChangedEvent;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.util.Format;
import com.extjs.gxt.ui.client.widget.Info;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.ListView;
import com.google.gwt.user.client.Element;

public class FeedOverviewView extends LayoutContainer {

	private final ListStore feedStore = new ListStore();
	private ListView listView = new ListView();

	public void addFeeds(List feeds) {
		feedStore.add(feeds);
	}

	private String getTemplate() {
		StringBuilder sb = new StringBuilder();
		sb.append("");
		sb.append("
"); sb.append("

{title}

"); sb.append(""); sb.append(""); sb.append(""); sb.append("

{shortDescription}

"); sb.append("
    "); sb.append(""); sb.append(""); sb.append("
  • {title}
  • "); sb.append("
    "); sb.append("
    "); sb.append("
"); sb.append("
"); sb.append("
"); return sb.toString(); } @Override protected void onRender(Element parent, int index) { super.onRender(parent, index); setScrollMode(Scroll.AUTOY); listView = new ListView() { @Override protected BeanModel prepareData(BeanModel feed) { feed.set("shortTitle", Format.ellipse((String) feed.get("title"), 50)); feed.set("shortDescription", Format.ellipse((String) feed.get("description"), 100)); return feed; } }; listView.setStore(feedStore); listView.setTemplate(getTemplate()); listView.setItemSelector("div.feed-box"); listView.getSelectionModel().addListener(Events.SelectionChange, new Listener>() { @Override public void handleEvent(SelectionChangedEvent be) { BeanModel feed = be.getSelection().get(0); Info.display("Feed selected", (String) feed.get("title")); } }); add(listView); } }

  • 修改RSSReader

package com.danielvaughan.rssreader.client;

import com.danielvaughan.rssreader.client.mvc.controllers.PortalController;
import com.danielvaughan.rssreader.client.portlets.FeedPortlet;
import com.danielvaughan.rssreader.client.portlets.ItemPortlet;
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 onModuleLoad().
 */
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();
		new OverviewPortlet();
		new FeedPortlet();
		new ItemPortlet();
	}
}






你可能感兴趣的:(GWT/GXT,GXT之旅)