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

默认输入框:

这个输入框不好看,并且在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. qt中moc的作用

    Qt 将源代码交给标准 C++ 编译器,如 gcc 之前,需要事先将这些扩展的语法去除掉.完成这一操作的就是 moc. moc 全称是 Meta-Object Compiler,也就是"元对 ...

  2. JavaScript八张思维导图—编程实践

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

  3. Linux 安装及配置 Nginx + ftp 服务器

    Nginx 安装及配置 一.Nginx 简介: Nginx("engine x") 是一款是由俄罗斯的程序设计师 Igor Sysoev 所开发高性能的 Web和 反向代理服务器, ...

  4. 邓_phpcms_数据库

    phpcms v9 数据表结构 在线版 PHPCMS V9 数据结构 (2010-12-28) 表 1 : v9_admin 管理员表 字段 类型 Null 默认 额外 注释 userid mediu ...

  5. vue中组件之间的相互调用,及通用后台管理系统左侧菜单树的迭代生成

    由于本人近期开始学习使用vue搭建一个后端管理系统的前端项目,在左侧生成菜单树的时候遇到了一些问题.在这里记录下 分析:由于本人设定的菜单可以使多级结构,直接使用vue的v-for 遍历并不是很方便. ...

  6. I like NetWorld

    liangfengbo.com ibobobo.com https.net.cn bobobo.com.cn scode.net scode.cc liangbolin.com linhe.cc li ...

  7. python3 第九章 - 数据类型之Number(数字)

    Python 支持三种不同的数字类型: 整型(Int) - 通常被称为是整型或整数,是正或负整数,不带小数点.Python3 整型是没有限制大小的,可以当作 Long 类型使用,所以 Python3 ...

  8. scrapy-redis功能简介

    connection:连接redis最基本文件 default:默认值设置文件 dupefiler_key 保存指纹 dupefilter:替换scrapy默认的url去重器 piklecompat: ...

  9. 模态框zeroModal快速引入

    最基本快速接入 <%@ page language="java" contentType="text/html; charset=UTF-8" pageE ...

  10. Long转Date/页面自定义标签

    运行时发现异常:org.apache.jasper.JasperException: javax.el.ELException: java.lang.IllegalArgumentException: ...