feat(InAppNotifications): improve control

Microsoft.Toolkit.Uwp.SampleApp/Common/TimeSpanConverter.cs

@@ -0,0 +1,40 @@
+// ******************************************************************
+// Copyright (c) Microsoft. All rights reserved.
+// This code is licensed under the MIT License (MIT).
+// THE CODE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
+// INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+// IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
+// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+// TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH
+// THE CODE OR THE USE OR OTHER DEALINGS IN THE CODE.
+// ******************************************************************
+
+using System;
+using Windows.UI.Xaml.Data;
+
+namespace Microsoft.Toolkit.Uwp.SampleApp.Common
+{
+    public class TimeSpanConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, string language)
+        {
+            if (value is TimeSpan tSpan)
+            {
+                return tSpan.TotalMilliseconds;
+            }
+
+            return value;
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, string language)
+        {
+            if (value is double milliseconds)
+            {
+                return TimeSpan.FromMilliseconds(milliseconds);
+            }
+
+            return TimeSpan.MinValue;
+        }
+    }
+}

Microsoft.Toolkit.Uwp.SampleApp/Controls/PropertyControl.xaml.cs

@@ -151,6 +151,26 @@ private void PropertyControl_OnDataContextChanged(FrameworkElement sender, DataC
 
                             controlToAdd = colorComboBox;
                             dependencyProperty = Selector.SelectedItemProperty;
+                            break;
+                        case PropertyKind.TimeSpan:
+                            var timeSlider = new Slider();
+                            var timeSliderOption = option as SliderPropertyOptions;
+                            if (timeSliderOption != null)
+                            {
+                                timeSlider.Minimum = timeSliderOption.MinValue;
+                                timeSlider.Maximum = timeSliderOption.MaxValue;
+                                timeSlider.StepFrequency = timeSliderOption.Step;
+                            }
+
+                            if ((propertyDict[option.Name] as ValueHolder).Value is double timeValue)
+                            {
+                                timeSlider.Value = timeValue;
+                            }
+
+                            controlToAdd = timeSlider;
+                            dependencyProperty = RangeBase.ValueProperty;
+                            converter = new TimeSpanConverter();
+
                             break;
                         default:
                             var textBox = new TextBox { Text = (propertyDict[option.Name] as ValueHolder).Value.ToString() };

Microsoft.Toolkit.Uwp.SampleApp/Microsoft.Toolkit.Uwp.SampleApp.csproj

@@ -456,6 +456,7 @@
     <Compile Include="Common\BoolStringConverter.cs" />
     <Compile Include="Common\Constants.cs" />
     <Compile Include="Common\DelegateCommand{T}.cs" />
+    <Compile Include="Common\TimeSpanConverter.cs" />
     <Compile Include="Common\EnumConverter.cs" />
     <Compile Include="Common\ListViewHoverScroll.cs" />
     <Compile Include="Common\SampleCommand.cs" />

Microsoft.Toolkit.Uwp.SampleApp/Models/PropertyDescriptor/PropertyKind.cs

@@ -19,6 +19,7 @@ public enum PropertyKind
         String,
         Enum,
         Bool,
-        Brush
+        Brush,
+        TimeSpan
     }
 }

Microsoft.Toolkit.Uwp.SampleApp/Models/Sample.cs

@@ -406,6 +406,37 @@ public async Task PreparePropertyDescriptorAsync()
                                         continue;
                                     }
 
+                                    break;
+                                case PropertyKind.TimeSpan:
+                                    try
+                                    {
+                                        var sliderOptions = new SliderPropertyOptions { DefaultValue = TimeSpan.FromMilliseconds(double.Parse(value)) };
+                                        var parameters = match.Groups["parameters"].Value;
+                                        var split = parameters.Split('-');
+                                        int minIndex = 0;
+                                        int minMultiplier = 1;
+                                        if (string.IsNullOrEmpty(split[0]))
+                                        {
+                                            minIndex = 1;
+                                            minMultiplier = -1;
+                                        }
+
+                                        sliderOptions.MinValue = minMultiplier * double.Parse(split[minIndex]);
+                                        sliderOptions.MaxValue = double.Parse(split[minIndex + 1]);
+                                        if (split.Length > 2 + minIndex)
+                                        {
+                                            sliderOptions.Step = double.Parse(split[split.Length - 1]);
+                                        }
+
+                                        options = sliderOptions;
+                                    }
+                                    catch (Exception ex)
+                                    {
+                                        Debug.WriteLine($"Unable to extract slider info from {value}({ex.Message})");
+                                        TrackingManager.TrackException(ex);
+                                        continue;
+                                    }
+
                                     break;
                                 case PropertyKind.Enum:
                                     try

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/InAppNotification/InAppNotificationPage.xaml

@@ -11,6 +11,11 @@
 
     <Page.Resources>
         <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceDictionary Source="ms-appx:///Microsoft.Toolkit.Uwp.UI.Controls/InAppNotification/Styles/MSEdgeNotificationStyle.xaml" />
+                <ResourceDictionary Source="ms-appx:///Microsoft.Toolkit.Uwp.UI.Controls/InAppNotification/Styles/VSCodeNotificationStyle.xaml" />
+            </ResourceDictionary.MergedDictionaries>
+
             <local:DismissCommand x:Key="DismissCommand" />
 
             <Style x:Key="DismissTextBlockButtonStyle" TargetType="ButtonBase">

Microsoft.Toolkit.Uwp.SampleApp/SamplePages/InAppNotification/InAppNotificationXaml.bind

@@ -9,6 +9,10 @@
 
     <Page.Resources>
         <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceDictionary Source="ms-appx:///Microsoft.Toolkit.Uwp.UI.Controls/InAppNotification/Styles/VSCodeNotificationStyle.xaml" />
+            </ResourceDictionary.MergedDictionaries>
+
             <local:DismissCommand x:Key="DismissCommand" />
 
             <Style x:Key="DismissTextBlockButtonStyle" TargetType="ButtonBase">
@@ -278,41 +282,29 @@
 
         <controls:InAppNotification x:Name="ExampleInAppNotification"
                                     Content="This is a test message."
-                                    ShowDismissButton="@[ShowDismissButton:Bool:True]" />
+                                    ShowDismissButton="@[ShowDismissButton:Bool:True]"
+                                    AnimationDuration="@[AnimationDuration:TimeSpan:100:0-5000]"
+                                    VerticalOffset="@[VerticalOffset:DoubleSlider:100.0:-200.0-200.0]"
+                                    HorizontalOffset="@[HorizontalOffset:DoubleSlider:0.0:-200.0-200.0]" />
 
         <controls:InAppNotification x:Name="ExampleVSCodeInAppNotification"
-                                    MinHeight="35"
-                                    Background="#333333"
-                                    Foreground="White"
-                                    FontSize="14"
-                                    Padding="0"
-                                    BorderThickness="0"
-                                    ShowDismissButton="False"
-                                    VerticalAlignment="Top"
-                                    RenderTransformOrigin="0.5,0">
+                                    Style="{StaticResource VSCodeNotificationStyle}"
+                                    AnimationDuration="@[AnimationDuration]"
+                                    VerticalOffset="@[VerticalOffset]"
+                                    HorizontalOffset="@[HorizontalOffset]">
             <controls:InAppNotification.ContentTemplate>
                 <DataTemplate>
                     <Grid>
                         <Grid.ColumnDefinitions>
-                            <ColumnDefinition Width="Auto" />
                             <ColumnDefinition />
                             <ColumnDefinition Width="Auto" />
                         </Grid.ColumnDefinitions>
 
-                        <Grid Margin="10 5" Height="20" Background="#007ACC">
-                            <TextBlock Text="info"
-                                       Padding="5 0"
-                                       FontWeight="Bold"
-                                       VerticalAlignment="Center"
-                                       Foreground="White" />
-                        </Grid>
-
-                        <TextBlock Grid.Column="1" 
-                                   VerticalAlignment="Center"
+                        <TextBlock VerticalAlignment="Center"
                                    Text="This a test message."
                                    TextWrapping="NoWrap" TextTrimming="CharacterEllipsis" />
 
-                        <StackPanel Grid.Column="2" Orientation="Horizontal">
+                        <StackPanel Grid.Column="1" Orientation="Horizontal">
                             <Button Content="Action 1" 
                                     Command="{StaticResource DismissCommand}"
                                     CommandParameter="{Binding ElementName=ExampleVSCodeInAppNotification}"

Microsoft.Toolkit.Uwp.SampleApp/readme.md

@@ -38,6 +38,7 @@ You can define "interactive" values in this file. The value types can be:
 * String: You want the user to provide a text. The string is built like this @[Name:**String**:Default value]
 * Slider: You want the user to provide a double value. The string is built like this @[Name:**Slider**:Default value:min-max]
 * DoubleSlider: Same as slider but with double values (0.01 precision)
+* TimeSpan: You want the user to provide a duration. The string is built like this (all values in miliseconds) @[Name:**TimeSpan**:DefaultValue:min-max]
 * Enum: You want the user to provide a enum value. The string is built like this @[Name:**Enum**:EnumType.DefaultValue]
 * Brush: You want the user to select a color from a list. The string is built like this @[Name:**Brush**:Black]
 * Bool: You want the user to enable or disable a property. The string is built like this @[Name:**Bool**:True]

Microsoft.Toolkit.Uwp.UI.Controls/InAppNotification/InAppNotification.AttachedProperties.cs

@@ -0,0 +1,66 @@
+// ******************************************************************
+// Copyright (c) Microsoft. All rights reserved.
+// This code is licensed under the MIT License (MIT).
+// THE CODE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
+// INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+// IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
+// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+// TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH
+// THE CODE OR THE USE OR OTHER DEALINGS IN THE CODE.
+// ******************************************************************
+
+using System;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Media.Animation;
+
+namespace Microsoft.Toolkit.Uwp.UI.Controls
+{
+    /// <summary>
+    /// In App Notification defines a control to show local notification in the app.
+    /// </summary>
+    public partial class InAppNotification
+    {
+        /// <summary>
+        /// Gets the value of the KeyFrameDuration attached Property
+        /// </summary>
+        /// <param name="obj">the KeyFrame where the duration is set</param>
+        /// <returns>Value of KeyFrameDuration</returns>
+        public static TimeSpan GetKeyFrameDuration(DependencyObject obj)
+        {
+            return (TimeSpan)obj.GetValue(KeyFrameDurationProperty);
+        }
+
+        /// <summary>
+        /// Sets the value of the KeyFrameDuration attached property
+        /// </summary>
+        /// <param name="obj">The KeyFrame object where the property is attached</param>
+        /// <param name="value">The TimeSpan value to be set as duration</param>
+        public static void SetKeyFrameDuration(DependencyObject obj, TimeSpan value)
+        {
+            obj.SetValue(KeyFrameDurationProperty, value);
+        }
+
+        /// <summary>
+        /// Using a DependencyProperty as the backing store for KeyFrameDuration. This enables animation, styling, binding, etc
+        /// </summary>
+        public static readonly DependencyProperty KeyFrameDurationProperty =
+            DependencyProperty.RegisterAttached("KeyFrameDuration", typeof(TimeSpan), typeof(InAppNotification), new PropertyMetadata(0, OnKeyFrameAnimationChanged));
+
+        private static void OnKeyFrameAnimationChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
+        {
+            if (e.NewValue is TimeSpan ts)
+            {
+                var keyTimeFromAnimationDuration = KeyTime.FromTimeSpan(ts);
+                if (d is DoubleKeyFrame dkf)
+                {
+                    dkf.KeyTime = KeyTime.FromTimeSpan(ts);
+                }
+                else if (d is ObjectKeyFrame okf)
+                {
+                    okf.KeyTime = KeyTime.FromTimeSpan(ts);
+                }
+            }
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI.Controls/InAppNotification/InAppNotification.Events.cs

@@ -20,14 +20,56 @@ namespace Microsoft.Toolkit.Uwp.UI.Controls
     /// </summary>
     public partial class InAppNotification
     {
+        /// <summary>
+        /// Event raised when the notification is opening
+        /// </summary>
+        public event InAppNotificationOpeningEventHandler Opening;
+
+        /// <summary>
+        /// Event raised when the notification is opened
+        /// </summary>
+        public event EventHandler Opened;
+
         /// <summary>
         /// Event raised when the notification is dismissed
         /// </summary>
+        [Obsolete("Use Closed event instead.")]
         public event EventHandler Dismissed;
 
+        /// <summary>
+        /// Event raised when the notification is closing
+        /// </summary>
+        public event InAppNotificationClosingEventHandler Closing;
+
+        /// <summary>
+        /// Event raised when the notification is closed
+        /// </summary>
+        public event InAppNotificationClosedEventHandler Closed;
+
         private void DismissButton_Click(object sender, RoutedEventArgs e)
         {
-            Dismiss();
+            Dismiss(InAppNotificationDismissKind.User);
+        }
+
+        private void DismissTimer_Tick(object sender, object e)
+        {
+            Dismiss(InAppNotificationDismissKind.Timeout);
+            _dismissTimer.Stop();
+        }
+
+        private void OpenAnimationTimer_Tick(object sender, object e)
+        {
+            _animationTimer.Stop();
+            Opened?.Invoke(this, EventArgs.Empty);
+            _animationTimer.Tick -= OpenAnimationTimer_Tick;
+        }
+
+        private void DismissAnimationTimer_Tick(object sender, object e)
+        {
+            _animationTimer.Stop();
+            Dismissed?.Invoke(this, EventArgs.Empty);
+            Closed?.Invoke(this, new InAppNotificationClosedEventArgs(_lastDismissKind));
+            _animationTimer.Tick -= DismissAnimationTimer_Tick;
         }
     }
 }