今天打算来做一个圆角的输入框

默认输入框:

这个输入框不好看,并且在XP 跟 WIN 7  WIN10 效果 都不太一样

我们今天不用模板的方式,而是 最简单的方式 来实现 圆角 输入框;

----------------------------------------------------方案1:XAML 拼凑方案----------------------------------------------------

<Border  HorizontalAlignment="Center" VerticalAlignment="Center" Width="100" BorderThickness="1" BorderBrush="#C8C8C8" CornerRadius="5">
<TextBox Margin="2"  BorderThickness="0"></TextBox>
</Border>

效果

第一步骤,

在输入框外层 加了一个Border。CornerRadius是圆角值为5.BorderThickness(边框线条粗细)="1"   BorderBrush(边框色)="#C8C8C8"

第二步骤,

输入框 去掉BorderThickness,增加Margin 属性,如果没有Margin属性,效果会是这样

解决方案,

1.将输入框背景色改为透明。 Background="{x:Null}"    (需要给border添加一个背景色)

2.用 margin 增加输入框与border的距离 Margin="2" (这个会造成输入框大小被撑大)

最终效果:

最终源码:

<Grid>
<Border HorizontalAlignment="Center" VerticalAlignment="Center" MinWidth="150" BorderThickness="1" BorderBrush="#888888" CornerRadius="5">
<TextBox Text="WPF UI 真漂亮 944095635" Foreground="#888888" Padding="3" BorderThickness="0" Background="{x:Null}"/>
</Border>
</Grid>

  

----------------------------------------------------方案2:TextBox 模板----------------------------------------------------

待续....

WPF 圆角输入框的更多相关文章

  1. Swingr的JTextField、JPasswordField设置圆角输入框

    方法1:定义Border,然后给JTextField设置即可 摘自并整理:https://blog.csdn.net/u012093968/article/details/39316679 最好添加这 ...

  2. WPF 圆角textbox

    原文:WPF 圆角textbox 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/a771948524/article/details/9245965 ...

  3. WPF数字输入框和IP地址输入框

    数字输入框 简介 在业务中,我们经常需要限制用户的输入,比如限制输入长度,限制只能输入数字等等.限制输入长度WPF内置的TextBox已经帮我们解决了,但是限制输入数字却并未在WPF中内置解决方案.使 ...

  4. Android 之 Shape (圆角输入框)

    1 简介 本文主要介绍通过 shape 来设置 EditText 的圆角.   2 shape 的设置   shape_life_search.xml 放在 res/drawable 文件夹内 < ...

  5. WPF圆角按钮例程

    <Window x:Class="WpfApp3.MainWindow" xmlns="http://schemas.microsoft.com/winfx/200 ...

  6. wpf 圆角TextBox 样式

    <Style x:Key="RoundCornerTextStyle" TargetType="{x:Type TextBox}"> <Set ...

  7. WPF圆角按钮与触发颜色变化

    <Button x:Name="button1" Content="按钮1" Margin="10,10,0,0" Cursor=&q ...

  8. Android 圆角输入框

        draweable文件下建立一个名字为shape的XML文件:   <shape xmlns:android="http://schemas.android.com/apk/r ...

  9. WPF圆角按钮

    <ControlTemplate x:Key="CornerButton" TargetType="{x:Type Button}"> <Bo ...

随机推荐

  1. 免费V P N获取方式。

    给需要加速器链接国外网站的朋友, 打开网址:http://miaoaff.com/reg.php?id=204250: 用一个邮箱注册,就会得到一个免费的vpn软件账号(包含300M流量时间永久): ...

  2. md5加密以及可逆的加密解密算法

    md5加密 package gov.mof.fasp2.gcfr.adjustoffset.adjust; import java.security.MessageDigest; public cla ...

  3. node学习笔记1——require参数查找策略

    require参数类型 http.fs.path等,原生模块 ./mod或../mod,相对路径的文件模块 /pathtomodule/mod,绝对路径的文件模块 mod,非原生模块的文件模块 mo ...

  4. vuex的使用

    vue现在越来越火,不单单可以写简单的小项目,也可以写大中型的项目.但是项目大了,项目之间的数据传递就会变得复杂,那么问题来了?在一个大型项目中,多个组件要公用同一个或多个数据,我们如何保证每个组件获 ...

  5. vue2.0集成百度UE编辑器,上传图片报错!!!

    我这边配置进去之后,界面加载,文本输入都没有问题,就是上传图片会有问题 这张图, 左边红色框框 就是目录结构咯, 右边红色框框 就是各种网上教程给出的第一个路径配置对吧, 下面的就是绿色 服务器接口配 ...

  6. dedecms_插件

    ../dede/adbaoming.php../dede/baoming_edit.php../dede/templets/baoming_main.htm

  7. 使用Flink的SavePoint功能

    Flink通过SavePoint功能可以做到程序升级后,继续从升级前的那个点开始执行计算,保证数据不中断. Flink中CheckPoint用于保存状态,是自动执行的,SavePoint是指向Chec ...

  8. Nodejs+Grunt配置SASS项目自动编译

    Nodejs+Grunt配置SASS项目自动编译 早前听说Nodejs和Grunt很强大,特别是用来构建自动化的前端开发,更是强大无比.但一直碍于自己掌握的技术有限,不敢深入,也未曾深入下去.最近在开 ...

  9. MyBatis的关于批量数据操作的测试

    摘录自:http://www.linuxidc.com/Linux/2012-05/60863.htm MyBatis的前身就是著名的Ibatis,不知何故脱离了Apache改名为MyBatis.My ...

  10. 详解python中的__init__与__new__方法

    一.__init__和__new__方法执行的顺序? 在面向对象中介绍了关于对象创建的过程,我们知道__new__方法先于__init__方法执行. 二.__new__方法是什么? 首先,我们先来看下 ...