UWP 向 Grid 多个单元格添加拖放操作

Question

我想使用 UWP（通用 windows 平台）构建应用程序。对于一个应用程序，我想实现“拖放”功能。我使用了一些名为“AllowDrop 和”DragOver 的属性。但我遇到了网格或某些 xaml 层次结构的问题。

当我将任何文件拖放到应用程序时，它的任何位置，我都希望应用程序接受它。但是有一个未知的问题，应用程序接受只有特定区域的文件。我希望下图能帮助您了解我遇到的问题。 my Intent(left) but It works(right)

下面是源码（一个是xaml源码，后一个是csharp）

<Page 
    x:Class="eeee_textRandomizeUWP.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:eeee_textRandomizeUWP"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid AllowDrop="True" DragOver="Grid_DragOver">
        <Grid.RowDefinitions>
            <RowDefinition Height="6*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="3*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <StackPanel>

            <TextBlock Text="파일을 올려주세요" FontSize="{ThemeResource ListViewHeaderItemThemeFontSize}" Margin="20, 0, 0, 0"/>
            <ListView Name="MainFileList">
                <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
                </ListViewItem>
            </ListView>

        </StackPanel> 
    </Grid>

</Page>

以下来源是 csharp

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// 빈 페이지 항목 템플릿에 대한 설명은 https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x412에 나와 있습니다.

namespace eeee_textRandomizeUWP
{
    /// <summary>
    /// 자체적으로 사용하거나 프레임 내에서 탐색할 수 있는 빈 페이지입니다.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        private void MainFileList_DragOver(object sender, DragEventArgs e)
        {
        }

        private void Grid_DragOver(object sender, DragEventArgs e)
        {
            e.AcceptedOperation = Windows.ApplicationModel.DataTransfer.DataPackageOperation.Copy;

            e.DragUIOverride.Caption = "드래그 앤 드롭을 하여 파일을 등록해주세요";
            e.DragUIOverride.IsCaptionVisible = true;
            e.DragUIOverride.IsContentVisible = true;
            e.DragUIOverride.IsGlyphVisible = true;

        }
    }
}

我认为 Csharp 部分没有问题，但 xaml 部分没有问题。我不知道它是否只适用于一个网格单元格，即使我添加了拖动操作 “主网格”字面意思。我说过拖放只适用于一个网格单元格。但是当我考虑单元格的高度时，有效区域太小了。

当我发现这个问题时，我将我的操作移到了“Page”标签。但它的工作原理与“网格”标签中的动作相同。我不知道我的问题是什么。

Answer 1

它在 Grid 标签中不起作用，因为你有另一个框覆盖它，所以你将任何东西拖到另一层之上，而不是网格本身。

Answer 2

我最终得到了这个来源。只需在网格标记的末尾添加 canvas 标记。我仍然想知道我为什么要这样做。但它有效。不要减去 Canvas 的背景设置。

<Page 
    x:Class="eeee_textRandomizeUWP.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:eeee_textRandomizeUWP"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid >
        <Grid.RowDefinitions>
            <RowDefinition Height="6*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="3*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <StackPanel>
            <TextBlock Text="파일을 올려주세요" FontSize="{ThemeResource ListViewHeaderItemThemeFontSize}" Margin="20, 0, 0, 0"/>
            <ListView Name="MainFileList">
                <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
                </ListViewItem>
                <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
                </ListViewItem>
                <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
                </ListViewItem>
            </ListView>

        </StackPanel>

        <ListView Grid.Column="1">
            <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
            </ListViewItem>
            <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
            </ListViewItem>

            <ListViewItem>
                    <StackPanel Orientation="Horizontal">
                       <TextBlock Text="&#xE8E5;" FontFamily="Segoe MDL2 Assets" /> 
                    </StackPanel>
            </ListViewItem>
        </ListView>

        <Canvas 
            Background="Transparent"
            Grid.RowSpan="2" 
            Grid.ColumnSpan="2" 
            AllowDrop="True" 
            DragOver="Grid_DragOver" 
            >
        </Canvas>

    </Grid>
</Page>

UWP 向 Grid 多个单元格添加拖放操作

UWP add drag and drop action to Grid more than one cell

c#

xaml

uwp

windows-10-universal