none
Button如何按下時背景保持住 RRS feed

  • 问题

  • 各位好,之前在板上學到了按下Button後改變背景圖片,

    我現在想試作按下Button後背景圖片保持住,再按一次Button就回復到原本的背景圖片,

    我用 " IsKeyboardFocused " 是可以做到,但只要按其他Button時就會解除,

    請問有什麼方式可以按下Button保持住背景圖片,再次按下Button就回復背景圖片,但不受其他Button影響,謝謝各位!

    <Button x:Name="button" Content="資訊" HorizontalAlignment="Left" Margin="208,116,0,0" VerticalAlignment="Top" Width="75" Foreground="White" FontWeight="Bold">
    
                <!--Button變換Background-->
                <Button.Style>
                    <Style TargetType="{x:Type Button}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type Button}">
                                    <Grid>
                                        <Image x:Name="Image"/>
                                        <ContentPresenter Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center"/>
                                    </Grid>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="IsKeyboardFocused" Value="True">
                                            <Setter TargetName="Image" Property="Source" Value="PIC/Top_主選按鈕_選到.png" />
                                        </Trigger>
                                        <Trigger Property="IsKeyboardFocused" Value="False">
                                            <Setter TargetName="Image" Property="Source" Value="PIC/Top_主選按鈕_一般.png" />
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </Button.Style>
    
            </Button>

    2017年11月30日 1:45

答案

  • hi,

    想要按下時背景保持住,你需要选择wpf 中的可以保持选中状态的控件,例如ToggleButton。

    参考下面简单的代码:

      <ToggleButton Height="28" Width="200" Content="Test">
                <ToggleButton.Template>
                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                        <Border x:Name="border" CornerRadius="5" BorderBrush="Red" BorderThickness="3" Background="Aqua">
                            <Grid  >
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="border" Value="#FF0FDA25"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FF354C38"/>
                            </Trigger>
    
                            <Trigger Property="ToggleButton.IsChecked" Value="true">
                                <Setter Property="Background" TargetName="border" Value="#FF8BC340"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FFB08558"/>
                            </Trigger>
                           
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </ToggleButton.Template>
            </ToggleButton>

    Sincerely,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    • 已标记为答案 魏高個 2017年11月30日 5:12
    2017年11月30日 3:09
    版主

全部回复

  • hi,

    想要按下時背景保持住,你需要选择wpf 中的可以保持选中状态的控件,例如ToggleButton。

    参考下面简单的代码:

      <ToggleButton Height="28" Width="200" Content="Test">
                <ToggleButton.Template>
                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                        <Border x:Name="border" CornerRadius="5" BorderBrush="Red" BorderThickness="3" Background="Aqua">
                            <Grid  >
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="border" Value="#FF0FDA25"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FF354C38"/>
                            </Trigger>
    
                            <Trigger Property="ToggleButton.IsChecked" Value="true">
                                <Setter Property="Background" TargetName="border" Value="#FF8BC340"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FFB08558"/>
                            </Trigger>
                           
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </ToggleButton.Template>
            </ToggleButton>

    Sincerely,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    • 已标记为答案 魏高個 2017年11月30日 5:12
    2017年11月30日 3:09
    版主
  • hi,

    想要按下時背景保持住,你需要选择wpf 中的可以保持选中状态的控件,例如ToggleButton。

    参考下面简单的代码:

      <ToggleButton Height="28" Width="200" Content="Test">
                <ToggleButton.Template>
                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                        <Border x:Name="border" CornerRadius="5" BorderBrush="Red" BorderThickness="3" Background="Aqua">
                            <Grid  >
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="border" Value="#FF0FDA25"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FF354C38"/>
                            </Trigger>
    
                            <Trigger Property="ToggleButton.IsChecked" Value="true">
                                <Setter Property="Background" TargetName="border" Value="#FF8BC340"/>
                                <Setter Property="BorderBrush" TargetName="border" Value="#FFB08558"/>
                            </Trigger>
                           
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </ToggleButton.Template>
            </ToggleButton>

    Sincerely,

    Bob


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    謝謝你的解答,你真熱心!讓我覺得對學習程式有成就感,謝謝!
    2017年11月30日 5:13
  • 不客气 !!! 很高兴为你解答 :)

    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    2017年11月30日 5:18
    版主