ボタンのバックグラウンドを押して放すまでの間だけ変更する方法はありますか？

Question

私はボタンを押して離したときにボタンの背景を変更したいと思います。私はC＃ユニバーサルWindowsプラットフォームでコーディングしています。私は次のことを試していますが、失敗しました。

private void pay_LostFocus(object sender, RoutedEventArgs e) 
    { 
     pay.Background = new SolidColorBrush(Windows.UI.Colors.Pink); 
    } 

    private void one_FocusEngaged(Control sender, FocusEngagedEventArgs args) 
    { 
     one.Background = new SolidColorBrush(Windows.UI.Colors.White); 
    } 

Answer 1

あなたはそれを行うにはポインタイベントを使用することができますが、あなたはまた、UIはとどまることを確認するために、以前に扱わポインタイベントを処理できるようにする必要がありますように手動AddHandlerメソッドを介してハンドラを追加する必要があります一貫している。

あなたはこのコードを使用することができます：UIElement.PointerEnteredEvent、UIElement.PointerExitedEvent、UIElement.PointerCaptureLostEvent、UIElement.PointerCanceledEvent、UIElement.PointerReleasedEvent：

MyButton.AddHandler(
    UIElement.PointerEnteredEvent, // The target event 
    new PointerEventHandler((s, e) => 
    { 
     // Handle your background here 
    }), 
    true); // Include previously handled events 

は、これらはあなたが使用する必要がありますイベントです。

ボタンの背景は、ソースイベントに応じて調整する必要があります。これらのメソッドの一部は、ユーザーがボタンを押すときに開始されるため、ボタンが離されたときに開始されるためです。

編集：ここにボタンが離されたときのハンドラを追加する例を示します

foreach (RoutedEvent target in new[] { UIElement.PointerExitedEvent, UIElement.PointerCaptureLostEvent, 
             UIElement.PointerCanceledEvent, UIElement.PointerReleasedEvent }) 
{ 
    MyButton.AddHandler(target, new PointerRoutedEventArgs((s, e) => 
    { 
     MyButton.Background = new SolidColorBrush(Colors.Red); 
    }), true); 
} 

は別のブラシ（ボタンが押された）とPointerPressedEventために同じことを行うと、あなたはすべてする必要がありますセット。

Answer 2

ボタンのスタイル、特にを押して、 VisualStateを変更します。サンプル：

<Style x:Key="MyButtonStyle" TargetType="Button"> 
    <Setter Property="Background" Value="{ThemeResource ButtonBackground}"/> 
    <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}"/> 
    <Setter Property="BorderBrush" Value="{ThemeResource ButtonBorderBrush}"/> 
    <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}"/> 
    <Setter Property="Padding" Value="8,4,8,4"/> 
    <Setter Property="HorizontalAlignment" Value="Left"/> 
    <Setter Property="VerticalAlignment" Value="Center"/> 
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/> 
    <Setter Property="FontWeight" Value="Normal"/> 
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/> 
    <Setter Property="UseSystemFocusVisuals" Value="True"/> 
    <Setter Property="FocusVisualMargin" Value="-3"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Grid x:Name="RootGrid" Background="{TemplateBinding Background}"> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"> 
           <Storyboard> 
            <PointerUpThemeAnimation Storyboard.TargetName="RootGrid"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="PointerOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="RootGrid"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBackgroundPointerOver}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushPointerOver}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundPointerOver}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <PointerUpThemeAnimation Storyboard.TargetName="RootGrid"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="RootGrid"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="White"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushPressed}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundPressed}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <PointerDownThemeAnimation Storyboard.TargetName="RootGrid"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="RootGrid"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBackgroundDisabled}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushDisabled}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundDisabled}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

そして、それを使用する：

<Button Content="Something" Style="{StaticResource MyButtonStyle}" Padding="20" Background="Pink"/>