創建一個切換按鈕，將圖像類似的附加

I want to have two buttons which behave similar to Radio Button Functionality plus can also handle the button click or Command functionality if using MVVM.

我試圖創建切換按鈕模板中的控件模板。用戶界面看起來與此類似，但我已經使用文本塊作爲堆棧面板中的控件。現在，如果我用Button替換文本塊，行爲將發生變化。

Below is my XAML : 

    <ToggleButton Grid.Column="2"> 
              <ToggleButton.Template> 
               <ControlTemplate> 
                <Border Name="ControlBorder" CornerRadius="5" BorderThickness="0.5" BorderBrush="Black" HorizontalAlignment="Center"> 
                 <StackPanel Orientation="Horizontal"> 
                  <StackPanel Orientation="Horizontal" Name="CodeTextBlockStackPanel" HorizontalAlignment="Center"> 
                   <TextBlock Name="CodeTextBlock" Text="Code" Width="50" Margin="5,0,0,0" VerticalAlignment="Center"> 
                   </TextBlock> 
                  </StackPanel> 
                  <StackPanel Orientation="Horizontal" Name="ScanTextBlockStackPanel" HorizontalAlignment="Center"> 
                   <TextBlock Name="ScanTextBlock" Text="Scan" Width="50" Margin="5,0,0,0" VerticalAlignment="Center" ></TextBlock> 
                  </StackPanel> 
                 </StackPanel> 
                </Border> 
                <ControlTemplate.Triggers> 
                 <Trigger Property="ToggleButton.IsChecked" Value="True"> 
                  <Setter TargetName="CodeTextBlockStackPanel" Property="Opacity" Value="0.25"/> 
                  <Setter TargetName="ScanTextBlockStackPanel" Property="Background" Value="Green"/> 
                 </Trigger> 
                 <Trigger Property="ToggleButton.IsChecked" Value="False"> 
                  <Setter TargetName="ScanTextBlockStackPanel" Property="Opacity" Value="0.25"/> 
                  <Setter TargetName="CodeTextBlockStackPanel" Property="Background" Value="Green"/> 
                 </Trigger> 
                </ControlTemplate.Triggers> 
               </ControlTemplate> 
              </ToggleButton.Template> 
             </ToggleButton>

任何變化或建議如何這可以實現將是有益的

來源

2017-03-02 Nikunj Kakadiya

用什麼樣的行爲變化？爲什麼你會在按鈕裏面使用按鈕？請分享更多信息。顯然'Button'會處理你的'Click-Event'，它不會通過它。所以有一個不同的行爲。 – Peter

使用按鈕不會觸發我在放置按鈕的堆棧面板上使用的觸發器。如果我使用文本塊，它工作正常。 –

我不知道你在做什麼，但是你是否想在這個模板中放置一個

其他行爲由Button把你Click造成的 - Event。如果你不需要它內部的Button，只想點擊事件，然後使用這樣的Behaviour。

public class ClickBehaviour : Behavior<FrameworkElement> 
    { 



     public ICommand MouseClickCommand 
     { 
      get { return (ICommand)GetValue(MouseClickCommandProperty); } 
      set { SetValue(MouseClickCommandProperty, value); } 
     } 

     // Using a DependencyProperty as the backing store for MouseClickCommand. This enables animation, styling, binding, etc... 
     public static readonly DependencyProperty MouseClickCommandProperty = 
      DependencyProperty.Register("MouseClickCommand", typeof(ICommand), typeof(ClickBehaviour), new PropertyMetadata(null)); 






     protected override void OnAttached() 
     { 
      this.AssociatedObject.MouseLeftButtonDown += AssociatedObject_MouseLeftButtonDown; 

      base.OnAttached(); 
     } 

     protected override void OnDetaching() 
     { 
      this.AssociatedObject.MouseLeftButtonDown -= AssociatedObject_MouseLeftButtonDown; 
      base.OnDetaching(); 
     } 

     private void AssociatedObject_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e) 
     { 
      MouseClickCommand?.Execute(null); 

     } 
    }

如果你仍然在AssociatedObject_MouseLeftButtonDown設置e.Handeld問題上FALSE

不要忘記引用交互組裝。

使用行爲這樣

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:WpfApplication1" 
     xmlns:interactivity="http://schemas.microsoft.com/expression/2010/interactivity" 
     mc:Ignorable="d" 
     Title="MainWindow" Height="350" Width="525"> 
    <Grid> 
     <ToggleButton Grid.Column="2"> 
      <ToggleButton.Template> 
       <ControlTemplate> 
        <Border Name="ControlBorder" CornerRadius="5" BorderThickness="0.5" BorderBrush="Black" HorizontalAlignment="Center"> 
         <StackPanel Orientation="Horizontal"> 
          <StackPanel Orientation="Horizontal" Name="CodeTextBlockStackPanel" HorizontalAlignment="Center"> 
           <TextBlock Name="CodeTextBlock" Text="Code" Width="50" Margin="5,0,0,0" VerticalAlignment="Center"> 

           </TextBlock> 
           <interactivity:Interaction.Behaviors> 
            <local:ClickBehaviour MouseClickCommand="{Binding Path=MyC}" /> 
           </interactivity:Interaction.Behaviors> 
          </StackPanel> 
          <StackPanel Orientation="Horizontal" Name="ScanTextBlockStackPanel" HorizontalAlignment="Center"> 
           <TextBlock Name="ScanTextBlock" Text="Scan" Width="50" Margin="5,0,0,0" VerticalAlignment="Center" ></TextBlock> 
           <interactivity:Interaction.Behaviors> 
            <local:ClickBehaviour MouseClickCommand="{Binding Path=MyC}" /> 
           </interactivity:Interaction.Behaviors> 
          </StackPanel> 
         </StackPanel> 
        </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="ToggleButton.IsChecked" Value="True"> 
          <Setter TargetName="CodeTextBlockStackPanel" Property="Opacity" Value="0.25"/> 
          <Setter TargetName="ScanTextBlockStackPanel" Property="Background" Value="Green"/> 
         </Trigger> 
         <Trigger Property="ToggleButton.IsChecked" Value="False"> 
          <Setter TargetName="ScanTextBlockStackPanel" Property="Opacity" Value="0.25"/> 
          <Setter TargetName="CodeTextBlockStackPanel" Property="Background" Value="Green"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </ToggleButton.Template> 
     </ToggleButton> 
    </Grid> 
</Window>

來源

2017-03-03 08:17:08 Peter

創建一個切換按鈕，將圖像類似的附加

回答

相關問題