Mouse Events not Triggering on User Control

Question

I'm working on a WinUI 3 app, and I've made a user control and I've been trying to get the left and right clicks to do some things. For some reason, my component doesn't pick up on the events like the rest of my components.

Here's my XAML code:

<?xml version="1.0" encoding="utf-8"?>
<UserControl
    x:Class="esheets_desktop_app_trafalgareng.Task"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:esheets_desktop_app_trafalgareng"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <StackPanel Name="stackPanel" Orientation="Horizontal" PointerPressed="Task_PointerPressed" PointerEntered="Task_PointerEntered" Background="Red">
        <TextBlock Name="projectNum" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
        <TextBlock Name="taskName" Width="750" Margin="10,10,10,10" TextAlignment="Left"/>
        <TextBlock Name="assignedBy" Width="100" Margin="10,10,10,10" TextAlignment="Left"/>

        <StackPanel.ContextFlyout>
            <MenuFlyout>
                <MenuFlyoutItem Name="test" Icon="setting" Text="test"/>
            </MenuFlyout>
        </StackPanel.ContextFlyout>
    </StackPanel>
</UserControl>

and my CS code:

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Media;
using System;
using System.Diagnostics;

namespace esheets_desktop_app_trafalgareng
{
    public sealed partial class Task : UserControl
    {
        internal int TaskID { get; set; }
        internal int? ProjectID { get; set; }
        internal int TaskTypeID { get; set; }
        internal int? TaskAssignee { get; set; }
        internal string TaskName { get; set; }
        internal DateTime? TaskDueDate { get; set; }
        internal int TaskStatus { get; set; }
        internal string TaskPriority { get; set; }
        internal int TaskCreatedBy { get; set; }
        internal DateTime? TaskDateCreated { get; set; }
        internal int TaskLastEditedBy { get; set; }
        internal DateTime? TaskDateEdited { get; set; }
        internal bool TaskSent { get; set; }
        internal DateTime? TaskDateSent { get; set; }

        public Task(int TaskID, int? ProjectID, int TaskTypeID, int? TaskAssignee, string TaskName, DateTime? TaskDueDate, int TaskStatus, string TaskPriority, int TaskCreatedBy, DateTime? TaskDateCreated, int TaskLastEditedBy, DateTime? TaskDateEdited, bool TaskSent, DateTime? TaskDateSent)
        {
            this.TaskID = TaskID;
            this.ProjectID = ProjectID;
            this.TaskTypeID = TaskTypeID;
            this.TaskAssignee = TaskAssignee;
            this.TaskName = TaskName;
            this.TaskDueDate = TaskDueDate;
            this.TaskStatus = TaskStatus;
            this.TaskPriority = TaskPriority;
            this.TaskCreatedBy = TaskCreatedBy;
            this.TaskDateCreated = TaskDateCreated;
            this.TaskLastEditedBy = TaskLastEditedBy;
            this.TaskDateEdited = TaskDateEdited;
            this.TaskSent = TaskSent;
            this.TaskDateSent = TaskDateSent;

            this.InitializeComponent();

            projectNum.Text = Tasks.GetProjectNumber(ProjectID);
            taskName.Text = this.TaskName;
            assignedBy.Text = Tasks.GetName(TaskCreatedBy);

            if (TaskDueDate != null && ((DateTime)TaskDueDate).Date == DateTime.Today)
            {
                SolidColorBrush redBrush = new(Windows.UI.Color.FromArgb(255, 255, 0, 0));

                projectNum.Foreground = redBrush;
                taskName.Foreground = redBrush;
                assignedBy.Foreground = redBrush;
            }

            if (TaskStatus == TaskStatuses.Completed)
            {
                SolidColorBrush grayBrush = new(Windows.UI.Color.FromArgb(255, 64, 64, 64));

                projectNum.Foreground = grayBrush;
                taskName.Foreground = grayBrush;
                assignedBy.Foreground = grayBrush;
            }
        }

        private void Task_PointerPressed(object sender, Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e)
        {
            Trace.WriteLine("Pointer Pressed");
        }

        private void Task_PointerEntered(object sender, Microsoft.UI.Xaml.Input.PointerRoutedEventArgs e)
        {
            Trace.WriteLine("Pointer Entered");
        }
    }

I'm also attaching the XAML code of the window where I'm putting the UserControls (in the ListViews)

<?xml version="1.0" encoding="utf-8"?>
<Window
    Title="Trafalgar Engineering ESheets"
    x:Class="esheets_desktop_app_trafalgareng.Tasks"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:esheets_desktop_app_trafalgareng"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Activated="Window_Activated">

    <SplitView Name="primaryContainer" IsPaneOpen="True" PaneClosing="PrimaryContainer_PaneClosing">
        <StackPanel Margin="360,0,0,0">
            <StackPanel Orientation="Horizontal">
                <Image Name="titleImage" Width="30" Source="/Assets/house.png" HorizontalAlignment="Left"/>
                <TextBlock Name="title" Text="My Tasks" Margin="15,30,0,30" FontSize="30" FontWeight="SemiBold" HorizontalAlignment="Left"/>
                <Button Name="addTask" Height="35" Width="35" HorizontalAlignment="Right" VerticalAlignment="Center" Click="AddTask_Click">
                    <Image Height="20" Source="/Assets/plus.png"/>
                </Button>
            </StackPanel>
            <StackPanel Orientation="Vertical">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="Project Number" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
                    <TextBlock Text="Task" Width="750" Margin="10,10,10,10" TextAlignment="Center"/>
                    <TextBlock Name="assignedBy"  Text="Assigned By" Width="100" Margin="10,10,10,10" TextAlignment="Center"/>
                </StackPanel>
                <Line Stroke="DimGray" X1="0" Y1="0" X2="1000" Y2="0"/>
                <ScrollViewer VerticalScrollBarVisibility="Visible">
                    <StackPanel>
                        <ListView Name="tasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
                        <ListView Name="completeTasksPanel" VerticalAlignment="Top" HorizontalAlignment="Left"/>
                    </StackPanel>
                </ScrollViewer>
            </StackPanel>
        </StackPanel>
    </SplitView>
</Window>

And this is how I'm adding my Tasks to the ListView:

private async void Window_Activated(object sender, WindowActivatedEventArgs args)
{
    Activated -= Window_Activated;
    tasksPanel.Items.Add(new Task(0, 12, 0, 25, "test task", null, 0, "test priority", 25, DateTime.Today, 25, DateTime.Today, true, DateTime.Today));
}

I've tried putting the PointerPressed and PointerEntered events on the UserControl, the StackPanel and the TextBlocks, but nothing has worked so far.

The `PointerPressed` and `PointerEntered` events should get raised as expected. Or what exactly is it that doesn't work as you expect? — mm8, Jun 27 '23 at 14:03
They're just not getting raised when I run the code. I have the `Task` objects inside a `ListView`, could that be causing a problem? — Borisonekenobi, Jun 27 '23 at 14:56
Where and how are you adding the `UserControl` to the `ListView`? Do you see the red `StackPanel` when you run the app? — mm8, Jun 28 '23 at 15:22
When the window is created, I create a new `Task` object, and add it to one of the `ListView`s. I'm using a database to get all the tasks, so I haven't attached that code, if you need, I can add a bit of code to show how I create/add tasks — Borisonekenobi, Jun 28 '23 at 15:26
So you do `tasksPanel.Items.Add(new Task());` but when you click on the red `StackPanel` the `Task_PointerPressed` event handler is not invoked? — mm8, Jun 28 '23 at 15:30
How do you confirm that the event handlers are not invoked? Because they should be invoked. They are for me. Again: Do you see the red `StackPanel` when you run the app?` — mm8, Jun 28 '23 at 15:34
I see the red `StackPanel`, however when my pointer presses or enters, the `Task_PointerPressed` and `Task_PointerEntered` methods I've created to simply print to the output window never get activated. — Borisonekenobi, Jun 28 '23 at 15:38
Yes. The methods never get activated, I've tried putting breakpoints in my code there too (to make sure it's not the `Trace.WriteLine()` command that is failing, however, it just never reaches that spot in my code — Borisonekenobi, Jun 28 '23 at 15:42

score 0 · Answer 1 · answered Jun 27 '23 at 07:54

0

As far as I'm concerned, you should try to set the Background property of the UserControl.

You could refer to the thread:Pointer events not triggered on UI Elements in custom control

answered Jun 27 '23 at 07:54

Jeaninez - MSFT

3,210
1
5
20

I tried adding the background on the `UserControl`, the `StackPanel`, and both at the same time, but nothing changed – Borisonekenobi Jun 27 '23 at 13:21
I test your code and got some errors "The name 'Tasks' does not exist in the current context" It seems that the 'Tasks' is not a class in `System.Threading.Tasks` namespace. Could you please tell us what's the `Tasks`? – Jeaninez - MSFT Jun 28 '23 at 07:43
`Tasks` is my main window, I provided the XAML code for it in my most recent edit – Borisonekenobi Jun 28 '23 at 13:21
Could you please tell us how do you add the `UserControl` to the `ListView`? Could you please provide the minimum sample to help us reproduce the issue? – Jeaninez - MSFT Jun 30 '23 at 06:53
I've added my `Window_Activated()` method to show how I'm adding the `UserControl`s to the `ListView` – Borisonekenobi Jun 30 '23 at 13:02

score 0 · Answer 2 · answered Jul 04 '23 at 14:41

My first guess is that you are not calling InitializeComponent() in your Task constructor.

public Task(int v1, int v2, int v3, int v4, string v5, object value, int v6, string v7, int v8, DateTime today1, int v9, DateTime today2, bool v10, DateTime today3)
{
    this._v1 = v1;
    this._v2 = v2;
    this._v3 = v3;
    this._v4 = v4;
    this._v5 = v5;
    this._value = value;
    this._v6 = v6;
    this._v7 = v7;
    this._v8 = v8;
    this._today1 = today1;
    this._v9 = v9;
    this._today2 = today2;
    this._v10 = v10;
    this._today3 = today3;
    this.InitializeComponent();
}

Mouse Events not Triggering on User Control

2 Answers2