WPF自动隐藏的消息框的实例代码

2024-10-24 14:14:48

(鼠标放上去将一直显示，移开动画继续)，提供normal和error两种边框。

介绍：传统的确定，取消,OK,CANCAL之类的对话框太繁琐了，由于项目需要而诞生的仿手机式提示对话框。当然传统的对话框项目中也有，这里就不做介绍了。

出场和退场动画做得很简单，就用Blend随便鼓捣了一番，将就用吧。

预览效果如下：

思路其实很简单：将窗体透明化->布局和样式设计->后台传值调用。

准备工作：Microsoft.Expression.Interactions.dll和System.Windows.Interactivity.dll的引用。Blend中大多数行为需要需要这2个dll，必备啊！

1，将窗体透明化，无边框化：（在.net 4.5中拖动和缩放窗体再也不用自己写代码了，集成的 <WindowChrome/>就可以实现拖动缩放窗体等诸多功能。）

关键设置如下：

AllowsTransparency="True" HorizontalAlignment="Center" Background="Transparent" xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" WindowStyle="None"

2，布局，主要包括初始布局和动画过渡2个方面：

静态界面布局：

<Grid  HorizontalAlignment="Center" VerticalAlignment="Top" x:Name="back">
    <Border Padding="38 0" x:Name="br" HorizontalAlignment="Center" VerticalAlignment="Center">
      <i:Interaction.Triggers>
        <i:EventTrigger EventName="MouseEnter">
          <ei:ControlStoryboardAction Storyboard="{StaticResource ShowSb}" ControlStoryboardOption="Stop"/>
        </i:EventTrigger>
        <i:EventTrigger EventName="MouseLeave">
          <ei:ControlStoryboardAction Storyboard="{StaticResource MouseLeave}"/>
        </i:EventTrigger>
      </i:Interaction.Triggers>
      <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
        <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
          <Grid.RowDefinitions>
            <RowDefinition Height="12"></RowDefinition>
            <RowDefinition Height="auto"></RowDefinition>
            <RowDefinition Height="12"></RowDefinition>
          </Grid.RowDefinitions>
          <Border Visibility="Visible" x:Name="grid1" Grid.RowSpan="3" RenderTransformOrigin="0.5,0.5" BorderBrush="#00A0E9" BorderThickness="1" CornerRadius="8">
            <Border.RenderTransform>
              <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform/>
                <TranslateTransform/>
              </TransformGroup>
            </Border.RenderTransform>
            <Border.Background>
              <LinearGradientBrush EndPoint="1,1" MappingMode="RelativeToBoundingBox" StartPoint="0,0">
                <GradientStop Color="#EFF0F2" Offset="0.75"/>
                <GradientStop Color="#EFF0F2" Offset="0.25"/>
                <GradientStop Color="#EFF0F2" Offset="1"/>
                <GradientStop Color="#EFF0F2"/>
              </LinearGradientBrush>
            </Border.Background>
          </Border>
          <Border x:Name="grid2" Visibility="Visible" Opacity="1" Grid.RowSpan="3" RenderTransformOrigin="0.5,0.5" BorderBrush="#F35150" BorderThickness="1" CornerRadius="8">
            <Border.RenderTransform>
              <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform/>
                <TranslateTransform/>
              </TransformGroup>
            </Border.RenderTransform>
            <Border.Background>
              <LinearGradientBrush EndPoint="1,1" MappingMode="RelativeToBoundingBox" StartPoint="0,0">
                <GradientStop Color="#EFF0F2" Offset="0.75"/>
                <GradientStop Color="#EFF0F2" Offset="0.25"/>
                <GradientStop Color="#EFF0F2" Offset="1"/>
                <GradientStop Color="#EFF0F2"/>
              </LinearGradientBrush>
            </Border.Background>
          </Border>
          <TextBlock  Margin="38 0 38 0" Grid.Row="1" FontSize="16" Foreground="#64676d" x:Name="tb" Text="{Binding Message,RelativeSource={RelativeSource AncestorType=Window},FallbackValue=失败信息}" TextWrapping="Wrap" MinWidth="200" VerticalAlignment="Center" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5" MaxWidth="600" TextAlignment="Center" FontFamily="Microsoft YaHei">
            <TextBlock.RenderTransform>
              <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform/>
                <TranslateTransform/>
              </TransformGroup>
            </TextBlock.RenderTransform></TextBlock>
        </Grid>
      </Grid>
    </Border>
  </Grid>

进入和退出的动画控制：

<Storyboard x:Key="ShowSb" Completed="Storyboard_Completed">
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="grid1">
        <EasingDoubleKeyFrame KeyTime="0" Value="{Binding YOffSet}"/>
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3.5" Value="{Binding YOffSet}"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="grid2">
        <EasingDoubleKeyFrame KeyTime="0" Value="{Binding YOffSet}"/>
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3.5" Value="{Binding YOffSet}"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="tb">
        <EasingDoubleKeyFrame KeyTime="0" Value="{Binding YOffSet}"/>
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3.5" Value="{Binding YOffSet}"/>
      </DoubleAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Key="MouseLeave" Completed="Storyboard_Completed">
      <DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="grid1">
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="grid2">
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="tb">
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="grid1">
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="{Binding YOffSet}"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="grid2">
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="{Binding YOffSet}"/>
      </DoubleAnimationUsingKeyFrames>
      <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="tb">
        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="{Binding YOffSet}"/>
      </DoubleAnimationUsingKeyFrames>
    </Storyboard>

注意：鼠标移动上去停止动画和移出后快速消失的代码为：

<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseEnter">
<ei:ControlStoryboardAction Storyboard="{StaticResource ShowSb}" ControlStoryboardOption="Stop"/>
</i:EventTrigger>
<i:EventTrigger EventName="MouseLeave">
<ei:ControlStoryboardAction Storyboard="{StaticResource MouseLeave}"/>
</i:EventTrigger>
</i:Interaction.Triggers>

后台代码逻辑：

private bool iserror = false;
public void Show(string messageBoxText, bool iserror = false)
{
this.iserror = iserror;
this.Message = messageBoxText;
this.Show();
}
public OnlyShowMessageBox()
{
InitializeComponent();
this.DataContext = new model() { YOffSet = -300d };
this.Loaded += (y, k) =>
{
this.Top = 41;
this.Left = (SystemParameters.WorkArea.Width) / 2 - this.ActualWidth / 2;
if (iserror)
{
this.grid.Visibility = Visibility.Collapsed;
}
else { this.grid.Visibility = Visibility.Collapsed; }
(this.Resources["ShowSb"] as Storyboard).Begin();
};
}
private void Storyboard_Completed(object sender, EventArgs e)
{
this.Close();
}

其中：

public class model : ModelBase
{
private double YOffset;
public double YOffSet
{
get { return YOffset; }
set
{
YOffset = value;
RaisePropertyChangedEvent("YOffSet");
}
}
}

其中ModelBase在可分组的选择框控件(MVVM下)(Toggle样式仿造单选框RadioButton，复选框CheckBox功能) 中有介绍。

最后，调用方法：

new OnlyShowMessageBox().Show("请注意：前方高能，禁止入内！", false);

或者

new OnlyShowMessageBox().Show("不存在此对象！", true);

以上所述是小编给大家介绍的WPF自动隐藏的消息框的全部叙述，希望对大家有所帮助，如果大家想了解更多内容敬请关注我们！

WPF弹出带蒙板的消息框

先看看效果图思路拿到父级窗体的内容,放入一个容器里,再在容器里放入一个半透明层.将整个容器赋给父级窗体的内容. 关闭时反向操作. 代码消息窗弹出时 /// <summary> /// 弹出消息框 /// </summary> /// <param name="message">消息</param> /// <param name="owner">父级窗体</param> public st
Extjs4 消息框去掉关闭按钮(类似Ext.Msg.alert)

效果如图,类似 Ext.Msg.alert(); 但没有关闭按钮由于Extjs4消息框中的关闭按钮,没有执行回调函数,点击关闭按钮后,直接关闭窗口. 实现代码如下: 复制代码代码如下: Ext.Msg.show({ title : '系统提示', msg : 'Extjs4 去掉提示框右上角关闭按钮', buttons: Ext.Msg.OK, fn: showResult, closable: false });
ASP.NET中弹出消息框的几种常见方法

本文实例讲述了ASP.NET中弹出消息框的几种常见方法.分享给大家供大家参考.具体分析如下: 在ASP.NET网站开发中,经常需要使用到alert消息框,尤其是在提交网页的时候,往往需要在服务器端对数据进行检验,并给出提示或警告. 这里,仅介绍几种不同的实现方法. 1.众所周知的方法是采用如下代码来实现: 复制代码代码如下: Response.Write("<script>alert('弹出的消息')</script>"); 不可否认,这种方法是最常用,也是最
c++中的消息框messagebox()详细介绍及使用方法

1.MessageBox("这是一个最简单的消息框!"); 2.MessageBox("这是一个有标题的消息框!","标题"); 3.MessageBox("这是一个确定取消的消息框!","标题", MB_OKCANCEL ); 4.MessageBox("这是一个警告的消息框!","标题", MB_ICONEXCLAMATION ); 5.MessageBox(&
基于jQuery的message插件实现右下角弹出消息框

1.$.messager.lays(width, height); 该方法主要用来定义弹出窗口的宽度和高度. 2.$.messager.anim(type,speed); 该方法主要定义窗口以什么样的方式和速度呈现. $.messager.anim("fade",1000); //以fadeIn的动画方式显示 $.messager.anim("show",1000); //以show的动画方式显示 3.$.messager.show(title,text,time)
C#实现客户端弹出消息框封装类实例

本文实例讲述了C#实现客户端弹出消息框封装类.分享给大家供大家参考.具体如下: asp.net在服务器端运行,是不能在服务器端弹出对话框的,但是C#可以通过在页面输出JS代码实现弹出消息框的效果,这个C#类封装了常用的消息框弹出JS代码,可以在服务器端调用,在客户端显示对话框.不但可以显示JS的警告框,还可以显示模式窗口,非常方便. using System; using System.Web; using System.Web.UI; using System.Web.UI.WebContro
用vbscript实现在消息框中显示一个超链接

问: 嗨,Scripting Guy!可以在消息框中包含指向某个 Web 页面的超链接吗? -- CB 答: 嗨,CB.听起来您好像想要向用户显示一个消息框,并且希望在消息框中包含一个超链接,以便用户可以点击这个链接,从而获得更多信息.例如,假设某个用户试图访问一些资源,但被拒绝了.这种情况下,您可以弹出一个消息框,告诉用户访问被拒绝,然后向他们提供一个链接,这个链接指向的页面会告诉用户访问所需的权限.一般说来,这种办法会比简单地说"访问被拒绝"好得多. 那么,是否可以用脚本编写语言实
基于.Net实现前端对话框和消息框

关于前端对话框.消息框的优秀插件多不胜数.造轮子是为了更好的使用轮子,并不是说自己造的轮子肯定好.所以,这个博客系统基本上都是自己实现的,包括日志记录.响应式布局等等一些本可以使用插件的.好了,废话不多时.我们来实现自己的对话框和消息框. 对话框要求:可拖动.点击按钮后可回调画一个简单的模型框 <div class="hi-dialog-box clearfix"> <div class="hi-dialog-title">系统提示<
.net 弹出消息框后导致页面样式变乱解决方法

点击按钮,执行提交操作,弹出消息框后,页面的样式变乱,解决方法: 首先,确定使用的css样式正确,页面中的宽高值保持规范统一: 然后,弹出框避免使用Response.Write(),如下所示复制代码代码如下: Response.Write("<script language=javascript>"); Response.Write("window.alert('"); Response.Write("计划添加失败!"); Res
JQuery的Alert消息框插件使用介绍

下载JS文件引用到page中,如下代码: 复制代码代码如下:  <script src="/path/to/jquery.js" type="text/javascript"></script> <script src="/path/to/jquery.ui.draggable.js" type="text/javascript">&l

WPF自动隐藏的消息框的实例代码

相关推荐

随机推荐