drag-and-drop 相关问题

将文件拖放到 WPF 中

我需要将图像文件拖放到我的 WPF 应用程序中。目前，当我放入文件时会触发一个事件，但我不知道下一步该怎么做。我如何获取图像？发送者对象是

c# .net wpf image drag-and-drop

回答 4 投票 0

拖放自定义对象

我有2个控件，一种形式：列表和树（具体类型名称不相关）。在列表控件中，我执行 DoDragDrop 方法。作为第一个参数，我传递了一个与数据绑定的对象...

c# winforms drag-and-drop

回答 2 投票 0

是否有一种简单的方法可以调整 Framer Motion 中可拖动元素的动量/惯性？

抱歉，如果这是一个愚蠢的问题 - 感觉它应该很简单，但我一直在搜索 Framer Motion 文档，谷歌搜索，在这里寻找以前的 Q/A，但都无济于事。我有一个可拖动的

javascript reactjs drag-and-drop framer-motion

回答 1 投票 0

Blazor 拖放如何获取目标对象？

我似乎无法找出获取目标对象的正确方法。这是应该具有拖放功能的前端代码： ... 我似乎无法找出获取目标对象的正确方法。这是应该具有拖放功能的代码前端代码： <div class="pos-top"> <div id="imgGrid" class="grid bg-white" style="grid-template-columns:repeat(@columnCount, @(unitWidth)); grid-auto-flow:dense;"> @foreach (var b in blocks) { @if ((b.Placement[_pageType].Visible == true || showHiddenBlocks == true) && b.Zones != null && b.Zones.Contains(zone)) { var id = b.Id; <div class="[email protected] [email protected] relative border border-black box-border @(b.isDragOver?"dropped":"")" style=" order:@b.Placement[_pageType].Order;" @ondblclick="(() => ChangeBlockProperties(b))" draggable="true" data-block-id="@b.Id" id="@id" @ondrop="@((e) => ondropOver(b, blocks.ToList()))" ondragover="event.preventDefault();" @ondragstart="@((e) => ondragstart(e, b, blocks.ToList()))" @ondragenter="@(() => ondragenter(b))" @ondragleave="@(() => { b.isDragOver = false; })" @ondragend="@(() => ondragend(b, blocks.ToList()))"> <div class="blockNumberInfo absolute rounded-full bg-red-700 flex justify-center items-center border-2 border-black" style="width:40px;height:20px"> @b.LocalIndex / @b.Placement[_pageType].Order </div> </div> } } </div> } } </div> 这是我移动方块的代码： public async void ondropOver(FlyerBlock item, List<FlyerBlock> flyerBlocks) { DragEnter = null; if (DraggedItem == null) return; if (DraggedItem == item) return; DraggedItem.Placement[_pageType].Order = item.Placement[_pageType].Order; await BlockplacementEditService.SaveBlockChangesAsync(flyerBlocks, DraggedItem, DraggedItem.Placement[_pageType].Order, _pageType, zone); DraggedItem = null; item.isDragOver = false; //StateHasChanged(); } public void ondragstart(DragEventArgs e, FlyerBlock item, List<FlyerBlock> flyerBlocks) { e.DataTransfer.EffectAllowed = "move"; DraggedItem = item; DraggedItemPosition = item.Placement[_pageType].Order; } public void ondragenter(FlyerBlock item) { item.isDragOver = true; DragEnter = item; } public async void ondragend(FlyerBlock item, List<FlyerBlock> flyerBlocks) { item.isDragOver = false; if (DraggedItem == null) return; DragEnter = null; // item.isDragOver = true; } 我遇到的问题是我不知道如何将目标块传递到我的下拉事件中。我尝试使用 DragEventArgs 但这不起作用我也尝试使用 jsruntime 但我只能提取拖动的块。我希望能够获取目标块，以便我可以正确更新订单。任何帮助将不胜感激！这是我修改后的拖放服务。我将 Target 属性添加到 DragAndDropService.cs 类中，以便在放置时保持目标对象。原始源代码可以在这里找到：https://www.radzen.com/blog/blazor-drag-and-drop/ using System; namespace MyToolSource.Data { public class DragAndDropService { public object Data { get; set; } public object Target { get; set; } public string Zone { get; set; } public void StartDrag(object data, object target, string zone) { this.Data = data; this.Target = target; this.Zone = zone; } public bool Accepts(string zone) { return this.Zone == zone; } } } 这是 Draggable.cs 类。我添加了 Target 属性来保存目标对象。尽管此时您没有目标对象，但它必须具有稍后在 html 中使用 DropTarget 时将填充的属性。 @typeparam T @using MyToolSource.Data @inject DragAndDropService DragAndDropService <div draggable="true" @ondragstart="@OnDragStart"> @ChildContent </div> @code { [Parameter] public RenderFragment ChildContent { get; set; } [Parameter] public string Zone { get; set; } [Parameter] public T Target { get; set; } [Parameter] public T Data { get; set; } void OnDragStart() { // Notify the DragAndDropService what the current Data and Zone are. DragAndDropService.StartDrag(Data, Target, Zone); } } 这是 DropTrget.cs 类。我添加了 Target 属性，以便在源被删除后保存目标对象。 @using MyToolSource.Data @inject DragAndDropService DragAndDropService @typeparam T <div ondragover="event.preventDefault()" @ondrop="@OnDrop"> @ChildContent </div> @code { [Parameter] public RenderFragment? ChildContent { get; set; } [Parameter] public string Zone { get; set; } [Parameter] public T Target { get; set; } [Parameter] public Action<T,T>? Drop { get; set; } void OnDrop() { if (Drop != null && DragAndDropService.Accepts(Zone)) { Drop((T)DragAndDropService.Data, Target) ; } } } 在 HTML 中，将 Target=@customer 添加到 DropTarget 包装器。 <Draggable Data="@customer" > <td class="draggable customer-x"> @customer.FirstName </td> </Draggable> <DropTarget T="vCustomer" Drop="@OnDrop" Target=@customer > <td id="@customer.CustomerId" ></td> </DropTarget> OnDrop 方法。现在您已经有了目标对象，您可以使用它了。 string dropMessage = null; void OnDrop(vCustomer data, object target) { dropMessage = $"Dropped: {data.FirstName} on {((vCustomer)target).FirstName}"; // Important: Invoke StateHasChanged() to update the page StateHasChanged(); } 希望这有帮助！非常好的答案。确实有帮助。我通过调整它以适用于两种不同的类型，进一步概括了它。我通过添加一个额外的类型参数来做到这一点。这允许操作委托接受两种不同类型的参数。对于将一个物体扔到另一个物体上很有用。 @using MyToolSource.Data @inject DragAndDropService DragAndDropService @typeparam T @typeparam U <div ondragover="event.preventDefault()" @ondrop=OnDrop> @ChildContent </div> @code { [Parameter] public RenderFragment ChildContent { get; set; } [Parameter] public string Zone { get; set; } [Parameter] public U Target { get; set; } [Parameter] public Action<T,U> Drop { get; set; } void OnDrop() { if (Drop != null && DragAndDropService.Accepts(Zone)) { Drop((T)DragAndDropService.Data, Target); } } } 然后你可以像这样使用它： <DropTarget T="vCustomer" U="DropZoneObjectType" Drop="@OnDrop" Target=@customer > <td id="@customer.CustomerId" ></td> </DropTarget> 就我而言，我正在向员工拖放一笔交易。希望对其他人有帮助。

drag-and-drop blazor

回答 2 投票 0

.Net MAUI 拖放在 Mac Catalyst 上失败

TL;DR——问题简而言之 Mac Catalyst 上的 .Net MAUI 应用程序的拖放功能似乎无法正常工作，但仅限于 Apple Silicon 设备。我需要修复或解决方法，但到目前为止我还没有成功......

c# .net drag-and-drop maui mac-catalyst

回答 1 投票 0

Jquery UI 放置事件未触发

我正在尝试在应用程序中进行拖放操作。拖动部分工作正常，但放置部分不起作用。由于某种原因，掉落没有被触发/接受。这就是拖累...

jquery jquery-ui drag-and-drop jquery-ui-droppable

回答 1 投票 0

任何人都可以告诉我如何使 q-table 行在 quasar 中可拖动

我尝试过 vuedraggable 包和 quasar-ui-q-draggable-table 包，但它在 q-table quasar 中不起作用。 vuedraggable 包广泛用于 Vue.js 中的拖放操作