UWP笔记-消息弹窗自动淡出

为了让用户有个更好的UI交互,可以增加自动淡出的消息弹窗,例如:网易云音乐UWP,切换播放模式时,出现的类似消息提示。

右键项目,添加用户控件

UserControlDemo.xaml:

<UserControl
<UserControl.Resources>
<Storyboard x:Name="story_Board" >
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="main_Grid"
Storyboard.TargetProperty="Opacity"
BeginTime="0:0:0">
<SplineDoubleKeyFrame KeyTime="00:00:00.00" Value="1"/>
<SplineDoubleKeyFrame KeyTime="00:00:00.400" Value="0.0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<Grid x:Name="main_Grid">
<Border CornerRadius="10"
Background="Transparent"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Padding="15,5">
<TextBlock x:Name="showContent_textBlock" Margin="10,0,0,2" Foreground="WhiteSmoke" FontSize="30"/>
</Border>
</Grid>
</UserControl>

UserControlDemo.xaml.cs:

public sealed partial class UserControlDemo : UserControl
{
private Popup popup;
private string str;
private TimeSpan showTime_tmr;
public UserControlDemo()
{
this.InitializeComponent();
popup = new Popup();
popup.Child = this;
MeasurePopupSize();
this.Loaded += NotifyPopup_Loaded;
this.Unloaded += NotifyPopup_Unloaded;
} public VolumeContentDialog(string content, TimeSpan showTime) : this()
{
this.str = content;
this.showTime_tmr = showTime; } public VolumeContentDialog(string content) : this(content, TimeSpan.FromSeconds(2))
{
} public void Show()
{
this.popup.IsOpen = true;
} public void Hide()
{
this.popup.IsOpen = false;
} private void MeasurePopupSize()
{
this.Width = ApplicationView.GetForCurrentView().VisibleBounds.Width; double marginTop = 0;
if (ApiInformation.IsTypePresent("Windows.UI.ViewManagement.StatusBar"))
marginTop = StatusBar.GetForCurrentView().OccludedRect.Height;
this.Height = ApplicationView.GetForCurrentView().VisibleBounds.Height;
this.Margin = new Thickness(0, marginTop, 0, 0);
} private void NotifyPopup_Loaded(object sender, RoutedEventArgs e)
{
this.showContent_textBlock.Text = str;
this.story_Board.BeginTime = this.showTime_tmr;
this.story_Board.Begin();
this.story_Board.Completed += storyBoard_Completed;
ApplicationView.GetForCurrentView().VisibleBoundsChanged += NotifyPopup_VisibleBoundsChanged;
}
private void NotifyPopup_VisibleBoundsChanged(ApplicationView sender, object args)
{
MeasurePopupSize();
} private void storyBoard_Completed(object sender, object e)
{
this.popup.IsOpen = false;
} private void NotifyPopup_Unloaded(object sender, RoutedEventArgs e)
{
ApplicationView.GetForCurrentView().VisibleBoundsChanged -= NotifyPopup_VisibleBoundsChanged;
}
}

然后直接在MianPage.cs中实例化引用就可以了。

MainPage.xaml.cs:

UserControlDemo demo = new UserControlDemo("Demo");
demo.Show();
上一篇:[Swift通天遁地]九、拔剑-(2)在项目中使用大量美观的图标


下一篇:一个关于工作日和非工作日的表格