2016-07-12 34 views
1

wpfが新機能です。私はこれを達成することができますどのようにWPFの切り替えボタン

Toggle button

のようなトグルボタンを作成したいです。私は2つのボタンを使用する必要がありますし、それぞれのクリックで他のものを無効にする必要があります。またはwpfにトグルボタンのようなものがあります。これを達成する最良の方法は何か..何か提案が高く評価されました。ありがとう

+1

ご質問がありました、今 –

+0

によって達成しているものにいくつかのコードを共有してくださいaちょっと前のトグルボタンを少し調整して、それがあなたのニーズに合うかもしれません:http://stackoverflow.com/questions/38220630/togglebutton-pre-out-to-the-right – Slyvain

+0

@ViVi ON OFFもオンです広い? – Paparazzi

答えて

1

ここはクイックバージョンです。トリックはスタイルを使用することです。

スタイル:

<Style x:Key="ButtonFocusVisual"> 
     <Setter Property="Control.Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0"> 
     <GradientStop Color="#F3F3F3" Offset="0"/> 
     <GradientStop Color="#EBEBEB" Offset="0.5"/> 
     <GradientStop Color="#DDDDDD" Offset="0.5"/> 
     <GradientStop Color="#CDCDCD" Offset="1"/> 
    </LinearGradientBrush> 
    <SolidColorBrush x:Key="ButtonNormalBorder" Color="#FF707070"/> 
    <Style x:Key="ToggleButtonStyle1" TargetType="{x:Type ToggleButton}"> 
     <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/> 
     <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/> 
     <Setter Property="BorderBrush" Value="{StaticResource ButtonNormalBorder}"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type ToggleButton}"> 
        <StackPanel Orientation="Horizontal"> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         <Border x:Name="on" Width="25" Height="25" Background="LightGray" CornerRadius="2,0,0,4" Margin="10,0,0,0"> 
          <TextBlock x:Name="onText" Text="On" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
         </Border> 
         <Border x:Name="off" Width="25" Height="25" Background="LightGray" CornerRadius="0,2,4,0"> 
          <TextBlock x:Name="offText" Text="Off" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
         </Border> 
        </StackPanel> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Foreground" Value="#ADADAD"/> 
         </Trigger> 
         <Trigger Property="IsChecked" Value="true"> 
          <Setter TargetName="on" Property="Background" Value="LightBlue"/> 
          <Setter TargetName="onText" Property="Foreground" Value="White"/> 
         </Trigger> 
         <Trigger Property="IsChecked" Value="False"> 
          <Setter TargetName="off" Property="Background" Value="LightBlue"/> 
          <Setter TargetName="offText" Property="Foreground" Value="White"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

トグルボタンコール:

<ToggleButton 
     Content="ON LINE MODE" 
     Style="{StaticResource ToggleButtonStyle1}"/> 

プレビュー

alt text

+0

これは完璧に働いています....ありがとうございます。:) –

関連する問題