2016-04-11 8 views
1

を正常に適用される前に:トリガー可視性の変更、それは私が私のユーザーコントロールのいずれかのスタイルを持っている

<Style x:Key="AddServerPanel" TargetType="{x:Type uc:AddServer}"> 
    <Style.Triggers> 
     <Trigger Property="Visibility" Value="Visible"> 
      <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:0.2" From="252,550,26,0" To="252,248,26,0" /> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.EnterActions> 
     </Trigger> 

     <Trigger Property="Visibility" Value="Hidden"> 
      <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:0.2" From="252,248,26,0" To="252,550,26,0" /> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.EnterActions> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

私はボタンをクリックしたときに表示される背景に隠されたユーザーコントロールを持っています。スライドを入れてアニメーションをスライドしたいこのコードはすでにスライディングインで動作しますが、スライディングアウトはコントロールが消えても正しく動作しません。これは、visibilityプロパティがコントロールに適用され、その後にトリガが呼び出されたためです。コントロールに適切な「スライドアウト」効果を持たせるために、この動作を修正するにはどうすればよいですか?

編集

私は私のコードを変更し、DataTriggerに切り替え。 これは動作していますが、Bindingプロパティの値がfalseの場合はアニメーションが表示されます。これは本当に興味があります。 また、ThicknessAnimationの "From"プロパティをコントロールの現在のマージンに設定する方法を知っておくとよいでしょう。

<uc:AddServer x:Name="AddServerPanel" Height="300" Width="570" Margin="252,550,26,0"> 
    <uc:AddServer.Style> 
     <Style> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding Path=AddServerPanelVisible}" Value="True"> 
        <DataTrigger.EnterActions> 
         <BeginStoryboard> 
          <Storyboard> 
           <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:2" From="252,550,26,0" To="252,248,26,0" /> 
          </Storyboard> 
         </BeginStoryboard> 
        </DataTrigger.EnterActions> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding Path=AddServerPanelVisible}" Value="False"> 
        <DataTrigger.EnterActions> 
         <BeginStoryboard> 
          <Storyboard> 
           <ThicknessAnimation Storyboard.TargetProperty="Margin" Duration="0:0:2" From="252,248,26,0" To="252,550,26,0"/> 
          </Storyboard> 
         </BeginStoryboard> 
        </DataTrigger.EnterActions> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </uc:AddServer.Style> 
</uc:AddServer> 
+0

どのようにコントロールの可視性を変更していますか? – Nitin

+0

ViewModelでバインディングを取り除いた – chris579

答えて

1

あなたがコントロールを表示/非表示するアニメーションを使用している場合、チャンスはあなたがの不透明度を操作しているされているコントロールを言いました。そうであれば、ストーリーボードをコードで開始し、完了したらvisibilityフラグをtrueに設定することができます。これにより、アニメーションが最初に実行され、可視性が設定されます。

私は、あなたが既に不透明度でコントロールを隠しているので、その時点で可視性を変更する必要は本当にありません。

もう1つのオプションは、コントロールのvisibilityプロパティにバインドされていない可視フラグを設定することです。フラグ値が変更されたら、適切なストーリーボードを開始します(たとえば、フラグがtrueの場合、コントロールを表示する場合、 )。

私はまた、あなたが現在持っているものがなぜそれをするのかを説明したかったのです。

トリガーを設定するたびに、プロパティがそのような値に等しいとき何かを行うようにコントロールに指示します。何が起こるかは、コントロールが最初に隠れているかどうか、そして可視性が隠されているときは、それだけで隠れたアニメーションが開始されます。唯一の問題は...それはすでに隠されている!私の解決策の出番なのです;)

編集

あなたのアニメーションの余裕はなく、不透明度を実現しました。いずれの場合も、アニメーションを開始する前にコントロールが常に隠されていることが問題です。

ソリューション

はここに例を示します

<DataTrigger Binding="{Binding IsVisible}" Value="True"> 
    <DataTrigger.EnterActions> 
     <BeginStoryboard> 
      <Storyboard> 
       <!-- Fade in animation --> 
      </Storyboard> 
     </BeginStoryboard> 
    </DataTrigger.EnterActions> 
</DataTrigger> 
<DataTrigger Binding="{Binding IsVisible}" Value="False"> 
    <DataTrigger.EnterActions> 
     <BeginStoryboard> 
      <Storyboard> 
       <!-- Fade out animation --> 
      </Storyboard> 
     </BeginStoryboard> 
    </DataTrigger.EnterActions> 
</DataTrigger> 

IsVisibleは、ユーザーが定義する必要があると思いフラグです。残りはかなり簡単です。

+0

私はそれを管理する方法を変えました。最初の投稿を編集してもまだ問題があります。たぶんあなたはそれを解決する手掛かりを持っています。 – chris579

関連する問題