zoukankan      html  css  js  c++  java
  • UWP 圆角TextBox和PassWord框

    最近在做一个UWP项目,登录的用户和密码框需要圆角的,由于UWP的TextBlock 和PasswordBox是没有CornerRadius属性的,于是我就使用了一个Border嵌套在最外层,设置其他CornerRadius="20"

    实现代码如下:

                           <!--账号-->
                            <Border Background="#FFFFFF" CornerRadius="20">
                                <RelativePanel Margin="10,0,0,0" Padding="5">
                                    <TextBlock  x:Name="tbNumber" Text="账号:" RelativePanel.AlignVerticalCenterWithPanel="True" />
                                    <TextBox x:Name="txtUserName" FontSize="16"  RelativePanel.RightOf="tbNumber" PlaceholderText="请输入GW号/手机号"
                                             RelativePanel.AlignRightWithPanel="True" 
                                             RelativePanel.AlignHorizontalCenterWithPanel="True"
                                             RelativePanel.AlignVerticalCenterWithPanel="True"
                                             Margin="0,5,0,0" 
                                             BorderThickness="0"
                                             InputScope="NameOrPhoneNumber"/>
                                </RelativePanel>
                            </Border>
                            <!--密码-->
                            <Border Background="#FFFFFF" CornerRadius="20" Margin="0,20,0,0">
                                <RelativePanel Margin="10,0,0,0" Padding="5">
                                    <TextBlock  x:Name="tbPwd" Text="密码:" RelativePanel.AlignVerticalCenterWithPanel="True" />
                                    <PasswordBox x:Name="txtPwd" RelativePanel.RightOf="tbPwd" PlaceholderText="请输入密码"
                                                 RelativePanel.AlignRightWithPanel="True" IsEnabled="True"
                                                 BorderThickness="0" 
                                                 RelativePanel.AlignHorizontalCenterWithPanel="True"
                                                 RelativePanel.AlignVerticalCenterWithPanel="True"
                                                 Margin="0,5,0,0"/>
                                </RelativePanel>
                            </Border>

    效果图如下:

     UWP小白一个,欢迎指教!!

  • 相关阅读:
    DHCP工作过程
    园区网——网络架构
    ARP协议
    网络拓扑结构设计+网络设备简介
    Linux- 常用命令
    Linux-FTP
    【noip2018】【luogu5021】赛道修建
    【noip2018】【luogu5024】保卫王国
    【codeforces】【Round#523D】TV shows
    【bzoj4810】【ynoi2018】由乃的玉米田
  • 原文地址:https://www.cnblogs.com/qq-smile/p/7272295.html
Copyright © 2011-2022 走看看