标签: drag-and-drop

我在将文件拖放到 richTextBox 上时遇到问题，每次将文本文件拖到其上时，它都会变成文本文件的图片，其名称位于其下方。双击该文件，它会使用系统默认应用程序（即用于文本文件的记事本等）打开。基本上，当我希望它读取文件中的文本时，它会在 richTextBox 中创建快捷方式。

根据此代码，文件中的文本应提取到 richTextBox1 中

    class DragDropRichTextBox : RichTextBox
    {
    public DragDropRichTextBox()
    {
        this.AllowDrop = true;
        this.DragDrop += new DragEventHandler(DragDropRichTextBox_DragDrop);
    }

    private void DragDropRichTextBox_DragDrop(object sender, DragEventArgs e)
    {
        string[] fileNames = e.Data.GetData(DataFormats.FileDrop) as string[];

        if (fileNames != null)
        {
            foreach (string name in fileNames)
            {
                try
                {
                    this.AppendText(File.ReadAllText(name) + "\n");
                }
                catch (Exception ex)
                {
                    MessageBox.Show(ex.Message);
                }
            }
        }
    }

关于如何实现这项工作有什么想法吗？

我尝试熟悉java中的拖放，但我发现的所有教程都是......（让我生气）

我想要的只是从 JList（包含在名为“UserPanel”的自制 JPanel 中）拖动“PublicUserLabel”并将其放入从 JTabbedPanel 继承的自制类中。拖动对象本身而不是其字符串表示非常重要！

这就是我到目前为止所拥有的：PublicUserLabel

public class PublicUserLabel extends JLabel implements DragSourceListener, DragGestureListener, Transferable
    {
        private DragSource ds;
        private PublicUser user;

        public PublicUserLabel(PublicUser user)
        {
            super(user.getName());
            this.user = user;
            ds = new DragSource();
            ds.createDefaultDragGestureRecognizer(this, DnDConstants.ACTION_COPY_OR_MOVE, this);
        }

        @Override
        public void dragGestureRecognized(DragGestureEvent e)
        {
            ds.startDrag(e, DragSource.DefaultCopyDrop, this, this);
        }

        @Override
        public Object getTransferData(DataFlavor flavor) throws UnsupportedFlavorException, IOException
        {
            if (flavor.equals(PublicUserFlavor.publicUserFlavor))
            {
                return this;//TODO ?
            }
            throw new UnsupportedFlavorException(flavor);
        }

        @Override
        public DataFlavor[] getTransferDataFlavors()
        {
            DataFlavor[] df = new …

我正在使用Nestable.js jQuery 插件创建一个可拖放的项目列表，在后端用于管理菜单。它不再维护，但我找不到一个干净简单的替代方案，所以我告诉自己我应该尝试一下。

列表如下所示：

<div class="dd" id="nestable">
    <ol class="dd-list">
        <li class="dd-item" data-id="1">
            <div class="dd-handle">Item 1</div>
        </li>
        <li class="dd-item" data-id="2">
            <div class="dd-handle">Item 2</div>
            <ol class="dd-list">
                <li class="dd-item" data-id="3"><div class="dd-handle">Item 3</div></li>
                <li class="dd-item" data-id="4"><div class="dd-handle">Item 4</div></li>
                <li class="dd-item" data-id="5">
                    <div class="dd-handle">Item 5</div>
                    <ol class="dd-list">
                        <li class="dd-item" data-id="6"><div class="dd-handle">Item 6</div></li>
                        <li class="dd-item" data-id="7"><div class="dd-handle">Item 7</div></li>
                        <li class="dd-item" data-id="8"><div class="dd-handle">Item 8</div></li>
                    </ol>
                </li>
                <li class="dd-item" data-id="9"><div class="dd-handle">Item 9</div></li>
                <li class="dd-item" data-id="10"><div class="dd-handle">Item 10</div></li>
            </ol>
        </li>
        <li class="dd-item" data-id="11">
            <div class="dd-handle">Item 11</div>
        </li>
        <li …

如何在 Snap.svg 中实现移动设备的拖放？触摸拖放似乎没有内置到 Snap.svg 拖放功能中。

假设我有一个 QML Row，其中有一些子对象（不一定是同一类型）。我希望能够随意重新排序。额外的好处是，能够为用户实现拖放行为。这是一个代码示例，其中Row包含我想重新排序的不同组件：

import QtQuick 2.5
import QtQuick.Controls 1.4


ApplicationWindow {
    visible: true
    width: 300
    height: 300

    Component {
        id: rect
        Rectangle {
            color: "blue"
        }
    }

    Component {
        id: rectWithText

        Rectangle {
            property alias text: txt.text
            color: "red"
            Text {
                id: txt
            }
        }
    }

    Row {
        id: r
        Component.onCompleted: {
            rect.createObject(r,{"width": 60,"height":40})
            rectWithText.createObject(r,{"width": 100,"height":40,text:"foo"})
            rect.createObject(r,{"width": 40,"height":40})
        }
    }
}

在QtWidgets中，有一些函数layout->removeWidget(widget)，例如，layout->insertWidget(index,widget)等等，但在QML中似乎缺少它们。

我发现了一些使用ListView/GridView和模型/委托方法的示例，但它们通常无法处理不同的组件，因此它们作为Row.

有没有办法在 QML 中做到这一点，还是我运气不好？

我在 Flutter 中使用 Draggable 小部件，我想将我的元素移动到父小部件内的任何位置。

我尝试了 dragtarget 小部件，但无法将其设置为我的父小部件。我还尝试了onDraggableCanceledDraggable 小部件的方法来获取偏移量，并将其应用于元素的新偏移量，但它给了我从设备的偏移量，而不是从父容器的偏移量。

那么，这样做的正确方法是什么？

我在 React 应用程序中创建了一个 SVG 存储库，您可以从中将 SVG 拉到“画布”上。但是，我需要有 SVG 的“无限”副本，这样当你拖出一个时，它的另一个副本也可以无限使用。关于如何做到这一点的任何想法？

我查看了各种拖放包（react-dnd、react-beautiful-dnd），但似乎没有一个具有类似的功能。我唯一的想法是克隆图像 onClick；但这似乎有点hacky。

我正在开发一个类似于 Trello 的 Angular 应用程序，我需要为客户实现拖放功能，以便能够上传附件。

问题是已经有一个从另一个组件使用的“附加”功能（没有拖放），我需要以与其他功能相同的方式实现拖放。（我需要采用这个用于拖放的“添加附件”功能）

这是一张照片解释：https : //ibb.co/d5WcJfQ

我尝试观看 youtube 视频和 google-ing，但我很难按照要求正确实施它。任何建议将不胜感激。

// HTML OF ATTACH COMPONENT
<span>
 <a class="quiet-button js-attach">
      <label class="custom-file-upload">
             <input (change)="onFileChange($event)" type="file"/>
              Add Attachment...
         </label>
     </a>

//TS FUNCTION 'onFileChange" That I need to adopt for drag-and-drop.`

onFileChange(event){

let files = event.target.files;
if (files.length > 0) {
  let formData: FormData = new FormData();
  for (let file of files) {
    formData.append('fileName', file, file.name);
  }
  let file = files[0];
  let attachmentData = <AttachmentInsert>{
    FileName : file.name,
    Path …

不幸的是，我无法在常见问题中找到解决方案。

这是代码的链接https://stackblitz.com/edit/angular-ygwaxs

我有这样的场景：从服务器我得到了一个 json 树结构（在示例中，组件内部直接有一个示例）

有空节点，但每个人都声明了他们的孩子数组。

我尝试在 html 级别使用 ng-template 和 ng-container 来管理组件内部的这种 rappresentation，这很有效。

问题是我需要使用拖放来对节点进行排序。

具体而言，每个部分都可以是子项或父项，因此每个部分都可以拖放。

我尝试使用 Angular Material 8 CDK Drag & Drop ( https://material.angular.io/cdk/drag-drop/overview ) 和使用 Drag&Drop API 的 vanilla Javascript ( https://developer .mozilla.org/ …/…/API/HTML_Drag_and_Drop_API) 但是，如果在第一种情况下嵌套拖放的事实对解决方案没有帮助，在第二种情况下，我有测试，但在 Angular 内部组件，似乎不接受 drop (drop) 的事件绑定；当我尝试在标签 dropzone 内拖动一个部分时，光标会发生变化。

任何人都可以帮助我吗？

我有一个<div>元素具有position: absolute与容器内position: relative。它的left和top属性绑定到component.ts. 我的目的是使用 cdk 拖放移动容器内的 div。

在dragEnded我检索需要更新坐标 X 和 Y 的数据时，问题就开始了......

<div
    class="character"
    [style.left.px]="x"
    [style.top.px]="y"
    cdkDrag
    cdkDragBoundary=".grid-container"
    (cdkDragEnded)="dragEnded($event, c)"
  ></div>

我注意到 cdk 拖放应用了一个属性transform: translate3d(x,y,z)来移动我的 div，从它的原始位置开始。所以，如果我希望我的 div left 和 top 绑定到我的后端属性，我可以在 dragEnd 事件上计算新坐标，应用它们，并重置由 cdk 制作的变换属性。一切正常。

但是下次我拖动元素时，材质不会从我的 div 的新绝对位置开始应用变换，而是从原始位置开始。

我认为一种解决方案可能是检查是否CdkDragEnd event包含与转换起点相关的数据并重置它，但我没有找到任何东西。

知道这个属性是否隐藏在 CdkDragEvent 中的某个地方吗？或者对这个问题有其他解决方案吗？

谢谢你们