WPF定制的TextBox(WPF customized TextBox)

2019-10-19 03:06发布

我有一个名为“txtAddress”自定义文本框包含ImageTextBox
我需要能够访问其内容: txtAddress.Text txtAddress.Image
我已经绑定了inner textBox.textTemplate.Textinner rect.FillTemplate.Background (我用矩形现在,我将其更改为图像)

当我运行该程序,编辑文本框中一切看起来像它的工作方式和文字是变化的,但是当我使用它的代码txtAddress.Text仍然是“我的电脑”,这是文本框的初始值 。 我知道,因为我没有把<ContentPresenter>某处的风格,但我应该在哪里把控制(图像,文本框),像ListView中有<DataTemplate>在这里我们添加控件

TxtAddress风格:

<Style x:Key="TextBoxAddressStyle" BasedOn="{x:Null}" TargetType="{x:Type TextBox}">
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
        <Setter Property="BorderBrush" Value="{StaticResource TextBoxBorder}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="AllowDrop" Value="true"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
        <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TextBox}">
                    <Grid HorizontalAlignment="Stretch" Height="Auto" VerticalAlignment="Stretch" Width="Auto">
                        <Rectangle Height="Auto" Stroke="{TemplateBinding Foreground}" VerticalAlignment="Stretch" RadiusY="11" RadiusX="11" Margin="0" Fill="{TemplateBinding OpacityMask}"/>
                        <!--<ContentPresenter Height="Auto" Margin="31,2,7.458,2"/>-->
                        <TextBox x:Name="TxtAddress" Height="Auto" Margin="31,2,7.458,2" VerticalAlignment="Stretch" MaxLines="1" Text="{TemplateBinding Text}" AcceptsTab="True" Style="{DynamicResource TextBoxStyle2}" SelectionBrush="#C859003D" FontSize="{TemplateBinding FontSize}" AcceptsReturn="False"/>
                        <Rectangle Fill="#5AFFFFFF" HorizontalAlignment="Stretch" Height="6.375" Margin="6,2.25,6,0" RadiusY="6" RadiusX="6" Stroke="{x:Null}" VerticalAlignment="Top" Width="Auto" d:IsLocked="True"/>
                        <Rectangle x:Name="ImgAddress" Fill="{TemplateBinding Background}" HorizontalAlignment="Left" Height="24" Margin="7,1,0,0" RadiusY="0" RadiusX="0" VerticalAlignment="Top" Width="24" StrokeThickness="0">
                            <Rectangle.Stroke>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="Black" Offset="1"/>
                                    <GradientStop Color="White"/>
                                </LinearGradientBrush>
                            </Rectangle.Stroke>
                        </Rectangle>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <MultiTrigger>
                <MultiTrigger.Conditions>
                    <Condition Property="IsInactiveSelectionHighlightEnabled" Value="true"/>
                    <Condition Property="IsSelectionActive" Value="false"/>
                </MultiTrigger.Conditions>
                <Setter Property="SelectionBrush" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
            </MultiTrigger>
        </Style.Triggers>
    </Style>

内蒙古文本框样式:

<Style x:Key="TextBoxStyle2" BasedOn="{x:Null}" TargetType="{x:Type TextBox}">
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
        <Setter Property="BorderBrush" Value="{StaticResource TextBoxBorder}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="AllowDrop" Value="true"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
        <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TextBox}">
                    <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" FontSize="13.333" PanningMode="HorizontalOnly"/>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <MultiTrigger>
                <MultiTrigger.Conditions>
                    <Condition Property="IsInactiveSelectionHighlightEnabled" Value="true"/>
                    <Condition Property="IsSelectionActive" Value="false"/>
                </MultiTrigger.Conditions>
                <Setter Property="SelectionBrush" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
            </MultiTrigger>
        </Style.Triggers>
    </Style>

TxtAddress:

 <TextBox x:Name="txtAddress" Margin="34,5,32,0" TextWrapping="Wrap" Text="My Computer" Style="{DynamicResource TextBoxAddressStyle}" Height="25" VerticalAlignment="Top" FontWeight="Bold" MinHeight="25" MaxHeight="25">
            <TextBox.Background>
                <ImageBrush ImageSource="BtnImg/computer.png" Stretch="None"/>
            </TextBox.Background>
            <TextBox.Foreground>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF779198" Offset="0.1"/>
                    <GradientStop Color="#FF789399" Offset="0.93"/>
                    <GradientStop Color="#FFBFD3D7" Offset="0.513"/>
                    <GradientStop Color="#FF343E41" Offset="1"/>
                    <GradientStop Color="#FF5C6E73"/>
                </LinearGradientBrush>
            </TextBox.Foreground>
            <TextBox.OpacityMask>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF94B5BD" Offset="0.1"/>
                    <GradientStop Color="#FF94B5BD" Offset="0.93"/>
                    <GradientStop Color="#FFE7FBFF" Offset="0.513"/>
                    <GradientStop Color="#FF7B9399" Offset="1"/>
                    <GradientStop Color="#FF7B9399"/>
                </LinearGradientBrush>
            </TextBox.OpacityMask>
        </TextBox>

提前致谢。

Answer 1:

你把一个TextBox模板的另一个内部TextBox

视觉树看起来就像这样:

TextBox
   Grid
      Rectangle 
      TextBox
      Rectangle 
      Rectangle

这是不是在首位的理想,但如果你想保持这样的事情,只要确保你绑定内文本框的Text属性外一个,通过Two WayUpdateSourceTrigger=PropertyChanged数据绑定,如下所示:

<TextBox x:Name="TxtAddress" Text="{Binding Text, 
                                            Mode=TwoWay, 
                                            UpdateSourceTrigger=PropertyChanged,  
                                            RelativeSource={RelativeSource AncestorType={x:Type TextBox}}}" ... />

除了这一切,我已经多次提到,你不应该被操纵在WPF程序代码UI元素。

相反,创建一个适当的视图模型来存储你的数据:

public class MyViewModel
{
    public string Text {get;set;}
}

然后使用数据绑定到你的文本框绑定到数据:

<TextBox Text="{Binding Text}"/>

每当你需要检索值,检索来自VM的值,而不是用户界面。



文章来源: WPF customized TextBox
标签: wpf xaml textbox