`

[zt]Master/Details 模式在Eclipse Forms中的应用

Eclipse设计模式UIGmailPHP 
阅读更多

From:http://www.eclipseworld.org/bbs/read.php?tid=1296

 Master/Details是UI设计中常见的一种模式。他有一组（列表或成树状结构）的master和一个被选中 master驱动的details集组成。
    master是一些不同的对象，通过对master的选择，驱动details的UI发生变化。在下面的图中，有3各不同的master，分别对应3种不同的UI：

描述：1 初始状态：只有master的树状列表
图片：


描述：2 选中一个master，是一个对象
图片：
 

描述：3 选中另外一个master，是一个不同的对象
图片：


描述：4 选中另外一个master，又是一个不同的对象
图片：
 

首先我们需要一个FormEditor，在这个FormEditor中添加我们要显示的页最后我们只要实现不同的page就可以了。

 

java 代码
  1. public class AdvancedFormEditor extends FormEditor{   
  2.   
  3.   public AdvancedFormEditor(){   
  4.     super();   
  5.   }   
  6.   
  7.   protected void addPages(){   
  8.     try{   
  9.         addPage(new MainPage(this));   
  10.     }catch(PartInitException e){   
  11.         e.printStackTrace();   
  12.     }   
  13.   }   
  14.   
  15.   public void doSave(IProgressMonitor monitor){   
  16.   
  17.   }   
  18.   
  19.   public void doSaveAs(){   
  20.   }   
  21.   
  22.   public boolean isSaveAsAllowed(){   
  23.     return false;   
  24.   }   
  25. }   

 

然后来构造这个页，ScrolledPropertiesBlock对象就是我们存放master的地方。
在这个ScrolledPropertiesBlock中，我们将masters以树状结构显示出来。

java 代码
  1. public class MainPage extends FormPage{   
  2.   private ScrolledPropertiesBlock block;   
  3.   
  4.   public MainPage(FormEditor editor){   
  5.     super(editor,"main","Advanced Form Editor");   
  6.     block=new ScrolledPropertiesBlock();   
  7.   }   
  8.   
  9.   /* ManagedForm封装了form元素的生命周期管理与各个form元素之间的事件通知  
  10.   * ManagedForm本身并不是一个form，他包含了一个form并且可以注册IFormPart。  
  11.   * 可以将ManagedForm看作是'viewers'，form和managed form之间的关系就好像  
  12.   * Table与TableViewer的关系一样。  
  13.   */  
  14.   protected void createFormContent(IManagedForm managedForm){   
  15.     ScrolledForm form=managedForm.getForm();   
  16.     form.setText("Advanced Form Editor");   
  17.     form.setBackgroundImage(Images.getImage("icons/form_banner.gif"));   
  18.        
  19.     //尽量在最后调用这个方法   
  20.     block.createContent(managedForm);   
  21.   }   
  22. }   



主要的内容还是在ScrolledPropertiesBlock这个类中。
  Eclipse Forms对Master/Details 模式体供了一个实现。具备以下属性：
1、当details part被创建的时候, master part的工厂方法createMasterPart还是抽象的，必须先被其子类实现。
2、Master and details实际上是sash form的两个子元素。可以通过调整sash的大小来改变他们俩的区域。
3、由于sash form的特性, master 与 details parts可以被横向或纵向排列。

    master/details 块的目的就是创建一个tree或table section，通过managed form来唤醒selection事件。
  如果details part可以处理被选中的master对象,他就会切换不同的页来显示属性。

  当子类在创建顶级master/details时应该注意：
1、创建一个用来驱动details的master part
2、为form tool bar提供actions，一般显示在form的右上方，与form标题区同排
3、注册detail页,master part可以条用注册的所有detail

java 代码
  1. public class ScrolledPropertiesBlock extends MasterDetailsBlock {   
  2.   class MasterContentProvider...{   
  3.     ... ...   
  4.   }   
  5.   class MasterLabelProvider...{   
  6.     ... ...   
  7.   }   
  8.   
  9.   protected void createMasterPart(final IManagedForm managedForm,Composite parent) {   
  10.     FormToolkit toolkit = managedForm.getToolkit();   
  11.     Section section = toolkit.createSection(parent, Section.DESCRIPTION|Section.TITLE_BAR);   
  12.     section.setText("模型列表");   
  13.     section.setDescription("以下把两种模型列在表中，可以通过选择不同的模型在右边切换编辑页面进行编辑");   
  14.     section.marginWidth = 10;   
  15.     section.marginHeight = 5;   
  16.        
  17.     toolkit.createCompositeSeparator(section);   
  18.        
  19.     Composite client = toolkit.createComposite(section, SWT.WRAP);   
  20.     GridLayout layout = new GridLayout();   
  21.     layout.numColumns = 2;   
  22.     client.setLayout(layout);   
  23.        
  24.     Table t = toolkit.createTable(client, SWT.NULL);   
  25.     t.setLayoutData(new GridData(GridData.FILL_BOTH));   
  26.        
  27.     /*  
  28.       * 为当前parent内，toolkit所创建的widget添加边框。如果widget已经设置了SWT.BORDER，  
  29.       * 则不会再为其添加边框。   
  30.       */  
  31.     toolkit.paintBordersFor(client);   
  32.        
  33.     Button b = toolkit.createButton(client, "添加", SWT.PUSH);   
  34.     b.setLayoutData(new GridData(GridData.VERTICAL_ALIGN_BEGINNING));   
  35.        
  36.     /* IFormPart管理了整个Part的dirty state, saving, commit, focus, selection changes等等这样的事件。  
  37.       * 并不是form中的每一个control都需要成为一个form part，最好将一组control通过实现IFormPart变成一个Part.  
  38.       * 一般来说Section就是一个自然形成的组，所以Eclipse Form提供了一个SectionPart的实现，它包含一个Section  
  39.       * 的实例。     
  40.       */  
  41.     final SectionPart spart = new SectionPart(section);   
  42.     managedForm.addPart(spart);   
  43.        
  44.     TableViewer viewer = new TableViewer(t);   
  45.     viewer.addSelectionChangedListener(new ISelectionChangedListener() {   
  46.         public void selectionChanged(SelectionChangedEvent event) {   
  47.           managedForm.fireSelectionChanged(spart, event.getSelection());   
  48.         }   
  49.     });   
  50.     viewer.setContentProvider(new MasterContentProvider());   
  51.     viewer.setLabelProvider(new MasterLabelProvider());   
  52.     viewer.setInput(new SimpleFormEditorInput("simple "));   
  53.        
  54.     /**  
  55.       * Sets the client of this expandable composite. The client must not be  
  56.       * null and must be a direct child of this container.  
  57.       */  
  58.     section.setClient(client);   
  59.   }   
  60.      
  61.   protected void createToolBarActions(IManagedForm managedForm) {   
  62.     final ScrolledForm form = managedForm.getForm();   
  63.     Action haction = new Action("hor", Action.AS_RADIO_BUTTON) {   
  64.         public void run() {   
  65.           sashForm.setOrientation(SWT.HORIZONTAL);   
  66.           form.reflow(true);   
  67.         }   
  68.     };   
  69.     haction.setChecked(true);   
  70.     haction.setToolTipText("横向排列");   
  71.     haction.setImageDescriptor(Images.getImageDescriptor("icons/th_horizontal.gif"));   
  72.        
  73.     Action vaction = new Action("ver", Action.AS_RADIO_BUTTON) {   
  74.         public void run() {   
  75.           sashForm.setOrientation(SWT.VERTICAL);   
  76.           form.reflow(true);   
  77.         }   
  78.     };   
  79.     vaction.setChecked(false);   
  80.     vaction.setToolTipText("纵向排列");   
  81.     vaction.setImageDescriptor(Images.getImageDescriptor("icons/th_vertical.gif"));   
  82.     form.getToolBarManager().add(haction);   
  83.     form.getToolBarManager().add(vaction);   
  84.   }   
  85.   protected void registerPages(DetailsPart detailsPart){   
  86.     detailsPart.registerPage(TopicDatadefSet.class, new DatadefSetDetailsPage());   
  87.     detailsPart.registerPage(TopicCategory.class, new TopicCatalogDetailsPage());   
  88.     detailsPart.registerPage(TopicDef.class, new TopicDetailsPage());   
  89.   }   
  90. }   

 

大家应该注意到上面的程序中有两个很重要的方法：

java 代码
  1. TableViewer viewer = new TableViewer(t);   
  2. viewer.addSelectionChangedListener(new ISelectionChangedListener() {   
  3.   public void selectionChanged(SelectionChangedEvent event) {   
  4.     managedForm.fireSelectionChanged(spart, event.getSelection());   
  5.   }   
  6. });   


这里面的event.getSelection()得到的就是这个master的对象，也就是下面这个方法中的
TopicDatadefSet、TopicCategory、TopicDef3个对象。而下面这个方法就是把每个master对象与其detail页关联起来：

java 代码
  1. protected void registerPages(DetailsPart detailsPart){   
  2.     detailsPart.registerPage(TopicDatadefSet.class, new DatadefSetDetailsPage());   
  3.     detailsPart.registerPage(TopicCategory.class, new TopicCatalogDetailsPage());   
  4.     detailsPart.registerPage(TopicDef.class, new TopicDetailsPage());   
  5. }   

 

java 代码
  1. public class DatadefSetDetailsPage implements IDetailsPage{   
  2.   ... ...   
  3. }   

 

 

分享到：
| [zt]上海观光路线推荐
评论
2 楼 tomfish88 2011-10-10  
detailsPart.registerPage(TopicDatadefSet.class, new DatadefSetDetailsPage());  
    detailsPart.registerPage(TopicCategory.class, new TopicCatalogDetailsPage());  
    detailsPart.registerPage(TopicDef.class, new TopicDetailsPage());  
}  


这三个class文件怎么定义？？？
1 楼 minminy198 2010-06-04  
你好，我在使用这种模式的时候，遇到了一个小问题，希望你能我解决。。就是master和detail不是等高的，detail页的标题栏会比master低一些，我的邮箱是minminy198@gmail.com
非常感谢。
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics