MouseOverでボタンの視認性を調整する

Question

ユーザーがマウスをその位置に置いたときにのみボタンを表示します。マウスがその領域を離れると、ボタンは元に戻ります。ここにボタンのための私のコードです。

<StackPanel Name="ButtonOptions" Orientation="Horizontal" DockPanel.Dock="Bottom" Background="DarkBlue" Height="50" Width="auto"> 
    <!--<StackPanel.Resources> 
     <Style TargetType="Button"> 
      <Style.Triggers> 
       <Trigger Property="IsMouseOver" Value="True"> 
        <Setter Property="Visibility" Value="Visible"/> 
       </Trigger> 
      </Style.Triggers> 
     </Style> 
    </StackPanel.Resources>--> 
    <Button Name="LoginButton" FontSize="12" Click="LoginButton_Click" Content="Log In" Width="100" Height="31" Margin="50,0,0,0" 
      FontFamily="Arial" Visibility="Visible" IsEnabled="True" MouseEnter="LoginButton_MouseEnter" /> 
    <Button Name="OptionsButton" Content="Options" Width="100" Height="31" Margin="20,0,0,0" FontFamily="Arial" 
      FontSize="12" Click="OptionsButton_Click" Visibility="Hidden" IsEnabled="False"/> 
</StackPanel> 

私はそれを試して、動作していなかったので、resoucesセクションはコメントアウトされています。ボタンでの私のログには、付属の以下のEventHandlerを持っている...

LoginButton.MouseEnter += new MouseEventHandler(LoginButton_MouseEnter); 

これは処理するメソッド..

private void LoginButton_MouseEnter(object sender, MouseEventArgs e) 
{ 
    MessageBox.Show("Made in the login button listener for mouseOver"); 

    LoginButton.Visibility = Visibility.Visible; 
} 

私は私のアプリを実行すると、私は場所の上に置いたとき、何も起こりませんボタンがあるはずです。しかし、最初にログインボタンの表示をVisibleに設定すると、そのボタンが表示されます。クリックすると、ログインしたユーザーのログイン方法が無効になり、メッセージボックスが表示されます。 「mouseOverのログインボタンリスナーを作成する」のMouseEventListenerメソッドそれだけでなく、私はこれらのメッセージの2つを受け取ります（最初に「OK」をクリックすると直ちにそれが再びポップアップします）。なぜ動作しないのか、なぜ私のclickイベントメソッドが無視されるのかわかりません。今すぐmouseEventメソッドが発生します。

ご意見やご協力をいただければ幸いです。

Answer 1

オフトピック： まず、アイテムが突然「下に」表示されると、マウスが実際には悪いデザインになり、それを変更するようアドバイスします。

オントピック： コメントセクションで既に説明したように、コントロールが非表示または折りたたまれているときは、すべての入力の処理が停止されるため、トリガーをトリガーしません。

Opacityプロパティを使用して、「MouseEnter」および「MouseLeave」でEventTriggersを使用して、そこに素敵なアニメーションを配置することができます。マウスは、（不透明度=上記の私の例では0.2）以上でない場合であっても、私は強く見えるボタンを維持することをお勧め戻って私の最初の考えで、今

<Style x:Key="FadeOutButton" TargetType="{x:Type Button}"> 
    <Style.Triggers> 
     <EventTrigger RoutedEvent="Control.MouseEnter"> 
      <BeginStoryboard> 
       <Storyboard > 
        <DoubleAnimation Duration="0:0:1" To="1" Storyboard.TargetProperty="Opacity"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
     <EventTrigger RoutedEvent="Control.MouseLeave"> 
      <BeginStoryboard> 
       <Storyboard > 
        <DoubleAnimation Duration="0:0:1" To="0.2" Storyboard.TargetProperty="Opacity"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Style.Triggers> 
</Style> 

と一緒にプレイ：ここで私はそのスタイルを記述します方法ですアニメーションの時間。オプションでない場合は、アニメーションの持続時間を常に0：0：0と不透明度の値ti 0に設定できます。可視性（少なくとも視覚的）と同じ結果が得られます。

その後編集： あなたは、このようなあなたのボタンにスタイルを適用する必要があります。ボタンが非表示または縮小されたときに

<Button Content="my button" Style="{StaticResource FadeOutButton}" Opacity="0.2"/>