WPF-自定义计算文本数量输入框

是这个韬呀

于 2023-12-26 16:12:00 发布

阅读量356

点赞数 7

分类专栏： WPF 文章标签： wpf

本文链接：https://blog.csdn.net/qq_37875849/article/details/135224610

版权

WPF 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

效果图

1.创建TextBoxHasCountStyle.xaml

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfApp1">
    <Style TargetType="{x:Type local:TextBoxHasCount}">
        <!--  公共资源  -->
        <Style.Resources>
            <SolidColorBrush x:Key="TextBoxHasCount.Static.Border" Color="#FFABAdB3" />
            <SolidColorBrush x:Key="TextBoxHasCount.MouseOver.Border" Color="#FF7EB4EA" />
            <SolidColorBrush x:Key="TextBoxHasCount.Focus.Border" Color="#FF569DE5" />
        </Style.Resources>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:TextBoxHasCount}">
                    <!--  外边框  -->
                    <Border
                        Name="PART_Border"
                        Width="{TemplateBinding Width}"
                        Height="{TemplateBinding Height}"
                        MinWidth="150"
                        MinHeight="25"
                        Background="Transparent"
                        BorderBrush="{StaticResource TextBoxHasCount.Static.Border}"
                        BorderThickness="0.5">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <!--  文本输入框  -->
                            <TextBox
                                Grid.Row="0"
                                Grid.Column="0"
                                Height="{TemplateBinding Height}"
                                VerticalAlignment="Center"
                                FontSize="14"
                                MaxLength="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=MaxCount, Mode=OneTime}"
                                Text="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Text, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
                                <TextBox.Style>
                                    <Style TargetType="TextBox">
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="{x:Type TextBox}">
                                                    <ScrollViewer
                                                        x:Name="PART_ContentHost"
                                                        HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                                                        VerticalAlignment="{TemplateBinding VerticalAlignment}"
                                                        Focusable="false"
                                                        HorizontalScrollBarVisibility="Hidden"
                                                        VerticalScrollBarVisibility="Hidden" />
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </TextBox.Style>
                            </TextBox>
                            <!--  计算文本数量框  -->
                            <Border
                                Grid.Row="0"
                                Grid.Column="1"
                                Width="50"
                                Height="{TemplateBinding Height}"
                                Padding="5,0,5,0"
                                Background="{StaticResource TextBoxHasCount.Static.Border}">
                                <TextBlock
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    Block.TextAlignment="Center">
                                    <TextBlock.Text>
                                        <MultiBinding StringFormat="{}{0}/{1}">
                                            <Binding
                                                Mode="OneWay"
                                                Path="CurrentCount"
                                                RelativeSource="{RelativeSource Mode=TemplatedParent}" />
                                            <Binding
                                                Mode="OneTime"
                                                Path="MaxCount"
                                                RelativeSource="{RelativeSource Mode=TemplatedParent}" />
                                        </MultiBinding>
                                    </TextBlock.Text>
                                </TextBlock>
                            </Border>
                        </Grid>
                    </Border>
                    <!--  触发器  -->
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter TargetName="PART_Border" Property="Opacity" Value="0.56" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="PART_Border" Property="BorderBrush" Value="{StaticResource TextBoxHasCount.MouseOver.Border}" />
                        </Trigger>
                        <Trigger Property="IsKeyboardFocused" Value="true">
                            <Setter TargetName="PART_Border" Property="BorderBrush" Value="{StaticResource TextBoxHasCount.Focus.Border}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

2.创建TextBoxHasCount.cs

using System.Windows;
using System.Windows.Controls;

namespace WpfApp1
{
    public class TextBoxHasCount : Control
    {
        public string Text
        {
            get { return (string)GetValue(TextProperty); }
            set { SetValue(TextProperty, value); }
        }
        public static readonly DependencyProperty TextProperty = DependencyProperty.Register(nameof(Text), typeof(string), typeof(TextBoxHasCount),
            new PropertyMetadata(string.Empty, (d, e) =>
        {
            //计算输入框数量
            var textBoxHasCount = (TextBoxHasCount)d;
            if (e.NewValue == null)
            {
                textBoxHasCount.CurrentCount = 0;
                return;
            }
            textBoxHasCount.CurrentCount = e.NewValue.ToString().Length;
        }));
        public int MaxCount
        {
            get { return (int)GetValue(MaxCountProperty); }
            set { SetValue(MaxCountProperty, value); }
        }
        public static readonly DependencyProperty MaxCountProperty =
            DependencyProperty.Register(nameof(MaxCount), typeof(int), typeof(TextBoxHasCount), new PropertyMetadata(10));
        public int CurrentCount
        {
            get { return (int)GetValue(CurrentCountProperty); }
            set { SetValue(CurrentCountProperty, value); }
        }
        public static readonly DependencyProperty CurrentCountProperty =
            DependencyProperty.Register(nameof(CurrentCount), typeof(int), typeof(TextBoxHasCount), new PropertyMetadata(0));
        static TextBoxHasCount()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(TextBoxHasCount), new FrameworkPropertyMetadata(typeof(TextBoxHasCount)));
        }
    }
}

注意：需要添加到样式库里面，代码不能照抄，更改为自己的项目

<Application
    x:Class="WpfApp1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfApp1"
    StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/WpfApp1;component/TextBoxHasCountStyle.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>