`
yianpuodiaotu
  • 浏览: 241706 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

DND学习

阅读更多

DND入门学习

Drag and Drop是Eclipse为用户在一个或多个SWT应用之间重置部件或数据传输上提供的简单快捷的机制。可以使用在普通SWT应用中,也是学习GEF的基础部分。下面我从以下几个Drag and Drop所必需的部分来简单讲述:

DragSource And DropTarget

要 实现Drag and Drop,就必须要有DragSource And DropTarget。DragSource是数据传输过程中的数据提供者,而DropTarget是数据接收者。他们分别绑定SWT的widget,需 要注意的是同一widget只能帮定在一个DragSource或DropTarget上。在鼠标拖动的过程中,我们可以通过鼠标图形的变化来得知当前经 过的是否是一个有效的DropTarget,这个过程叫做“drag over effect”。鼠标图形同时也可以告诉我们在数据被Drop之后,什么样的操作会被执行,是拷贝还是移动还是别的什么。在windows中有以下几种鼠 标图形:
[attachment=453]
如果我们drag over一个带有item的部件,比方说tree或者table,那么item会变成高亮表明我们会将数据Drop在这个item上,这个过程我们叫“drag under effect”。

Transfer

有 了DragSource 和 DropTarget之后,我们就需要一个载体来承载不同类型的数据,让这个载体在DragSource 和 DropTarget之间传递数据。Transfer实际上是一个提供数据在Java representation与platform specific representation之间交互的抽象类.在Java对象与特定的平台之间进行format,下面是几个format:

TextTransfer String "hello world" 
RTFTransfer String "{\\rtf1\\b\\i hello world}"
FileTransfer String[] new String[] {file1.getAbsolutePath(), file2.getAbsolutePath()} 


Transfer 是传输的载体,TransferData真正的利用JNI将数据和本地操作系统发生关系。TransferData包含了很多特定于平台的公用的属性,应 用不应该直接去访问这些属性。如果真的有必要去访问这些属性,那么我们可以通过扩展Transfer类来完成对特定平台的额外操作。
另外,Transfer不只是可以用在DND中,也可以单独拿出来使用,例如实现Clipboard,可以在copy时将数据暂存于Clipboard中,past时再取出。这个和DND的在Drag时将数据暂存于Clipboard中,Drop时再取出类似。
理解了拖拽的这些概念之后,下面我们就着一个简单的例子来运用一下。如图所示,这个例子中,左面的tree是DragSource,右面的table是DropTarget,我们从左面的tree中选择一条,拖进右边的table中:


我们先从DragSource开始:

//获得一个TextTransfer的实例,TextTransfer是Transfer的一个子类,
//他提供将普通文本以Java String的表示转换为特定于平台的表示的机制。
TextTransfer textTransfer=TextTransfer.getInstance();

//构造一个普通的tree
dragTree=new Tree(parent,SWT.FULL_SELECTION|SWT.SINGLE);

//将dragTree与DragSource绑定(一个widget只能绑定在一个DragSource),
//并允许数据可以从DragSource被MOVE或COPY
DragSource source=new DragSource(dragTree,DND.DROP_MOVE|DND.DROP_COPY);
//指定允许的textTransfer类型,可以是多个。
source.setTransfer(new Transfer[] { textTransfer });
//注册DragSourceListener。处理拖操作的一些事件
source.addDragListener(new MyDragSourceListener());

在MyDragSourceListener中有以下3个方法:

// 指定拖动开始的执行策略。
public void dragStart(DragSourceEvent event){
  //在这里可以设置一些条件,如果不符合条件,比方说选中的treeitem是根,
    //则不可拖动
    if(treeitem是根){
     event.doit=false;
    }
}

//dragSetData方法在dragStart通过之后才被调用。这个方法可能会因为同一种传输
//类型多次set或不同的多种传输类型的set而被多次调用,象windows等有些平台
//中,dropTarget可以在鼠标移动的过程中请求数据,但是在Motif等平台中,只可以
//在drop操作完成之后才可以请求数据,所以在这个方法中不要假设drag and drop操
//作已经完成.在这个方法中是无法知道data将被drop到哪里.
//set的Data也要符合指定的Transfer的format类型。
    public void dragSetData(DragSourceEvent event){
       //在这里可以为DragSourceEvent添加数据,这个方法在拖动过程中
    //会被不停的调用
        TreeItem selection = DragAndDrop.this.dragTree.getSelection()[0];
        event.data=selection.getText();
    }

    // 根据事先指定好的操作类型来处理操作结果
    public void dragFinished(DragSourceEvent event){
        if(event.detail==DND.DROP_MOVE){
            //remove selection TreeItem
        }
    }
其次是DropTarget

// 将dropTable指定为Drop Target,
    DropTarget target=new DropTarget(dropTable,DND.DROP_MOVE|DND.DROP_COPY|DND.DROP_DEFAULT);
    target.setTransfer(new Transfer[] {textTransfer });
    target.addDropListener(new MyDropTargetListener());

对于MyDropTargetListener

class MyDropTargetListener implements DropTargetListener{
    //dragEnter事件在drag and drop动作开始,并且鼠标进入了target widget的范围内时被调用。
    public void dragEnter(DropTargetEvent event){
        //在dragEnter中应用可以定义default operation.如果一个drop target在创建的时候被指定为
        //带有DND.DROP_DEFAULT,那么在拖动的过程中如果没有辅助按键被按下,则drop target就是DND.DROP_DEFAULT的。
        //应用可以通过改变event.detail来指定default operation。如果应用没有具体指定DND.DROP_DEFAULT的操作,
        //平台会默认将DND.DROP_DEFAULT设置为DND.DROP_MOVE。
        //另外DND.DROP_DEFAULT的值也可以在dragOperationChanged中设置。
       
        if(event.detail==DND.DROP_DEFAULT){
          //给event.detail赋的值必须是event.operations中的一个,event.operations中
          //的操作都是DragSource所支持的.
          if((event.operations&DND.DROP_COPY)!=0){
            event.detail=DND.DROP_COPY;
          }else{
            event.detail=DND.DROP_NONE;
          }
        }
       
        //drop target可以选择性的按照传输类型来处理.dragEnter event有两个属性
        //event.currentType 是应用设置的默认类型,以TransferData对象形式表现,
        //event.dataTypes 是drag source支持的所有类型的列表,以TransferData数组形式表现,
        //我们可以将event.currentType设置成event.dataTypes中的任意一个。
        //这些属性也可以在dragOver, dragOperationChanged以及dropAccept事件中设置。

        for(int i=0;i<event.dataTypes.length;i++){
          if(textTransfer.isSupportedType(event.dataTypes )){
            event.currentDataType=event.dataTypes ;
            //只允许COPY
            if(event.detail!=DND.DROP_COPY){
                event.detail=DND.DROP_NONE;
            }
            break;
          }
        }
    }

    //dragOver event在光标进入drop target widget时会被重复不停的调用.
    //如果光标是静止的,dragOver event依然会有规则的按一定时间间隔被调用.
    //这个方法一般在drop target是table或tree时用得比较多,可以根据不同的item而改变操作.
    public void dragOver(DropTargetEvent event){
        //event.feedback设置当widget处于光标下时应该给用户一个什么样的feedback.
        //dragOver event.feedback 值描述
        //DND.FEEDBACK_SELECT 使光标下的item被选中,限于table and trees.
        //DND.FEEDBACK_SCROLL 使widget可以滚动以便于用户可以drop在当前看不见的item上,限于table and trees.
        //DND.FEEDBACK_EXPAND 使当前光标下的item展开以便于用户在sub item上drop,限于trees.
        //DND.FEEDBACK_INSERT_BEFORE 在item处于光标下之前显示一个插入标记,限于tables and trees.
        //DND.FEEDBACK_INSERT_AFTER   在item处于光标下之后显示一个插入标记,限于tables and trees.
        //DND.FEEDBACK_NONE   没有任何效果.
        event.feedback=DND.FEEDBACK_SELECT|DND.FEEDBACK_SCROLL;
        if(textTransfer.isSupportedType(event.currentDataType)){
          String t=(String)(textTransfer.nativeToJava(event.currentDataType));
          if(t!=null){
            System.out.println(t);
          }
        }
    }

    //当用户按下或放开辅助按键时,例如Ctrl, Shift, Command, Option。则dragOperationChanged事件发生。
    //辅助按键可以改变即将进行的操作。例如:
    //Ctrl key is down, a copy is requested,
    //Ctrl and Shift keys are both down, a link is requested
    //Shift key is down, a move is requested
    //When no modifier keys are pressed, the default operation is requested.
    public void dragOperationChanged(DropTargetEvent event){
        if(event.detail==DND.DROP_DEFAULT){
          event.detail=DND.DROP_COPY;
        }else{
          event.detail=DND.DROP_NONE;
        }

        // allow text to be moved but files should only be copied
        if(fileTransfer.isSupportedType(event.currentDataType)){
          if(event.detail!=DND.DROP_COPY){
            event.detail=DND.DROP_NONE;
          }
        }
    }

    //当光标离开drop target widget时,dragLeave事件发生. 如果你在dragEnter中分配了一些资源,
    //就应该在dragLeave中释放.dragLeave事件在用户通过Escape键取消Drag and Drop操作时也会发生
    //刚好在drop操作被执行之前.
    public void dragLeave(DropTargetEvent event){
    }

    //dropAccept事件为应用提供了最后一次定义数据类型的机会,定义的数据类型将被返回到drop事件.
    //这些是通过向event.currentDataType赋event.dataTypes中的值来实现的.
    public void dropAccept(DropTargetEvent event){
    }

    //如果在之前的事件中得到了有效的操作和currentDataType,那么当用户在drop target上松开鼠标时,drop事件会发生。
    //event.data属性包含了请求到的数据,event.type包含了Transfer的类型.
    //data是event.currentDataType中定义的类型.
    public void drop(DropTargetEvent event){
        if(textTransfer.isSupportedType(event.currentDataType)){
          String text=(String)event.data;
          TableItem item=new TableItem(dropTable,SWT.NONE);
          item.setText(text);
        }
        if(fileTransfer.isSupportedType(event.currentDataType)){
          String[] files=(String[])event.data;
          for(int i=0;i<files.length;i++){
            TableItem item=new TableItem(dropTable,SWT.NONE);
            item.setText(files );
          }
        }
    }
  } 

 

 package      net.advanced.eclipse.sample.views;

import  org.eclipse.swt.SWT;
import  org.eclipse.swt.dnd.DND;
import  org.eclipse.swt.dnd.DragSource;
import  org.eclipse.swt.dnd.DragSourceEvent;
import  org.eclipse.swt.dnd.DragSourceListener;
import  org.eclipse.swt.dnd.DropTarget;
import  org.eclipse.swt.dnd.DropTargetEvent;
import  org.eclipse.swt.dnd.DropTargetListener;
import  org.eclipse.swt.dnd.FileTransfer;
import  org.eclipse.swt.dnd.TextTransfer;
import  org.eclipse.swt.dnd.Transfer;
import  org.eclipse.swt.widgets.Composite;
import  org.eclipse.swt.widgets.Table;
import  org.eclipse.swt.widgets.TableColumn;
import  org.eclipse.swt.widgets.TableItem;
import  org.eclipse.swt.widgets.Tree;
import  org.eclipse.swt.widgets.TreeItem;
import  org.eclipse.ui.part.ViewPart;

/**
 * @Title: DragAndDrop.java
 * @Copyright:
 * @Company:
 * @Created on 2005-12-02 14:34:40
 *  @author  孙其弘
 *  @version  $Revision: 1.11 $
 *  @since  1.0
  */

public   class  DragAndDrop  extends  ViewPart{
     private  Tree dragTree;
     private  Table dropTable;
     private  TextTransfer textTransfer;
     private  FileTransfer fileTransfer;

     public   void  createPartControl(Composite parent){
         /*  Transfer是一个可以提供数据在Java representation与platform specific representation
         * 之间交互的抽象类.下面是几个format:
         * TextTransfer String "hello world" 
         * RTFTransfer String "{\\rtf1\\b\\i hello world}" 
         * FileTransfer String[] new String[] {file1.getAbsolutePath(), file2.getAbsolutePath()} 
         * 
         * TransferData包含了很多特定于平台的公用的属性,应用不应该直接去访问这些属性。
         * 如果真的有必要去访问这些属性,那么我们可以通过扩展Transfer类来完成对特定平台的额外操作。
          */
        textTransfer = TextTransfer.getInstance();
        fileTransfer = FileTransfer.getInstance();

        dragTree = new  Tree(parent,SWT.FULL_SELECTION | SWT.SINGLE);
         for ( int  i = 0 ;i < 10 ;i ++ ){
            TreeItem item = new  TreeItem(dragTree,SWT.NONE);
            item.setText( " treeitem " + i);
             for ( int  i2 = 0 ;i2 < 5 ;i2 ++ ){
                TreeItem subitem = new  TreeItem(item,SWT.NONE);
                subitem.setText( " subtreeitem " + i2);
            }
        }

         // 将dragLabel指定为DragSource(一个widget只能帮定在一个DragSource),
         // 并允许数据可以从DragSource被MOVE或COPY
        DragSource source = new  DragSource(dragTree,DND.DROP_MOVE | DND.DROP_COPY);
        source.setTransfer( new  Transfer[] { textTransfer }); //  指定允许的传输类型
        source.addDragListener( new  MyDragSourceListener());

        dropTable = new  Table(parent,SWT.BORDER | SWT.FULL_SELECTION | SWT.SINGLE);
        fillTable();

         //  将dropTable指定为Drop Target,
        DropTarget target = new  DropTarget(dropTable,DND.DROP_MOVE | DND.DROP_COPY | DND.DROP_DEFAULT);
        target.setTransfer( new  Transfer[] {textTransfer });
        target.addDropListener( new  MyDropTargetListener());
    }

     class  MyDragSourceListener  implements  DragSourceListener{
         //  指定拖动开始的执行策略。
         public   void  dragStart(DragSourceEvent event){
             if (((DragSource)event.widget).getControl()  instanceof  Tree){
                TreeItem selection  =  DragAndDrop. this .dragTree.getSelection()[ 0 ];
                 if (selection.getText().length() == 0 ){
                    event.doit = false ;
                } 
            }
        }

         // dragSetData方法在dragStart通过之后才被调用。这个方法可能会因为同一种传输类型多次set或
         // 不同的多种传输类型的set而被多次调用,象windows等有些平台中,dropTarget可以在鼠标移动的
         // 过程中请求数据,但是在Motif等平台中,只可以在drop操作完成之后才可以请求数据,所以在这个方
         // 法中不要假设drag and drop操作已经完成.在这个方法中是无法知道data将被drop到哪里.
         // set的Data也要符合指定的Transfer的format类型。
         public   void  dragSetData(DragSourceEvent event){
             if (TextTransfer.getInstance().isSupportedType(event.dataType)){
                 if (((DragSource)event.widget).getControl()  instanceof  Tree){
                    TreeItem selection  =  DragAndDrop. this .dragTree.getSelection()[ 0 ];
                    event.data = selection.getText();
                }
            }
        }

         //  根据事先指定好的操作类型来处理操作结果
         public   void  dragFinished(DragSourceEvent event){
             if (event.detail == DND.DROP_MOVE){
                 if (((DragSource)event.widget).getControl()  instanceof  Tree){
                    TreeItem selection  =  DragAndDrop. this .dragTree.getSelection()[ 0 ];
                    selection.removeAll();
                }
            }
        }
    }

     class  MyDropTargetListener  implements  DropTargetListener{
         // dragEnter事件在drag and drop动作开始,并且鼠标进入了target widget的范围内时被调用。
         public   void  dragEnter(DropTargetEvent event){
             // 在dragEnter中应用可以定义default operation.如果一个drop target在创建的时候被指定为
             // 带有DND.DROP_DEFAULT,那么在拖动的过程中如果没有辅助按键被按下,则drop target就是DND.DROP_DEFAULT的。
             // 应用可以通过改变event.detail来指定default operation。如果应用没有具体指定DND.DROP_DEFAULT的操作,
             // 平台会默认将DND.DROP_DEFAULT设置为DND.DROP_MOVE。
             // 另外DND.DROP_DEFAULT的值也可以在dragOperationChanged中设置。
            
             if (event.detail == DND.DROP_DEFAULT){
                 // 给event.detail赋的值必须是event.operations中的一个,event.operations中
                 // 的操作都是DragSource所支持的. 
                 if ((event.operations & DND.DROP_COPY) != 0 ){
                    event.detail = DND.DROP_COPY;
                } else {
                    event.detail = DND.DROP_NONE;
                }
            }
            
             // drop target可以选择性的按照传输类型来处理.dragEnter event有两个属性
             // event.currentType 是应用设置的默认类型,以TransferData对象形式表现,
             // event.dataTypes 是drag source支持的所有类型的列表,以TransferData数组形式表现, 
             // 我们可以将event.currentType设置成event.dataTypes中的任意一个。
             // 这些属性也可以在dragOver, dragOperationChanged以及dropAccept事件中设置。

             for ( int  i = 0 ;i < event.dataTypes.length;i ++ ){
                 if (textTransfer.isSupportedType(event.dataTypes[i])){
                    event.currentDataType = event.dataTypes[i];
                     // 只允许COPY
                     if (event.detail != DND.DROP_COPY){
                        event.detail = DND.DROP_NONE;
                    }
                     break ;
                }
            }
        }

         // dragOver event在光标进入drop target widget时会被重复不停的调用. 
         // 如果光标是静止的,dragOver event依然会有规则的按一定时间间隔被调用. 
         // 这个方法一般在drop target是table或tree时用得比较多,可以根据不同的item而改变操作.
         public   void  dragOver(DropTargetEvent event){
             // event.feedback设置当widget处于光标下时应该给用户一个什么样的feedback. 
             // dragOver event.feedback 值描述 
             // DND.FEEDBACK_SELECT  使光标下的item被选中,限于table and trees. 
             // DND.FEEDBACK_SCROLL  使widget可以滚动以便于用户可以drop在当前看不见的item上,限于table and trees.  
             // DND.FEEDBACK_EXPAND  使当前光标下的item展开以便于用户在sub item上drop,限于trees. 
             // DND.FEEDBACK_INSERT_BEFORE  在item处于光标下之前显示一个插入标记,限于tables and trees. 
             // DND.FEEDBACK_INSERT_AFTER   在item处于光标下之后显示一个插入标记,限于tables and trees.  
             // DND.FEEDBACK_NONE    没有任何效果. 
            event.feedback = DND.FEEDBACK_SELECT | DND.FEEDBACK_SCROLL;
             if (textTransfer.isSupportedType(event.currentDataType)){
                String t = (String)(textTransfer.nativeToJava(event.currentDataType));
                 if (t != null ){
                    System.out.println(t);
                }
            }
        }

         // 当用户按下或放开辅助按键时,例如Ctrl, Shift, Command, Option。则dragOperationChanged事件发生。
         // 辅助按键可以改变即将进行的操作。例如:
         // Ctrl key is down, a copy is requested,
         // Ctrl and Shift keys are both down, a link is requested
         // Shift key is down, a move is requested
         // When no modifier keys are pressed, the default operation is requested. 
         public   void  dragOperationChanged(DropTargetEvent event){
             if (event.detail == DND.DROP_DEFAULT){
                event.detail = DND.DROP_COPY;
            } else {
                event.detail = DND.DROP_NONE;
            }

             //  allow text to be moved but files should only be copied
             if (fileTransfer.isSupportedType(event.currentDataType)){
                 if (event.detail != DND.DROP_COPY){
                    event.detail = DND.DROP_NONE;
                }
            }
        }

         // 当光标离开drop target widget时,dragLeave事件发生. 如果你在dragEnter中分配了一些资源,
         // 就应该在dragLeave中释放.dragLeave事件在用户通过Escape键取消Drag and Drop操作时也会发生
         // 刚好在drop操作被执行之前.
         public   void  dragLeave(DropTargetEvent event){
        }

         // dropAccept事件为应用提供了最后一次定义数据类型的机会,定义的数据类型将被返回到drop事件. 
         // 这些是通过向event.currentDataType赋event.dataTypes中的值来实现的.
         public   void  dropAccept(DropTargetEvent event){
        }

         // 如果在之前的事件中得到了有效的操作和currentDataType,那么当用户在drop target上松开鼠标时,drop事件会发生。
         // event.data属性包含了请求到的数据,event.type包含了Transfer的类型. 
         // data是event.currentDataType中定义的类型.
         public   void  drop(DropTargetEvent event){
             if (textTransfer.isSupportedType(event.currentDataType)){
                String text = (String)event.data;
                TableItem item = new  TableItem(dropTable,SWT.NONE);
                item.setText(text);
            }
             if (fileTransfer.isSupportedType(event.currentDataType)){
                String[] files = (String[])event.data;
                 for ( int  i = 0 ;i < files.length;i ++ ){
                    TableItem item = new  TableItem(dropTable,SWT.NONE);
                    item.setText(files[i]);
                }
            }
        }
    }
    
     public   void  fillTable(){
        dropTable.setHeaderVisible( true );
        dropTable.setLinesVisible( true );
        
        TableColumn partName  = new  TableColumn(dropTable,SWT.LEFT);
        partName.setResizable( true );
        partName.setText( " NAME " );
        partName.setWidth( 250 );
        
        TableColumn employeeName = new  TableColumn(dropTable,SWT.LEFT);
        employeeName.setResizable( true );
        employeeName.setText( " SIZE " );
        employeeName.setWidth( 120 );
        
         for ( int  i = 0 ;i < 10 ;i ++ ){
            TableItem item = new  TableItem(dropTable,SWT.NONE);
            item.setText( new  String[]{ " tableitem " + i, 100 + i + "" });
        }
    }
    
     public   void  setFocus(){

    }
}
作为插件运行还需要创建plugin.xml文件,用PDE创建plugin project with view可得。

<?xml version="1.0" encoding="UTF-8"?>
<?eclipse version="3.0"?>
<plugin>

<extension
point="org.eclipse.ui.views">
<category
name="DND Category"
id="com.blogspot.weidagang2046.dnd">
</category>
<view
name="DND View"
icon="icons/sample.gif"
category="com.blogspot.weidagang2046.dnd"
class="com.blogspot.weidagang2046.dnd.views.DNDView"
id="com.blogspot.weidagang2046.dnd.views.DNDView">
</view>
</extension>
<extension
point="org.eclipse.ui.perspectiveExtensions">
<perspectiveExtension
targetID="org.eclipse.ui.resourcePerspective">
<view
ratio="0.5"
relative="org.eclipse.ui.views.TaskList"
relationship="right"
id="com.blogspot.weidagang2046.dnd.views.DNDView">
</view>
</perspectiveExtension>
</extension>

</plugin> 
分享到:
评论
1 楼 liubin0908 2011-07-12  
这个必须顶啊!

相关推荐

    GWT 拖拽做象棋 (1). dnd 学习.

    dnd 学习”表明这是一个关于使用Google Web Toolkit(GWT)实现拖放(Drag and Drop, DnD)功能的教程,特别是针对构建一个象棋游戏的场景。在GWT中,DnD功能允许用户通过鼠标操作在界面上移动元素,模拟现实世界中...

    React-dnd js库学习

    React-DND是一个流行的JavaScript库,专门用于在Web应用中实现拖放功能。它与React库无缝集成,使得在React组件中实现拖放操作变得简单易行。本教程将深入探讨React-DND的基本概念、安装、配置以及如何创建一个简单...

    学习使用ReactDnD实现嵌套列表的拖拽排序

    ReactDnD(React Drag and Drop)是一个流行的库,它为React组件提供了简单的拖放API。在这个主题中,我们将深入探讨如何利用ReactDnD来实现嵌套列表的拖拽排序。 首先,我们需要安装ReactDnD库。通过npm或yarn可以...

    todo-dnd:使用react-beautiful-dnd学习如何拖放n

    该项目是通过引导的。 您将在下面找到一些有关如何执行常见任务的信息。 您可以在找到本指南的最新版本。 目录 自动格式化代码 更改页面&lt;title&gt; 安装依赖项 导入组件 代码分割 添加样式表 ...met

    dnd_demo.zip

    在IT领域,前端开发中的用户交互体验至关重要,而“dnd_demo.zip”是一个演示如何使用EasyUI框架实现表格数据拖拽功能的...通过学习和理解这个demo,开发者可以提升自己的前端技能,为用户创造更加直观和易用的界面。

    react-dnd-example:如何实现react-beautiful-dnd的示例

    总的来说,`react-dnd-example`项目为我们提供了一个很好的起点,通过它我们可以学习如何在React应用中集成`react-beautiful-dnd`库,创建交互式的拖放界面。结合实际项目需求,你可以进一步完善这个基础示例,实现...

    DnD管理器:不同的DnD工具

    这个项目很可能包含了源代码、示例或教程,帮助开发者学习如何自定义和扩展Notebook的DnD功能。通过分析这些资源,我们可以学习到如何与Notebook的API交互,创建自己的DnD管理器,或者改进现有的拖放行为。 总的来...

    react-dnd-in-chinese:react-dnd 中文文档

    React DND(Drag and Drop)中文文档主要涵盖了在React应用中实现拖放功能的相关知识点。React DND是一个流行的JavaScript库,它使得在React...通过学习和实践,开发者能够创建出交互性更强、用户体验更佳的应用界面。

    dnd-datapack:将dnd咒语添加到我的世界的数据包

    《DND Datapack:将DND咒语带入我的世界》 在探索与创造的无限可能中,《我的世界》(Minecraft)以其高度的自由度吸引了无数玩家。而DND(Dungeons & Dragons,龙与地下城)作为一款历史悠久的角色扮演游戏,其...

    用于记录DND5e相关数据网页文档。该项目是作为Mirai-rulateday-dice的Dnd5e导航文档项目(毕设&课设&

    用于记录DND5e相关数据网页文档。该项目是作为Mirai-rulateday-dice的Dnd5e导航文档项目,主要用于放置一些数据库的信息方便用户快速查看使用。目前放置的信息只包含:装备武器信息、魔法物品信息、怪物信息等。.zip...

    DND3E-开源

    他们可以通过研究代码,学习如何实现复杂的规则计算,如何设计用户友好的界面,以及如何处理多人在线协作等挑战。 在压缩包中的“dnd3e-0.0.8”文件,很可能是项目的某个版本发布,包含了程序的源代码、文档、...

    桌面:DnD 5e角色生成器...以及其他东西。 最终

    《桌面:DnD 5e角色生成器及其他——深入探讨 TypeScript 在桌面游戏开发中的应用》 在桌面游戏领域,尤其是角色扮演游戏(Role-...对于那些想要涉足游戏开发的程序员,学习和掌握TypeScript无疑是一项重要的技能。

    dnd-character-sheet:在DND上适合您角色的网络应用

    Vue.js是目前非常流行的轻量级JavaScript框架,以其简洁的API、强大的性能和易于学习的特性著称。Vue允许开发者以组件化的方式构建应用,这非常适合像DND角色表这样需要组织各种信息块的应用。通过Vue,开发者可以...

    dnd工具

    **DND工具详解** 在IT行业中,"DND"通常代表"Drag and Drop",这是一种用户界面交互技术,允许用户通过鼠标或其他输入设备将项目从一处拖动...通过学习和应用这些技术,开发者能够创建出更加直观、易用的Web应用程序。

    react-dnd-experiment:遵循React-DND教程

    在这个实验项目中,你将学习如何在React应用中集成React-DND,从而提升用户体验。 首先,React-DND的核心概念包括`DragSource`和`DropTarget`。`DragSource`是你可以拖动的元素,而`DropTarget`是接收被拖动元素的...

    React-DnD-Components-Template:具有React.js和react-beautiful-dnd lib的DnD组件模板

    通过学习和使用React-DnD-Components-Template,开发者可以深入了解React组件化开发,掌握react-beautiful-dnd库的用法,以及如何在实际项目中实现高效的拖放功能。这个模板对于想要提升React应用交互体验的开发者来...

    dnd-round-tracker

    综上所述,"dnd-round-tracker"项目是一个使用React和JavaScript技术开发的DND游戏回合追踪工具,开发者通过它进行学习和实践。项目可能还涉及到其他技术,如CSS预处理器(如Sass或Less)用于样式管理,或者使用...

    react-dnd-es5-examples:react-dnd-es5-示例

    React DnD(Drag and Drop)是React.js生态系统中的一个库,它允许开发者轻松地创建可拖放的用户界面。这个“react-dnd-es5-...通过学习这些示例,你可以深入理解React DnD的工作原理,并将其应用于自己的项目中。

    DND_Campaign_Site

    【DND_Campaign_Site】是一个与桌面角色扮演游戏(Dungeons & Dragons,简称D&D)相关的网站项目。...通过学习和分析这个项目,开发者可以提升自己的综合技能,同时为D&D爱好者提供一个富有创意和实用性的在线平台。

    dnd-kit-in-reagent:在试剂中使用dnd-kit的测试场

    通过这个项目,开发者可以学习到如何在ClojureScript和Reagent中导入和使用外部库,以及如何利用dnd-kit创建复杂的交互式拖放界面。同时,这也有助于加深对Clojure、ClojureScript和React生态系统中工具链的理解。

Global site tag (gtag.js) - Google Analytics