Modèle de contrôle personnalisé Silverlight/WPF Aide

Question

J'espère créer un contrôle que j'appelle un "AutoCompleteListBox". Si vous avez déjà utilisé Hotmail pour envoyer un e-mail, la façon dont fonctionne la ligne d'adresse to: est ce que je souhaite créer. Vous avez ce qui ressemble à une boîte de saisie et lorsque vous tapez, vous obtenez une liste déroulante des objets correspondants. Une fois que vous sélectionnez un objet (contact), il est ajouté dans la zone de saisie en tant qu'objet rectangulaire. Plusieurs objets peuvent être ajoutés de cette manière et la boîte de saisie agit comme un panneau de retour. Vous pouvez supprimer des objets en les retournant ou en cliquant sur le bouton x de chaque.

Mon approche était de commencer par sous-classer ItemsControl. J'ai commencé à écrire son modèle de contrôle qui est essentiellement un panneau de retour que je veux montrer les éléments liés + une zone de texte. Je ne sais pas comment faire en sorte que les éléments liés et la zone de texte soient dans le même panneau de retour. Voici ce que j'ai:

<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> 

Je ne sais pas comment exprimer ce que je veux. Je sais que vous pouvez utiliser un "ItemsPresenter" dans le modèle de contrôle qui affiche les éléments liés, mais comment puis-je ajouter ma zone de texte dans le même panneau que les éléments liés?

J'apprécierais grandement toute aide. Est-ce la bonne façon de s'y prendre? Merci beaucoup.

Answer 1

Le sous-classement du contrôle des éléments est un bon début, mais je pense que le controltemplate devrait être configuré un peu différemment. La boîte à outils Silverlight contient une excellente boîte de saisie semi-automatique que vous pouvez utiliser à cette fin. Combinez cela avec un contrôle d'éléments séparés et vous devriez avoir quelque chose qui peut être stylisé pour ressembler exactement au champ "À" du courrier en direct.

<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>