------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥-------------

简述:

  手工以原生Grid的方式,自定义了一个仿弹窗效果,优点可以自定义,缺点需要自己实现以及维护整个弹窗的效果

效果图:

  

思路:

  直接画好页面,控制它的展示消失即可

代码:

  1.xaml的弹框,下面的按钮是自定义的样式

<!--确认xlsx的模态框自定义ConfirmedModalBox-->
<Border x:Name="incConfirmedModalBox" Grid.Column="" Margin="-160,-80,30,10" Width="" Height="" BorderBrush="#000" BorderThickness="" Background="White" Visibility="Collapsed">
<!--Margin="6,6,6,6"-->
<Grid Width="" Height="" Background="White" >
<Grid.RowDefinitions>
<RowDefinition Height=""/>
<RowDefinition />
<RowDefinition Height=""/>
</Grid.RowDefinitions>
<Grid Grid.Row="">
<!-- Background="Aqua"-->
<TextBlock Margin="30,15,0,0">请确认</TextBlock>
</Grid>
<Grid Grid.Row="">
<Grid >
<ScrollViewer Margin="30,0,0,0" VerticalScrollBarVisibility="Auto" >
<!--VerticalScrollBarVisibility="Auto"-->
<StackPanel Margin="0,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Stretch" x:Name="incModalStackPane1" >
<!--<Grid Width="" Height="">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="" Margin="0 5">test1.inc</TextBlock>
<TextBlock Grid.Column="" Margin="0 5">-- ::</TextBlock>
</Grid>
<Grid Width="" Height="">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="" Margin="0 5">test1.inc</TextBlock>
<TextBlock Grid.Column="" Margin="0 5">-- ::</TextBlock>
</Grid>-->
</StackPanel>
</ScrollViewer>
</Grid>
</Grid>
<Grid Grid.Row="">
<!-- Background="Aqua"-->
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Grid.Column="" Style="{StaticResource ButtonStyle}" x:Name="incModalConfirm" Content="确定" HorizontalAlignment="Left" Margin="95,15,0,0" VerticalAlignment="Top" Width="" Height="" PreviewMouseLeftButtonUp="incModalConfirm_PreviewMouseLeftButtonUp">
<Button.Template>
<ControlTemplate TargetType="{x:Type Button}">
<Border BorderBrush="{TemplateBinding Control.BorderBrush}" BorderThickness="" CornerRadius="6,6,6,6" Name="PART_Background">
<Border.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FF006BB9" />
<GradientStop Color="#006AB9" />
</LinearGradientBrush>
</Border.Background>
<ContentPresenter Content="{TemplateBinding ContentControl.Content}" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
</ControlTemplate>
</Button.Template>
</Button>
<Button Grid.Column="" Style="{StaticResource ButtonStyle}" x:Name="incModalCancel" Content="取消" HorizontalAlignment="Left" Margin="30,15,0,0" VerticalAlignment="Top" Width="" Height="" PreviewMouseLeftButtonUp="incModalCancel_PreviewMouseLeftButtonUp">
<Button.Template>
<ControlTemplate TargetType="{x:Type Button}">
<Border BorderBrush="{TemplateBinding Control.BorderBrush}" BorderThickness="" CornerRadius="6,6,6,6" Name="PART_Background">
<Border.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FF006BB9" />
<GradientStop Color="#006AB9" />
</LinearGradientBrush> </Border.Background>
<ContentPresenter Content="{TemplateBinding ContentControl.Content}" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
</Grid>
</Border>

xaml

  2.cs后端的控制

 incConfirmedModalBox.Visibility = Visibility.Visible;

  3.业务代码就不做展示了,就是把此控件放到xaml末尾,根据Grid布局定位到页面中间,控制它展示隐藏即可,他们确定取消按钮正常调用后台逻辑代码即可,调用完成之后将incConfirmeDModalBox隐藏,维护关联逻辑

备注:

  本来这块想要讲很多的,但是涉及到没有准备现成的Demo,之前编写的业务不便公开,草草收尾了,下次重新补上一份

WPF 如何自定义一个弹框的更多相关文章

  1. JavaScript实现自定义alert弹框

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAh0AAAFkCAYAAACEpYlzAAAfj0lEQVR4nO3dC5BddZ0n8F93pxOQCO

  2. CodePush自定义更新弹框及下载进度条

    CodePush 热更新之自定义更新弹框及下载进度 先来几张弹框效果图 非强制更新场景 image 强制更新场景 image 更新包下载进度效果 image 核心代码 这里的热更新Modal框,是封装 ...

  3. 自定义 popWindow弹框 工具包

    前言:因为Android 没有像IOS一样的ActionSheet,虽然在github上看到有一些类似ActionSheet的库,总觉得不好用,不如自己写一个弹框通用类,样式全部自已来多好. Step ...

  4. swift4.2 - 一个自定义view弹框

    import UIKit /* * 注册协议view:没找到 UI原图,咱不实现 */ class JYRegisterProtocolView: UIView { /// 点击同意协议的回调 pri ...

  5. [WPF 自定义控件]自定义一个“传统”的 Validation.ErrorTemplate

    1. 什么是Validaion.ErrorTemplate 数据绑定模型允许您将与您Binding的对象相关联ValidationRules. 如果用户输入的值无效,你可能希望在应用程序 用户界面 ( ...

  6. 自定义alert弹框,title不显示域名

    问题: 系统默认的alert弹框的title会默认显示网页域名 解决办法: (修改弹框样式) (function() { window.alert = function(name) { $(" ...

  7. 编写WPF程序,完成弹框打印和直接打印

    弹框打印 PrintDialog pd = new PrintDialog(); pd.ShowDialog(); //↓第一个参数是StackPanel控件里面放一个label放打印的文字 pd.P ...

  8. 自定义alert弹框,title不显示域名(重写alert)

    问题: 系统默认的alert弹框的title会默认显示网页域名 解决办法: (修改弹框样式) (function() { window.alert = function(name) { $(" ...

  9. vue+elementui 新增和编辑如何实现共用一个弹框

    //html代码: //按钮 <el-button type="primary" size="medium" @click="addEquipm ...

随机推荐

  1. [Python WEB开发] 使用WSGI开发类Flask框架 (二)

    WSGI     Web服务器网关接口 WSGI主要规定了Web服务器如何与Web应用程序进行通信,以及如何将Web应用程序链接在一起来处理一个请求. wsgiref Python中的WSGI参考模块 ...

  2. Linux 启动进程结束进程通用代码

    linux启动springboot项目 start.sh #!/bin/sh rm -f tpid nohup java -jar restDate--SNAPSHOT.jar --spring.pr ...

  3. 【luogu P2827 蚯蚓】 题解

    题目链接:https://www.luogu.org/problemnew/show/P2827 35分:暴力sortO(mnlogn). 80分:考虑到每次不好维护不被切的点+q,正难则反.改成维护 ...

  4. 鼠标不能用怎么办 USB OPTICAL MOUSE

    刚买的新鼠标,一般鼠标插上去自动安装驱动,然后就可以正常使用了. 如果遇到下面这种情况:"usb optical mouse 找不到驱动程序" 插上以后死活都没作用,然后开始下载一 ...

  5. SpringMVC找不到对应的页面

    确认springmvc配置文件视图解析器配置正确. <!-- 视图解析器 --> <bean class="org.springframework.web.servlet. ...

  6. SaltStack 自动化工具

    1.服务端安装master: # yum -y install salt-master # yum -y install salt-minion 2.客户端安装minion: # yum -y ins ...

  7. Oracle 使用RMAN进行备份

    备份理论和基本语法 备份概念 执行备份或还原草的数据库称为目标.在一些环境下,有许多数据库,因此有许多RMAN目标.应一次连接每个数据库.目标的每个备份都有一些属性: 打开或关闭 完整或部分 完整或增 ...

  8. duplicate symbol _OBJC_IVAR

    duplicate symbol _OBJC_IVAR - Kingdev - 博客园 代码合并问题 git合并提示冲突文件为project.pbxproj,先去掉所有冲突提示<<< ...

  9. 用Google Cloud Plateform使用ansible创建新实例

    谷歌大法好,退aws保平安 ---假设自己现在有一个电脑(本机),先用谷歌云创一个服务器(主机) ,再通过ansible在谷歌云上创建一个服务器(节点)并进行控制 先把自己的公钥加到元数据里面,在go ...

  10. 追溯了解Ubuntu之安装操作步骤(贰)

    1.首先从官网中下载32位或64位安装程序: 2.下载安装包后不需要解压:直接双击即可:在里面可以看到wubi.exe应用程序,双击打开: 如果之前已经安装过需要卸载重新安装: 3.目标驱动器是安装的 ...