Change dragged element appearance during .Net MAUI draggesturerecognizer operation

647 views Asked by At

How do I change the appearance of the XAML element that is displayed while being dragged during a drag & drop operation in .Net MAUI?

Maybe I should ask to what extent the appearance of the dragged visual can be changed?

Currently the dragged visual is basically a slightly transparent copy of the XAML element on which the DragGestureRecognizer is implemented. I'd like to replace that visual completely, or at least resize it.

I've adapted this example for an MVVM implementation, but I can't seem to find a way to change the appearance of the dragged visual.

Thx

1

There are 1 answers

0
Guangyu Bai - MSFT On

I tried the DragStartingCommand which is executed when a drag gesture is first recognized.

Here is the code in .xmal file. I create a rectangle.

<Rectangle Stroke="Red"
           Fill="DarkBlue"
           StrokeThickness="4"
           HeightRequest="200"
           WidthRequest="200"
           x:Name="myrec" >
    <Rectangle.GestureRecognizers>
        <DragGestureRecognizer DragStarting="OnDragStarting" />
    </Rectangle.GestureRecognizers>
</Rectangle>

Here is the code behind. I drag the element then it will set the height to 12.

void OnDragStarting(object sender, DragStartingEventArgs e)
{
    
    Shape shape = (sender as Element).Parent as Shape;
    e.Data.Properties.Add("Square", new Square(shape.Width, shape.Height));
    myrec.HeightRequest = 12;
}

More commands you can use by refering to Add drag and drop gesture recognizers