DragStarted-Event for AppBarButtons not working

Sven Drescher 1

Hello alltogether,

I looked for a solution to drag a control element e.g. AppBarButton, Button. In the API-reference an event was described but isn't working. What can I do?

Thanx,
Sven

And here's the code, quite simple, Textbox working with drag and AppBarButton not :-(

MainPage.xaml
<Page
x:Class="LazyBrain.MainPage"
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:LazyBrain"
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>

    <muxc:TwoPaneView
        Name="LazyBrainTwoPaneView"
        MaxWidth="2688"
        MaxHeight="1892"
        ModeChanged="LazyBrainTwoPaneView_ModeChanged" >

        <muxc:TwoPaneView.Pane1>
           ...
        </muxc:TwoPaneView.Pane1>

        <muxc:TwoPaneView.Pane2>
            <Grid Name="Pane2Root" MaxWidth="1344" MaxHeight="1892"  DragOver="Pane2Root_DragOver">

                <Grid.RowDefinitions>
                </Grid.RowDefinitions>

                <local:NotePanelControl Grid.Row="0" CanDrag="True"/>

                <ScrollViewer Name="Pane2ScrollViewer" AllowDrop="True" Grid.Row="1" DragOver="Pane2Root_DragOver">
                    <StackPanel Name="Pane2StackPanel" Padding="16">
                        <TextBlock Text="Notes" MaxLines="1" Style="{ThemeResource HeaderTextBlockStyle}"/>
                        **<TextBlock Text="SingleNote" Style="{ThemeResource SubheaderTextBlockStyle}" CanDrag="True" DragStarting="TextBlock_DragStarting"/>**
                        <Rectangle CanDrag="True" DragStarting="AppBarButton_DragStarting"/>

                        **<AppBarButton Name="TestBarButton" Label="Accept" Icon="Accept" CanDrag="True" DragStarting="AppBarButton_DragStarting" DragLeave="AppBarButton_DragLeave" Click="AppBarButton_Click"/>**

                        <local:NoteElementControl CanDrag="True"/>

                    </StackPanel>
                </ScrollViewer>
            </Grid>
        </muxc:TwoPaneView.Pane2>
    </muxc:TwoPaneView>

    <VisualStateManager.VisualStateGroups>

...
</VisualStateManager.VisualStateGroups>
</Grid>
</Page>

Roy Li - MSFT 32,231 Reputation points Microsoft Vendor

2021-12-03T01:26:02.437+00:00

Would you mind sharing the code that you are using? This could help us understand your question better.

Sven Drescher 1

And the event Handler in MainPage.xaml.cs:

    private void AppBarButton_DragStarting(UIElement sender, DragStartingEventArgs args)
    {
        AppBarButton draggedButton = (AppBarButton)sender;
        DragStartingEventArgs senden = args;
        senden.Data.SetText(draggedButton.Label.ToString());

    }

    private void AppBarButton_DragLeave(object sender, DragEventArgs e)
    {
        AppBarButton draggedButton = (AppBarButton)sender;
        DragEventArgs senden = e;
        senden.Data.SetText(draggedButton.Label.ToString());
    }

    private void AppBarButton_Click(object sender, RoutedEventArgs e)
    {
        //works
    }

    private void TextBlock_DragStarting(UIElement sender, DragStartingEventArgs args)
    {
        //works
    }

Sven Drescher 1 Reputation point

2021-12-03T08:36:18.68+00:00

I edited my question and the second part of the code in the comment... Sorry for that.
Roy Li - MSFT 32,231 Reputation points Microsoft Vendor

2021-12-06T06:55:50.293+00:00

I could reproduce this behavior, I need to consult other engineers to check whether this is expected. If this is by design, you will have to handle the ManipulationDelta Event of the button and manually change the button's position.
Sven Drescher 1 Reputation point

2021-12-06T07:58:00.48+00:00

Thanks @Roy Li - MSFT ,

Ok, so i didn't do wrong. Maybe just the documentation is "old" ;-)
I just want to use the drag&drop functionality to transport the information the button (also AppBarToggleButton) is representing into another frame. Maybe, Button "show date" used with drag&drop to add a filter criteria "date".

I hope there is an effective solution.
Grretings,
Sven
Roy Li - MSFT 32,231 Reputation points Microsoft Vendor

2021-12-07T02:54:02.833+00:00

@Sven Drescher Have you considered using other controls instead of buttons on that specific place like a Border? You could create a Border and add a TextBlock inside it, making it looks like a button. Handle the tapped event as the button click event.