如何添加一個複選標記到列表框中的選定項目

Question

我是新手到Windows Phone 7，我有一個疑問： 如何添加複選標記到動態創建的列表框中的選定項目。如果用戶單擊列表框中的其他項目，則選中標記將將其位置移至所選項目。怎麼做？我的代碼如下所示： XAML代碼：

<ListBox Height="669" HorizontalAlignment="Left" Name="listBox1" VerticalAlignment="Top" Width="479" Margin="1,-3.5,0,0" SelectionChanged="listBox1_SelectionChanged" Background="White"> 
      <ListBox.ItemTemplate> 
       <DataTemplate > 
        <Border BorderThickness="0,0,0,1.2" BorderBrush="Black" Width="480" > 
        <StackPanel Background="White" Name="stackpanel1" Width="480" Orientation="Horizontal"> 
         <TextBlock Text="{Binding name}" Height="62" Width="390" FontSize="40" FontFamily="Arial" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" /> 
        </StackPanel> 
        </Border> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox> 

CS代碼：

public class list 
    { 
     public string name { get; set; } 

    } 

foreach (string s in array) 
       { 
        list obj = new list(); 
        obj.name = s; 
        listBox1.Items.Add(obj); 
       } 

請指引我與一些代碼片段。謝謝。

Answer 1

爲您的數據模板創建一個用戶控件。在用戶控件中添加支票圖像或熒光筆，並在用戶點擊相應的項目時切換其可見性。那就是我所做的。我希望它有幫助。

類似下面：

User control

   <Border BorderThickness="0,0,0,1.2" BorderBrush="Black" Width="480" > 
       <StackPanel Background="White" Name="stackpanel1" Width="480" Orientation="Horizontal"> 
        <Image x:Name="checkImg" Source="check" Visibility="Collapsed"> 
        <TextBlock Text="{Binding name}" Height="62" Width="390" FontSize="40" FontFamily="Arial" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" /> 
       </StackPanel> 
       </Border> 

現在listbox：

 <ListBox Height="669" HorizontalAlignment="Left" Name="listBox1" VerticalAlignment="Top" Width="479" Margin="1,-3.5,0,0" SelectionChanged="listBox1_SelectionChanged" Background="White"> 
     <ListBox.ItemTemplate> 
      <DataTemplate > 
       <user:control></user:control> 
      </DataTemplate> 
     </ListBox.ItemTemplate> 
    </ListBox> 

在你selectionchaged情況下，提取項目作爲ListBoxItem和切換其知名度。

存儲所選項目的舊項目，當您選擇另一個項目時，將舊項目的可見性設置爲false，將新項目設置爲true。

Answer 2

純粹基於XAML的解決辦法是這樣的：

你的應用程序特定代碼將是這樣的：

<ListBox ItemsSource="{Binding}"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <TextBlock Text="{Binding}"/> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 

而且你的列表框的風格將是XAML條款（禁止複製粘貼和變化「someIcon.png」下面你要使用的圖標）的名稱：

<phone:PhoneApplicationPage.Resources> 
    <Style TargetType="ListBoxItem"> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderThickness" Value="0"/> 
     <Setter Property="BorderBrush" Value="Transparent"/> 
     <Setter Property="Padding" Value="0"/> 
     <Setter Property="HorizontalContentAlignment" Value="Left"/> 
     <Setter Property="VerticalContentAlignment" Value="Top"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="ListBoxItem"> 
        <Border x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="MouseOver"/> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ContentContainer"/> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="SelectionStates"> 
           <VisualState x:Name="Unselected"/> 
           <VisualState x:Name="Selected"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Green"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="SelectionIcon"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
        <StackPanel Orientation="Horizontal"> 
         <Border Width="80" Height="80"> 
          <Image Name="SelectionIcon" Source="someIcon.png" Visibility="Collapsed"/> 
         </Border> 
         <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </StackPanel> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</phone:PhoneApplicationPage.Resources> 

更新1：

添加圖像以說明我對以下構建操作的評論。