Silverlight / WPF Custom Control Template Help - wpf-controls

Question

I'm hoping to create a control that I call an "AutoCompleteListBox". If you've ever used hotmail to send an e-mail the way the to: address line works is what I wish to create. You have what looks like an input box and as you type you get a dropdown of matching objects. Once you select an object (contact) it is added into the input box as a rectangular object. Multiple objects can be added this way and the input box acts like a wrap panel. You can delete objects by backspacing them or clicking the x button on each.
My approach was to begin by subclassing ItemsControl. I've started to write its control template which is basically a wrap panel that I want to show the bound items + a text box. I don't know how to get both the bound items and the textbox to be in the same wrap panel. Here's what I have:
<Style TargetType="ctrl:AutoCompleteListBox">
<Setter Property="Width" Value="200"/>
<Setter Property="Height" Value="100"/>
<Setter Property="Background" Value="White"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ctrl:AutoCompleteListBox">
<ScrollViewer x:Name="RootScrollViewer" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled" Padding="0" Background="{TemplateBinding Background}">
<toolkit:WrapPanel IsItemsHost="True">
<!--Items Bound To ItemSource Go Here-->
<TextBox x:Name="txtInput"/>
</toolkit:WrapPanel>
</ScrollViewer>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I don't know how to express what I want. I know you can use an "ItemsPresenter" in the control template which does show the bound items but then how can I add my textbox into the same panel as the bound items?
I'd greatly appreciate any help. Is this the right way to even go about it? Thanks very much.

Answer 1

Subclassing the items control is a good start, but I think the controltemplate should be setup a bit different. The Silverlight toolkit contains an excellent autocomplete box that you can use for this exact purpose. Combine this with a separate items control and you should have something that can be styled to look exactly like the live mail "To" field.
<ControlTemplate>
<toolkit:WrapPanel>
<ItemsControl ItemsSource="{TemplateBinding Items}">
<ItemsControl.ItemsPanel>
<StackPanel Orientation="Horizontal"/>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<!-- Add data template for the previously added items here -->
</ItemsControl.ItemTemplate>
</ItemsControl>
<toolkit:AutoCompleteBox ItemsSource="{TemplateBinding AutoCompleteItems}" />
</toolkit:WrapPanel>
</ControlTemplate>