多行为文本框样式答案

【问题标题】：Multiple behaviors text box style多行为文本框样式
【发布时间】：2019-05-31 16:40:26
【问题描述】：

我想在样式中添加另一种行为而不覆盖现有行为

我有以下风格：

<Style TargetType="TextBox">
    <Setter Property="Background" Value="Red" />
    <Setter Property="i:Interaction.Behaviors">
        <Setter.Value>
            <i:BehaviorCollection>
                <Behaviors:TextBoxEnterKeyBehavior>                    
                    <Core:ChangePropertyAction PropertyName="IsEnabled"Value="False" />
                    <Core:ChangePropertyAction PropertyName="IsEnabled" Value="True" />
                </Behaviors:TextBoxEnterKeyBehavior>
            </i:BehaviorCollection>
        </Setter.Value>
    </Setter>
</Style>

我使用它来强制从文本框中移除焦点。但是，我必须在特定页面上添加另一个行为，但这样才能保留上述内容

【问题讨论】：

标签： c# xaml uwp template10

【解决方案1】：

您可以使用 Style 的 BasedOn 属性将其链接到默认文本框样式。所以，它只会替换默认模板中修改的属性，而不是覆盖它们。

<Style x:Key="FocusRemovalStyle" TargetType="TextBox" BasedOn="DefaultTextBoxStyle">
    <Setter Property="Background" Value="Red" />
    <Setter Property="i:Interaction.Behaviors">
        <Setter.Value>
            <i:BehaviorCollection>
                <Behaviors:TextBoxEnterKeyBehavior>                    
                    <Core:ChangePropertyAction PropertyName="IsEnabled"Value="False" />
                    <Core:ChangePropertyAction PropertyName="IsEnabled" Value="True" />
                </Behaviors:TextBoxEnterKeyBehavior>
            </i:BehaviorCollection>
        </Setter.Value>
    </Setter>
</Style>

//默认样式

<Style TargetType="TextBox" x:Key="DefaultTextBoxStyle">
        <Setter Property="Foreground" Value="{ThemeResource TextControlForeground}" />
        <Setter Property="Background" Value="{ThemeResource TextControlBackground}" />
        <Setter Property="BorderBrush" Value="{ThemeResource TextControlBorderBrush}" />
        <Setter Property="SelectionHighlightColor" Value="{ThemeResource TextControlSelectionHighlightColor}" />
        <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
        <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
        <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
        <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" />
        <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}" />
        <Setter Property="UseSystemFocusVisuals" Value="{ThemeResource IsApplicationFocusVisualKindReveal}" />
        <Setter Property="ContextFlyout" Value="{StaticResource TextControlCommandBarContextFlyout}" />
        <Setter Property="SelectionFlyout" Value="{StaticResource TextControlCommandBarSelectionFlyout}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TextBox">
                    <Grid>

                        <Grid.Resources>
                            <Style x:Name="DeleteButtonStyle" TargetType="Button">
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="Button">
                                            <Grid x:Name="ButtonLayoutGrid"
                                                BorderBrush="{ThemeResource TextControlButtonBorderBrush}"
                                                BorderThickness="{TemplateBinding BorderThickness}"
                                                Background="{ThemeResource TextControlButtonBackground}">

                                                <VisualStateManager.VisualStateGroups>
                                                    <VisualStateGroup x:Name="CommonStates">
                                                        <VisualState x:Name="Normal" />

                                                        <VisualState x:Name="PointerOver">
                                                            <Storyboard>
                                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonLayoutGrid" Storyboard.TargetProperty="Background">
                                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlButtonBackgroundPointerOver}" />
                                                                </ObjectAnimationUsingKeyFrames>
                                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonLayoutGrid" Storyboard.TargetProperty="BorderBrush">
                                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlButtonBorderBrushPointerOver}" />
                                                                </ObjectAnimationUsingKeyFrames>
                                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GlyphElement" Storyboard.TargetProperty="Foreground">
                                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlButtonForegroundPointerOver}" />
                                                                </ObjectAnimationUsingKeyFrames>
                                                            </Storyboard>
                                                        </VisualState>

                                                        <VisualState x:Name="Pressed">
                                                            <Storyboard>
                                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonLayoutGrid" Storyboard.TargetProperty="Background">
                                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlButtonBackgroundPressed}" />
                                                                </ObjectAnimationUsingKeyFrames>
                                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonLayoutGrid" Storyboard.TargetProperty="BorderBrush">
                                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlButtonBorderBrushPressed}" />
                                                                </ObjectAnimationUsingKeyFrames>
                                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GlyphElement" Storyboard.TargetProperty="Foreground">
                                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlButtonForegroundPressed}" />
                                                                </ObjectAnimationUsingKeyFrames>
                                                            </Storyboard>
                                                        </VisualState>

                                                        <VisualState x:Name="Disabled">
                                                            <Storyboard>
                                                                <DoubleAnimation Storyboard.TargetName="ButtonLayoutGrid"
                                                                    Storyboard.TargetProperty="Opacity"
                                                                    To="0"
                                                                    Duration="0" />
                                                            </Storyboard>
                                                        </VisualState>
                                                    </VisualStateGroup>
                                                </VisualStateManager.VisualStateGroups>
                                                <TextBlock x:Name="GlyphElement"
                                                    Foreground="{ThemeResource TextControlButtonForeground}"
                                                    VerticalAlignment="Center"
                                                    HorizontalAlignment="Center"
                                                    FontStyle="Normal"
                                                    FontSize="12"
                                                    Text="&#xE10A;"
                                                    FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                                    AutomationProperties.AccessibilityView="Raw" />
                                            </Grid>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </Grid.Resources>

                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal" />

                                <VisualState x:Name="Disabled">

                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlHeaderForegroundDisabled}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBackgroundDisabled}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBorderBrushDisabled}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForegroundDisabled}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundDisabled}}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>

                                <VisualState x:Name="PointerOver">

                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBorderBrushPointerOver}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBackgroundPointerOver}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundPointerOver}}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForegroundPointerOver}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Focused">

                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundFocused}}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBackgroundFocused}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBorderBrushFocused}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForegroundFocused}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="RequestedTheme">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Light" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>

                            </VisualStateGroup>
                            <VisualStateGroup x:Name="ButtonStates">
                                <VisualState x:Name="ButtonVisible">

                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DeleteButton" Storyboard.TargetProperty="Visibility">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="ButtonCollapsed" />

                            </VisualStateGroup>

                        </VisualStateManager.VisualStateGroups>

                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>

                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <ContentPresenter x:Name="HeaderContentPresenter"
                            Grid.Row="0"
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Content="{TemplateBinding Header}"
                            ContentTemplate="{TemplateBinding HeaderTemplate}"
                            FontWeight="Normal"
                            Foreground="{ThemeResource TextControlHeaderForeground}"
                            Margin="{StaticResource TextBoxTopHeaderMargin}"
                            TextWrapping="Wrap"
                            VerticalAlignment="Top"
                            Visibility="Collapsed"
                            x:DeferLoadStrategy="Lazy" />
                        <Border x:Name="BorderElement"
                            Grid.Row="1"
                            Grid.Column="0"
                            Grid.RowSpan="1"
                            Grid.ColumnSpan="2"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="{TemplateBinding CornerRadius}"
                            Control.IsTemplateFocusTarget="True"
                            MinWidth="{ThemeResource TextControlThemeMinWidth}"
                            MinHeight="{ThemeResource TextControlThemeMinHeight}" />
                        <ScrollViewer x:Name="ContentElement"
                            Grid.Row="1"
                            Grid.Column="0"
                            HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                            HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                            VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                            VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                            IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                            IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                            IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
                            Margin="{TemplateBinding BorderThickness}"
                            Padding="{TemplateBinding Padding}"
                            IsTabStop="False"
                            AutomationProperties.AccessibilityView="Raw"
                            ZoomMode="Disabled" />
                        <TextBlock x:Name="PlaceholderTextContentPresenter"
                            Grid.Row="1"
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Foreground="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForeground}}"
                            Margin="{TemplateBinding BorderThickness}"
                            Padding="{TemplateBinding Padding}"
                            Text="{TemplateBinding PlaceholderText}"
                            TextAlignment="{TemplateBinding TextAlignment}"
                            TextWrapping="{TemplateBinding TextWrapping}"
                            IsHitTestVisible="False" />
                        <Button x:Name="DeleteButton"
                            Grid.Row="1"
                            Grid.Column="1"
                            Style="{StaticResource DeleteButtonStyle}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Margin="{ThemeResource HelperButtonThemePadding}"
                            IsTabStop="False"
                            Visibility="Collapsed"
                            AutomationProperties.AccessibilityView="Raw"
                            FontSize="{TemplateBinding FontSize}"
                            MinWidth="34"
                            VerticalAlignment="Stretch" />
                        <ContentPresenter x:Name="DescriptionPresenter"
                            Grid.Row="2"
                            Grid.Column="0"
                            Grid.ColumnSpan="2"
                            Content="{TemplateBinding Description}"
                            Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}"
                            AutomationProperties.AccessibilityView="Raw"
                            x:Load="False"/>

                    </Grid>

                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

【讨论】：

【解决方案2】：

我完全按照你写的去做。可惜效果和以前一样。

当我向具有新行为的页面添加新样式时，之前的样式已被覆盖。

我在 custom.xaml 中的风格

 <Style TargetType="TextBox" BasedOn="{StaticResource DefaultTextBoxStyle}" x:Name="MyTextBoxStyle">
    <Setter Property="Background" Value="Red" />
    <Setter Property="i:Interaction.Behaviors">
        <Setter.Value>
            <i:BehaviorCollection>
                <Behaviors:TextBoxEnterKeyBehavior>

                    <Core:ChangePropertyAction PropertyName="IsEnabled" Value="False" />
                    <Core:ChangePropertyAction PropertyName="IsEnabled" Value="True" />
                </Behaviors:TextBoxEnterKeyBehavior>
            </i:BehaviorCollection>
        </Setter.Value>
    </Setter>
</Style>

页面资源中的样式

<Page.Resources>
    <Style TargetType="TextBox"  BasedOn="{StaticResource MyTextBoxStyle}">
        <Setter Property="Background" Value="Red" />
        <Setter Property="interactivity:Interaction.Behaviors">
            <Setter.Value>
                <interactivity:BehaviorCollection>
                    <Behaviors:TextBoxEnterKeyBehavior>
                        <Core:InvokeCommandAction Command="{Binding CommandName}" CommandParameter="{Binding Text, ElementName=textBox}" />
                    </Behaviors:TextBoxEnterKeyBehavior>
                </interactivity:BehaviorCollection>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>

【讨论】：

【解决方案3】：

很遗憾，XAML 样式不允许这种“联合”操作。

你有两个选择：

在该特定页面上创建新样式，复制粘贴现有行为并添加新行为。
手动搜索应用了该样式的所有TextBox 实例，并直接从代码中添加新行为。

我个人会选择第一种方法，因为它将您的 UI 代码保留在 XAML 中，尽管它具有代码重复的明显限制。

【讨论】：