CODEWITHSUNDEEP
maui.net-maui
jaesjulio
jaesjulio

Reputation: 193

Drag and Drop .Net Maui

Is there a way to create a layout with draggable items in the new .net Maui for mobile apps (Android, Ios and WinApp?

I've been searching what is possible to do in the platform and I haven't found something at the moment.

Upvotes: 3

Views: 7788

Answers (1)

Bas H
Bas H

Reputation: 2216

Yes there is , use CanDrag and AllowDrop.

Find it here DragdropMaui example

In MainPage.xaml

    <Frame Margin="20">
        <Frame.GestureRecognizers>
            <DropGestureRecognizer AllowDrop="True" Drop="DropGestureRecognizer_Drop_1" />
        </Frame.GestureRecognizers>
    </Frame>

            <Label Text="Drag Me away" HorizontalTextAlignment="Center" TextColor="Black" FontSize="36">
                <Label.GestureRecognizers>
                    <DragGestureRecognizer CanDrag="True" DragStarting="DragGestureRecognizer_DragStarting_1" />
                </Label.GestureRecognizers>
            </Label>

In MainPage.cs

 private void DragGestureRecognizer_DragStarting_1(object sender, DragStartingEventArgs e)
{
    var label = (sender as Element)?.Parent as Label;
    e.Data.Properties.Add("Text", label.Text);
}

private void DropGestureRecognizer_Drop_1(object sender, DropEventArgs e)
{
    var data = e.Data.Properties["Text"].ToString();
    var frame = (sender as Element)?.Parent as Frame;
    frame.Content = new Label
    {
        Text = data
    };
}

enter image description here

Upvotes: 5

Related Questions