Silverlight 水印自动完成框

Question

有人可以指导我看一个对我有帮助的例子或解释吗：

1. 扩展 SilverLight 自动完成框以允许添加水印。
2. 扩展水印文本框以允许自动完成功能。

让我印象深刻的是选项 1 是最简单的，但我是开放的。

提前致谢。

Answer 1

马上，我会说选项 1 很好：

1) 创建一个附加属性来保存您可以在 AutoCompleteBox 上使用的 WatermarkText。

2) 为 AutoCompleteBox 创建一个控件模板（只需使用 blend 复制现有的），但将 TextBox 更改为 Watermark TextBox，并使用 TemplateBinding 将 WatermarkTextBox 的属性设置为附加属性的值。 控件模板应以样式应用（例如 WatermarkedAutoCompleteBoxStyle）。

你应该很乐意这样做。 任何时候您想要一个带水印的自动完成框，只需设置附加的属性值并应用您定义的样式。

如果您需要对其中一个步骤进行更深入的解释，请举手，我会尽量抽出时间来创建示例。

您也可以从 AutoCompleteBox 派生，添加一个 DependencyProperty 而不是附加属性，并将样式打包到 Themes/generic.xaml 文件中，但我通常会在它工作后执行。

Answer 2

根据史蒂夫的回答：

Public Class WatermarkExtender
    Inherits DependencyObject

    Public Shared ReadOnly WatermarkProperty As DependencyProperty =
        DependencyProperty.RegisterAttached(
            "Watermark",
            GetType(Object),
            GetType(WatermarkExtender),
            New UIPropertyMetadata(Nothing))

    Public Shared ReadOnly WatermarkTemplateProperty As DependencyProperty =
        DependencyProperty.RegisterAttached(
            "WatermarkTemplate",
            GetType(DataTemplate),
            GetType(WatermarkExtender),
            New UIPropertyMetadata(Nothing))

    Public Shared Sub SetWatermark(ByVal element As UIElement, ByVal value As Object)
        element.SetValue(WatermarkProperty, value)
    End Sub

    Public Shared Function GetWatermark(ByVal element As UIElement) As Object
        Return element.GetValue(WatermarkProperty)
    End Function

    Public Shared Sub SetWatermarkTemplate(ByVal element As UIElement, ByVal value As Object)
        element.SetValue(WatermarkTemplateProperty, value)
    End Sub

    Public Shared Function GetWatermarkTemplate(ByVal element As UIElement) As Object
        Return element.GetValue(WatermarkTemplateProperty)
    End Function
End Class

风格：

<!--  input:AutoCompleteBox  -->
    <Style TargetType="input:AutoCompleteBox">
        ...
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="input:AutoCompleteBox">
                    <Grid Opacity="{TemplateBinding Opacity}">
                        <extk:WatermarkTextBox 
                            Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}" 
                            IsTabStop="True" 
                            x:Name="Text" 
                            Style="{TemplateBinding TextBoxStyle}" 
                            BorderThickness="{TemplateBinding BorderThickness}" 
                            BorderBrush="{TemplateBinding BorderBrush}" 
                            Foreground="{TemplateBinding Foreground}" 
                            Margin="0" 
                            Watermark="{Binding Path=(local:WatermarkExtender.Watermark), Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
                            WatermarkTemplate="{Binding Path=(local:WatermarkExtender.WatermarkTemplate), Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" />

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

用法：

<Window.Resources>
<Style x:Key="acWatermarkStyle" TargetType="{x:Type wtk:AutoCompleteBox}" BasedOn="{StaticResource {x:Type wtk:AutoCompleteBox}}">
            <Setter Property="local:WatermarkExtender.WatermarkTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <TextBlock Foreground="Gray" Margin="3,0,0,0" Text="{Binding}" />
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
</Window.Resources>

<wtk:AutoCompleteBox 
Height="25" 
Margin="2" 
Style="{StaticResource acWatermarkStyle}"
HorizontalAlignment="Stretch"
ValueMemberPath="SomeProp"
FilterMode="Custom" 
local:WatermarkExtender.Watermark="type something" />