-
Notifications
You must be signed in to change notification settings - Fork 99
Improvements to DispatcherQueueTimer.Debounce extension #569
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
Merged
Changes from 10 commits
Commits
Show all changes
11 commits
Select commit
Hold shift + click to select a range
57134f2
Add baseline single scenario tests for DispatcherQueueTimer Debounce
michael-hawker 8632ff8
Add some DispatcherQueueTimer docs, initial sample, and more unit tests
michael-hawker df91883
Add test and fix behavior for when switching Debounce mode from Trail…
michael-hawker 387806a
Add Debounce test for stopping the timer manually
michael-hawker 86e6d96
Add mouse clicking debounce sample
michael-hawker c1be9bb
Clean-up usage of the sample slider value in the Debounce samples
michael-hawker 7985456
Switch Debounce DispatcherQueueTimer extension to use ConditionalWeak…
michael-hawker 18b340f
Apply XAML Styler
michael-hawker 5eaf1f4
Add additional notes/details about how to use the DispatcherQueueTime…
michael-hawker 26ac1f8
Clarify behavior in docs and test results of registering to the Tick …
michael-hawker 46e0596
Apply Arlo's suggestions from code review on Debounce improvements - …
michael-hawker File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
14 changes: 14 additions & 0 deletions
14
components/Extensions/samples/Dispatcher/KeyboardDebounceSample.xaml
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
<Page x:Class="ExtensionsExperiment.Samples.DispatcherQueueExtensions.KeyboardDebounceSample" | ||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" | ||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" | ||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" | ||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" | ||
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" | ||
mc:Ignorable="d"> | ||
|
||
<StackPanel Spacing="8"> | ||
<TextBox PlaceholderText="Type here..." | ||
TextChanged="TextBox_TextChanged" /> | ||
<TextBlock x:Name="ResultText" /> | ||
</StackPanel> | ||
</Page> |
42 changes: 42 additions & 0 deletions
42
components/Extensions/samples/Dispatcher/KeyboardDebounceSample.xaml.cs
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
// Licensed to the .NET Foundation under one or more agreements. | ||
// The .NET Foundation licenses this file to you under the MIT license. | ||
// See the LICENSE file in the project root for more information. | ||
|
||
using CommunityToolkit.WinUI; | ||
#if WINAPPSDK | ||
using DispatcherQueue = Microsoft.UI.Dispatching.DispatcherQueue; | ||
using DispatcherQueueTimer = Microsoft.UI.Dispatching.DispatcherQueueTimer; | ||
#else | ||
using DispatcherQueue = Windows.System.DispatcherQueue; | ||
using DispatcherQueueTimer = Windows.System.DispatcherQueueTimer; | ||
#endif | ||
|
||
namespace ExtensionsExperiment.Samples.DispatcherQueueExtensions; | ||
|
||
[ToolkitSample(id: nameof(KeyboardDebounceSample), "DispatcherQueueTimer Debounce Keyboard", description: "A sample for showing how to use the DispatcherQueueTimer Debounce extension to smooth keyboard input.")] | ||
[ToolkitSampleNumericOption("Interval", 120, 60, 240)] | ||
public sealed partial class KeyboardDebounceSample : Page | ||
{ | ||
public DispatcherQueueTimer _debounceTimer = DispatcherQueue.GetForCurrentThread().CreateTimer(); | ||
|
||
public KeyboardDebounceSample() | ||
{ | ||
InitializeComponent(); | ||
} | ||
|
||
private void TextBox_TextChanged(object sender, TextChangedEventArgs e) | ||
{ | ||
if (sender is TextBox textBox) | ||
{ | ||
_debounceTimer.Debounce(() => | ||
{ | ||
ResultText.Text = textBox.Text; | ||
}, | ||
//// i.e. if another keyboard press comes in within 120ms of the last, we'll wait before we fire off the request | ||
interval: TimeSpan.FromMilliseconds(Interval), | ||
//// If we're blanking out or the first character type, we'll start filtering immediately instead to appear more responsive. | ||
//// We want to switch back to trailing as the user types more so that we still capture all the input. | ||
immediate: textBox.Text.Length <= 1); | ||
} | ||
} | ||
} |
14 changes: 14 additions & 0 deletions
14
components/Extensions/samples/Dispatcher/MouseDebounceSample.xaml
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
<Page x:Class="ExtensionsExperiment.Samples.DispatcherQueueExtensions.MouseDebounceSample" | ||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" | ||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" | ||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" | ||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" | ||
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" | ||
mc:Ignorable="d"> | ||
|
||
<StackPanel Spacing="8"> | ||
<Button Click="Button_Click" | ||
Content="Click Me" /> | ||
<TextBlock x:Name="ResultText" /> | ||
</StackPanel> | ||
</Page> |
39 changes: 39 additions & 0 deletions
39
components/Extensions/samples/Dispatcher/MouseDebounceSample.xaml.cs
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
// Licensed to the .NET Foundation under one or more agreements. | ||
// The .NET Foundation licenses this file to you under the MIT license. | ||
// See the LICENSE file in the project root for more information. | ||
|
||
using CommunityToolkit.WinUI; | ||
#if WINAPPSDK | ||
using DispatcherQueue = Microsoft.UI.Dispatching.DispatcherQueue; | ||
using DispatcherQueueTimer = Microsoft.UI.Dispatching.DispatcherQueueTimer; | ||
#else | ||
using DispatcherQueue = Windows.System.DispatcherQueue; | ||
using DispatcherQueueTimer = Windows.System.DispatcherQueueTimer; | ||
#endif | ||
|
||
namespace ExtensionsExperiment.Samples.DispatcherQueueExtensions; | ||
|
||
[ToolkitSample(id: nameof(MouseDebounceSample), "DispatcherQueueTimer Debounce Mouse", description: "A sample for showing how to use the DispatcherQueueTimer Debounce extension to smooth mouse input.")] | ||
[ToolkitSampleNumericOption("Interval", 400, 300, 1000)] | ||
public sealed partial class MouseDebounceSample : Page | ||
{ | ||
public DispatcherQueueTimer _debounceTimer = DispatcherQueue.GetForCurrentThread().CreateTimer(); | ||
|
||
private int _count = 0; | ||
|
||
public MouseDebounceSample() | ||
{ | ||
InitializeComponent(); | ||
} | ||
|
||
private void Button_Click(object sender, RoutedEventArgs e) | ||
{ | ||
_debounceTimer.Debounce(() => | ||
{ | ||
ResultText.Text = $"You hit the button {++_count} times!"; | ||
}, | ||
interval: TimeSpan.FromMilliseconds(Interval), | ||
// By being on the leading edge, we ignore inputs past the first for the duration of the interval | ||
immediate: true); | ||
} | ||
} |
42 changes: 42 additions & 0 deletions
42
components/Extensions/samples/DispatcherQueueTimerExtensions.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
--- | ||
title: DispatcherQueueTimerExtensions | ||
author: michael-hawker | ||
description: Helpers for executing code at specific times on a UI thread through a DispatcherQueue instance with a DispatcherQueueTimer. | ||
keywords: dispatcher, dispatcherqueue, DispatcherHelper, DispatcherQueueExtensions, DispatcherQueueTimer, DispatcherQueueTimerExtensions | ||
dev_langs: | ||
- csharp | ||
category: Extensions | ||
subcategory: Miscellaneous | ||
discussion-id: 0 | ||
issue-id: 0 | ||
icon: Assets/Extensions.png | ||
--- | ||
|
||
The `DispatcherQueueTimerExtensions` static class provides an extension method for [`DispatcherQueueTimer`](https://learn.microsoft.com/windows/windows-app-sdk/api/winrt/microsoft.ui.dispatching.dispatcherqueue) objects that make it easier to execute code on a specific UI thread at a specific time. | ||
|
||
The `DispatcherQueueTimerExtensions` provides a single extension method, `Debounce`. This is a standard technique used to rate-limit input from a user to not overload requests on an underlying service or query elsewhere. | ||
|
||
> [!WARNING] | ||
> You should exclusively use the `DispatcherQueueTimer` instance calling `Debounce` for the purposes of Debouncing one specific action/scenario only and not configure it for other additional uses. | ||
|
||
For each sceario that you want to Debounce, you'll want to create a separate `DispatcherQueueTimer` instance to track that specific scenario. For instance, if the below samples were both within your application. You'd need two separate timers to track debouncing both scenarios. One for the keyboard input, and a different one for the mouse input. | ||
|
||
> [!NOTE] | ||
> Using the `Debounce` method will set `DispatcherQueueTimer.IsRepeating` to `false` to ensure proper operation. Do not change this value. | ||
|
||
> [!NOTE] | ||
> If additionally registering to the `DispatcherQueueTimer.Tick` event (uncommon), it will be raised in one of two ways: 1. For a trailing debounce, it will be raised alongside the requested Action passed to the Debounce method. 2. For a leading debounce, it will be raised when the cooldown has expired and another call to Debounce would result in running the action. | ||
|
||
## Syntax | ||
|
||
It can be used in a number of ways, but most simply like so as a keyboard limiter: | ||
|
||
> [!SAMPLE KeyboardDebounceSample] | ||
|
||
Or for preventing multiple inputs from occuring accidentally (e.g. ignoring a double/multi-click): | ||
|
||
> [!SAMPLE MouseDebounceSample] | ||
|
||
## Examples | ||
|
||
You can find more examples in the [unit tests](https://github.com/CommunityToolkit/Windows/blob/rel/8.1.240916/components/Extensions/tests/DispatcherQueueTimerExtensionTests.cs). |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.