在文本框中包含一个按钮

| 我要添加一个小按钮,该按钮将删除TextBox中的所有文本。是否可以将此“删除”按钮放入文本框(如iPhone文本框中一样)? 希望在您的帮助下,它看起来像这样: 我用controltemplate播放了一些东西,但没有得到理想的结果。 解决此问题的一种方法可能是使用按钮的负边距,但我认为这不是一个干净的解决方案。 谢谢!     
已邀请:
您可以轻松地从文本框派生并使用所需的功能创建自己的文本框,这就是wpf提供的灵活性。请参见下面的链接 http://davidowens.wordpress.com/2009/02/18/wpf-search-text-box/     
使用交互功能获得了一些东西,但是您可以在没有以下条件的情况下进行管理:
<LinearGradientBrush x:Key=\"TextBoxBorder\" EndPoint=\"0,20\" MappingMode=\"Absolute\" StartPoint=\"0,0\">
    <GradientStop Color=\"#ABADB3\" Offset=\"0.05\" />
    <GradientStop Color=\"#E2E3EA\" Offset=\"0.07\" />
    <GradientStop Color=\"#E3E9EF\" Offset=\"1\" />
</LinearGradientBrush>
<Style x:Key=\"ExtendedTextBoxTemplate\" 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}\">
                <!-- Here i just wrap the content in a grid and place a button on the right, needs to be styled though -->
                <Grid>
                    <Microsoft_Windows_Themes:ListBoxChrome x:Name=\"Bd\"
                            BorderBrush=\"{TemplateBinding BorderBrush}\"
                            BorderThickness=\"{TemplateBinding BorderThickness}\"
                            Background=\"{TemplateBinding Background}\"
                            RenderMouseOver=\"{TemplateBinding IsMouseOver}\"
                            RenderFocused=\"{TemplateBinding IsKeyboardFocusWithin}\" SnapsToDevicePixels=\"true\">
                        <ScrollViewer x:Name=\"PART_ContentHost\"
                                SnapsToDevicePixels=\"{TemplateBinding SnapsToDevicePixels}\" />
                    </Microsoft_Windows_Themes:ListBoxChrome>
                    <Button Content=\"X\" HorizontalAlignment=\"Right\">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName=\"Click\">
                                <ta:ClearTextAction
                                        Target=\"{Binding RelativeSource={RelativeSource TemplatedParent}}\" />
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property=\"IsEnabled\" Value=\"false\">
                        <Setter Property=\"Background\" TargetName=\"Bd\"
                                Value=\"{DynamicResource {x:Static SystemColors.ControlBrushKey}}\" />
                        <Setter Property=\"Foreground\"
                                Value=\"{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}\" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
class ClearTextAction : TriggerAction<Button>
{
    public static readonly DependencyProperty TargetProperty =
            DependencyProperty.Register(\"Target\", typeof(TextBox), typeof(ClearTextAction), new UIPropertyMetadata(null));
    public TextBox Target
    {
        get { return (TextBox)GetValue(TargetProperty); }
        set { SetValue(TargetProperty, value); }
    }

    protected override void Invoke(object parameter)
    {
        Target.Clear();
    }
}
您可以通过添加以下样式,使按钮仅在TextBox-MouseOver上显示:
<Button.Style>
    <Style TargetType=\"{x:Type Button}\">
        <Setter Property=\"Visibility\" Value=\"Hidden\" />
        <Style.Triggers>
            <DataTrigger
                    Binding=\"{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsMouseOver}\"
                    Value=\"True\">
                <Setter Property=\"Visibility\" Value=\"Visible\" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</Button.Style>
    
假设您不希望文本或光标消失在按钮后面,唯一的干净方法是重新模板化
TextBox
。如果您对此并不感到特别困惑,则可以执行以下操作:
<Grid>
    <TextBox/>
    <Image ... VerticalAlignment=\"Center\" HorizontalAlignment=\"Right\" Margin=\"0 0 3 0\"/>
</Grid>
    

要回复问题请先登录注册