GXT之旅:第八章:Portal&Drag-Drop——项目使用Drag-Drop重构(1)
2012-04-26 15:37
477 查看
Drag-Drop重构
我们现在针对RSSReader项目,使用Drag-Drop的Portal布局效果。下面就开始使用GXT内建好的DragSource和DropTarget。首相,我们要做的是允许用户可以从NavPortlet中FeedList的里面拖拽一条feed,然后可以放置到FeedPortlet,接下来其feed的内容会自动的通过ItemGrid显示出来。
RSSReaderConstants类,定义一个新的恒量——FEED_DD_GROUP用来作为drag-drop分组用的‘字符串组名’
public static final String FEED_DD_GROUP = "feedDDGroup";
在FeedList.onRender()方法里面,在add(feedList);之前加入如下代码——新建DragSource包装feedList,并且将其选中的object传入到DNDEvent(注意选中的可能是多个)。
DragSource source = new DragSource(feedList) { @Override protected void onDragStart(DNDEvent event) { event.setData(feedList.getSelection()); } }; source.setGroup(RSSReaderConstants.FEED_DD_GROUP); add(feedList);//above
上面的代码中,还将source设置了group——FEED_DD_GROUP。
在FeedPortlet类中,新建一个方法onFeedsDropped()——此方法,会通过DNDEvent里取出其携带的objects。然后会根据objects的size生成相同size的ItemGrid,后续的操作就类似于FeedView里面的操作了。
private void onFeedsDropped(DNDEvent event) { List<BeanModel> beanModels = event.getData(); for (BeanModel beanModel : beanModels) { Feed feed = beanModel.getBean(); final ItemGrid itemGrid = new ItemGrid(feed); TabItem tabItem = new TabItem(feed.getTitle()); tabItem.setId(feed.getUuid()); tabItem.setData("feed", feed); tabItem.add(itemGrid); tabItem.addListener(Events.Select, new Listener<TabPanelEvent>() { @Override public void handleEvent(TabPanelEvent be) { itemGrid.resetSelection(); } }); tabItem.setClosable(true); feedPanel.addTab(tabItem); } }
接下来是要完成DropTarget的定义部分。在FeedPortlet里面,我们在其onRender()方法里面处理,将FeedPortlet自己用DropTarget包装起来。
protected void onRender(Element parent, int index) { super.onRender(parent, index); DropTarget target = new DropTarget(this); }
Override DropTarget.onDragDrop(DNDEvent event)方法,将event传入到先前定义的onFeedsDropped(event)方法里去
protected void onRender(Element parent, int index) { super.onRender(parent, index); DropTarget target = new DropTarget(this) { @Override protected void onDragDrop(DNDEvent event) { super.onDragDrop(event); onFeedsDropped(event); } }; }
target设置好了之后,设置其属性——setOperation(),因为是默认是move操作,所以要修改为copy操作。在设置target的group
protected void onRender(Element parent, int index) { super.onRender(parent, index); DropTarget target = new DropTarget(this) { @Override protected void onDragDrop(DNDEvent event) { super.onDragDrop(event); onFeedsDropped(event); } }; target.setOperation(DND.Operation.COPY); target.setGroup(RSSReaderConstants.FEED_DD_GROUP); }
开始运行程序,效果图如下~~~~
相关文章推荐
- GXT之旅:第八章:Portal&Drag-Drop——项目使用Drag-Drop重构(2)
- GXT之旅:第八章:Portal&Drag-Drop——项目使用Drag-Drop重构(3)
- GXT之旅:第八章:Portal&Drag-Drop——项目使用Portal重构(1)
- GXT之旅:第八章:Portal&Drag-Drop——项目使用Portal重构(3)
- GXT之旅:第八章:Portal&Drag-Drop——项目使用Portal重构(2)
- GXT之旅:第八章:Portal&Drag-Drop——Portal的基本介绍
- GXT之旅:第八章:Portal&Drag-Drop——拖拽(Drag-Drop)基本介绍
- 使用ASP.NET Atlas实现拖放(Drag & Drop)效果
- 使用HTML5的drag&drop做一个数独游戏
- 使用HTML5的drag&drop做一个数独游戏
- CxImage的简单使用(编译-->项目设置-->代码示例(PNG透明贴图))
- x4412开发板&ibox卡片电脑项目实战10-使用buildroot搭建linux文件系统
- 第五部分:Drop源(OLE drag&drop之旅)
- Gradle 使用Jetty插件启动web项目时出现"java.lang.OutOfMemoryError: PermGen space"解决方法
- WebKit Drag & Drop
- Symfony 1.4 Drag&Drop Nested Set Editor for Admin Generator
- Unity3d NGUI的使用(七)(UIPopup List&使用UIPopup本地化项目)
- 给力的 Google HTML5 训练营(HTML5 Drag&Drop 拖拽、FileReader实例教程
- 【Spring Boot&&Spring Cloud系列】使用Intellij构建Spring Boot和Mybatis项目
- HTML5 drag & drop 拖拽与拖放简介