2017-09-26 61 views
0

我正在使用自定義控件,已經放置在代碼項目(https://www.codeproject.com/Articles/563862/Multi-Select-ComboBox-in-WPF)上的MultiSelectComboBox。這個組合框裏面有複選框。我正在嘗試實現以下功能: 當組合框打開時,我只想點擊確定/取消按鈕關閉它。取消將關閉它,並且任何複選框都不會被選中。我不希望它關閉,當我用鼠標點擊窗口或其他任何地方,除了確定/取消按鈕。 下面是部分代碼:從關閉中停止組合框

<ComboBox x:Name="cmbMultiSelect" Style="{StaticResource MultiSelectComboBoxStyler}"> 
<ComboBox.ToolTip > 
    <ToolTip DataContext="{Binding Path=PlacementTarget.Parent, RelativeSource={x:Static RelativeSource.Self}}"> 
     <TextBlock TextWrapping="Wrap" Text="{Binding Path=Text, UpdateSourceTrigger=PropertyChanged, Converter={StaticResource CommmaToNewLineConverter}}"/> 
    </ToolTip> 
</ComboBox.ToolTip> 

<ComboBox.ItemTemplate> 
    <DataTemplate> 
     <CheckBox x:Name="cbSelector" 
        Content="{Binding Title, UpdateSourceTrigger=PropertyChanged}" 
        IsChecked="{Binding Path=IsSelected, Mode=TwoWay}" 
        Tag="{RelativeSource FindAncestor, AncestorType={x:Type ComboBox}}" 
        Click="cbSelector_OnClick"/> 
    </DataTemplate> 
</ComboBox.ItemTemplate> 

現在,這裏是我的風格,MultiSelectComboBoxStyler:

<Style x:Key="MultiSelectComboBoxStyler" TargetType="{x:Type ComboBox}"> 
<Setter Property="OverridesDefaultStyle" Value="True"/> 
<Setter Property="SnapsToDevicePixels" Value="True"/> 
<Setter Property="FocusVisualStyle" Value="{StaticResource ComboBoxFocusVisual}"/> 
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.WindowTextBrushKey}}"/> 
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/> 
<Setter Property="BorderBrush" Value="{StaticResource ListBorder}"/> 
<Setter Property="BorderThickness" Value="1"/> 
<Setter Property="Padding" Value="1"/> 
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> 
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> 
<Setter Property="ScrollViewer.CanContentScroll" Value="true"/> 
<Setter Property="ScrollViewer.PanningMode" Value="Both"/> 
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/> 
<Setter Property="VerticalContentAlignment" Value="Center"/> 
<Setter Property="IsSynchronizedWithCurrentItem" Value="True"/> 
<Setter Property="ItemTemplate"> 
    <Setter.Value> 
     <DataTemplate> 
      <CheckBox/> 
      <!-- Do not really need to specify in this instance, since the ItemTemplate is going to be overwritten --> 
     </DataTemplate> 
    </Setter.Value> 
</Setter> 
<Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="ComboBox"> 
      <Grid> 
       <ToggleButton Name="ToggleButton" 
           Grid.Row="0" 
           Grid.Column="0" 
           Content="{Binding Path=Text, Mode=TwoWay, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}" 
           IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}" 
           Focusable="false"       
           ClickMode="Press" 
           HorizontalContentAlignment="Left"> 
        <ToggleButton.Template> 
         <ControlTemplate> 
          <Grid> 
           <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="*"/> 
            <ColumnDefinition Width="18"/> 
           </Grid.ColumnDefinitions> 
           <Border x:Name="Border" 
             Grid.ColumnSpan="2" 
             CornerRadius="2" 
             Background="White" 
             BorderBrush="{StaticResource NormalBorderBrush}" 
             BorderThickness="1,1,1,1" /> 
           <Border x:Name="BorderComp" 
             Grid.Column="0" 
             CornerRadius="2" 
             Margin="1" 
             Background="White" 
             BorderBrush="{StaticResource NormalBorderBrush}" 
             BorderThickness="0,0,0,0" > 
            <TextBlock x:Name="txtOnToggleButton" 
                Background="White" 
                Text="{Binding Path=Text, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}" 
                TextTrimming="WordEllipsis" 
                TextWrapping="Wrap" 
                Padding="3" /> 
           </Border> 
           <Path x:Name="Arrow" 
             Grid.Column="1" 
             Fill="{StaticResource GlyphBrush}" 
             HorizontalAlignment="Center" 
             VerticalAlignment="Center" 
             Data="M 0 0 L 4 4 L 8 0 Z"/> 
          </Grid> 
          <ControlTemplate.Triggers> 
           <Trigger Property="IsEnabled" Value="False"> 
            <Setter TargetName="Arrow" Property="Fill" Value="{StaticResource DisabledForegroundBrush}" /> 
           </Trigger> 
           <Trigger Property="ToggleButton.IsMouseOver" Value="true"> 
            <Setter TargetName="Border" Property="Background" Value="{StaticResource MouseHoverBrush}" /> 
            <Setter TargetName="txtOnToggleButton" Property="Background" Value="{StaticResource MouseHoverBrush}" /> 
           </Trigger> 
          </ControlTemplate.Triggers> 
         </ControlTemplate> 
        </ToggleButton.Template> 
       </ToggleButton> 
       <Popup Name="Popup" 
         Placement="Bottom"       
         AllowsTransparency="True" 
         Focusable="False" IsOpen="{TemplateBinding IsDropDownOpen}" 
         PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}"> 
        <theme:SystemDropShadowChrome Name="Shdw" 
                Color="Transparent" 
                MinWidth="{TemplateBinding ActualWidth}" 
                MaxHeight="{TemplateBinding MaxDropDownHeight}"> 
         <Border x:Name="DropDownBorder" 
            Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" 
            BorderThickness="1" 
            BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}"> 
          <Grid Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding ActualWidth}" 
            MaxHeight="{TemplateBinding MaxDropDownHeight}"> 
           <ScrollViewer Name="DropDownScrollViewer" Margin="4,0,4,30" SnapsToDevicePixels="True"> 
            <Grid RenderOptions.ClearTypeHint="Enabled"> 
             <Canvas Height="0" Width="0" HorizontalAlignment="Left" VerticalAlignment="Top"> 
              <Rectangle Name="OpaqueRect" 
                  Height="{Binding ElementName=DropDownBorder,Path=ActualHeight}" 
                  Width="{Binding ElementName=DropDownBorder,Path=ActualWidth}" 
                  Fill="{Binding ElementName=DropDownBorder,Path=Background}" /> 
             </Canvas> 
             <ItemsPresenter Name="ItemsPresenter" 
                  KeyboardNavigation.DirectionalNavigation="Contained" 
                  SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
            </Grid> 
           </ScrollViewer> 
           <StackPanel Orientation="Horizontal"> 
            <Button Name="btnOk" Content="Ok" VerticalAlignment="Bottom" Margin="2, 0, 2, 2" 
              Width="50" Height="25" 
              Background="{StaticResource WindowBackgroundBrush}" 
              Command="{Binding OkCommand}"> 
             <Button.Style> 
              <Style TargetType="Button"> 
               <Setter Property="Visibility" Value="Collapsed"/> 
               <Style.Triggers> 
                <DataTrigger Binding="{Binding Path=ShowFilterButtons, 
             RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type controls:MultiSelectComboBox}}}" 
                   Value="True"> 
                 <Setter Property="Visibility" Value="Visible"/> 
                </DataTrigger> 
               </Style.Triggers> 
              </Style> 
             </Button.Style> 
             </Button> 
            <Button Name="btnCancel" Content="Cancel" VerticalAlignment="Bottom" Margin="2, 0, 2, 2" 
              Width="50" Height="25" 
              Background="{StaticResource WindowBackgroundBrush}" 
              Command="{Binding CancelCommand}"> 
             <Button.Style> 
              <Style TargetType="Button"> 
               <Setter Property="Visibility" Value="Collapsed"/> 
               <Style.Triggers> 
                <DataTrigger Binding="{Binding Path=ShowFilterButtons, 
             RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type controls:MultiSelectComboBox}}}" 
                   Value="True"> 
                 <Setter Property="Visibility" Value="Visible"/> 
                </DataTrigger> 
               </Style.Triggers> 
              </Style> 
             </Button.Style> 
            </Button> 
           </StackPanel> 
          </Grid> 
         </Border> 
        </theme:SystemDropShadowChrome> 
       </Popup> 
      </Grid> 
      <ControlTemplate.Triggers> 
       <Trigger Property="HasItems" Value="false"> 
        <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/> 
       </Trigger> 
       <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true"> 
        <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4"/> 
        <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/> 
       </Trigger> 
       <Trigger SourceName="Popup" Property="Popup.HasDropShadow" Value="true"> 
        <Setter TargetName="Shdw" Property="Margin" Value="0,0,5,5"/> 
        <Setter TargetName="Shdw" Property="Color" Value="#71000000"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
</Setter> 

這是我如何使用自定義控制在我看來, :

<controls:MultiSelectComboBox Width="200" Height="30" HorizontalAlignment="Left" DefaultText="All" ItemsSource="{Binding Chains}" SelectedItems="{Binding SelectedChains, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" ShowFilterButtons="True"/> 

雖然我對WPF來說很新,但我能夠理解一些事情,但這個問題再一次讓我頭疼。我被卡住了。我知道有切換按鈕有些事情要做,但沒有成功解決它。我很感激我能得到的所有幫助。

+0

你試過設置'StaysOpen'屬性值'真'的'Popup'? – dymanoid

+0

不會幫助。 ComboBox控件在內部設置IsDropDownOpen屬性,因此您必須將ToggleButton的IsChecked屬性綁定到可以控制自己的其他屬性。 – mm8

+0

@dymanoid已經嘗試過。 –

回答

1

由於您使用multiselectbox控制,你應該添加新的DependencyProperty

此外,彈出標籤應該是這樣的

IsOpen="{Binding Path=IsChecked, ElementName=ToggleButton}" 

雖然切換按鈕應該是這樣的:

IsChecked="{Binding Path=ControlComboBox, Mode=TwoWay, 
         RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}, 
         UpdateSourceTrigger=PropertyChanged}" 
            Command="{Binding PressedCommand}" 

和結束時,你應該以這種方式使用MultiSelectCombBox

ControlComboBox="{Binding ManageComboBox, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"