विजुअलस्टेट प्रबंधक और जेनरेट किए गए संक्रमण

Question

बस जब मुझे लगता है कि मैं VisualStateManager समझता हूं, तो कुछ मुझे गलत साबित करता है।

मैं WPF 4 का उपयोग कर रहा हूं और माउस पर एक आइटम को बड़ा करने की कोशिश कर रहा हूं, और इसे माउस छोड़ने पर वापस सिकुड़ रहा हूं। मैं सोचा मैं सिर्फ एक VisualStateGroup में प्रत्येक राज्य निर्धारित करेंगे और उसके बाद निर्दिष्ट एक एक GeneratedDuration साथ VisualTransition:

<Border x:Name="PART_Root" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" RenderTransformOrigin="0.5,0.5"> 
    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup Name="CommonStates"> 
      <VisualStateGroup.Transitions> 
       <VisualTransition GeneratedDuration="0:0:1"/> 
      </VisualStateGroup.Transitions> 

      <VisualState Name="Normal"/> 

      <VisualState Name="MouseOver"> 
       <Storyboard> 
        <DoubleAnimation Storyboard.TargetName="scaleTransform" Storyboard.TargetProperty="ScaleX" To="1.5" Duration="0"/> 
        <DoubleAnimation Storyboard.TargetName="scaleTransform" Storyboard.TargetProperty="ScaleY" To="1.5" Duration="0"/> 
       </Storyboard> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 

    <Border.RenderTransform> 
     <ScaleTransform x:Name="scaleTransform" ScaleX="1" ScaleY="1"/> 
    </Border.RenderTransform> 

    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
</Border> 

जब से मैं एक कैच-ऑल एक GeneratedDuration साथ VisualTransition, मैं वीएसएम मध्यवर्ती एनिमेशन उत्पन्न करने के लिए उम्मीद कर रहा था की है। यही है, नियंत्रण पर ध्यान देने से 1 सेकंड के दौरान 1 से 1.5 तक ScaleTransform गुणों को एनिमेट करना चाहिए। आवास बंद के साथ ही।

<VisualStateGroup.Transitions> 
    <VisualTransition From="Normal" To="MouseOver"> 
     <Storyboard> 
      <DoubleAnimation Storyboard.TargetName="scaleTransform" Storyboard.TargetProperty="ScaleX" To="1.5" Duration="{StaticResource MouseEnterDuration}"/> 
      <DoubleAnimation Storyboard.TargetName="scaleTransform" Storyboard.TargetProperty="ScaleY" To="1.5" Duration="{StaticResource MouseEnterDuration}"/> 
     </Storyboard> 
    </VisualTransition> 

    <VisualTransition From="MouseOver" To="Normal"> 
     <Storyboard> 
      <DoubleAnimation Storyboard.TargetName="scaleTransform" Storyboard.TargetProperty="ScaleX" To="1" Duration="{StaticResource MouseLeaveDuration}"/> 
      <DoubleAnimation Storyboard.TargetName="scaleTransform" Storyboard.TargetProperty="ScaleY" To="1" Duration="{StaticResource MouseLeaveDuration}"/> 
     </Storyboard> 
    </VisualTransition> 
</VisualStateGroup.Transitions> 

लेकिन क्यों: इसके बजाय, 1 सेकंड की देरी और उसके बाद ScaleTransform गुण तुरंत करने के लिए 1.

वापस 1.5 लेना है या के रूप में तो इस प्रकार मैं वांछित व्यवहार मिलता है मैं मैन्युअल रूप से बदलाव का उल्लेख करते हैं है मुझे यह करना है? मैंने सोचा कि जेनरेट किए गए संक्रमणों का पूरा बिंदु यह था कि संक्रमण, आप जानते हैं, उत्पन्न होगा। मैं यहाँ क्या गलत समझ रहा हूँ?

अद्यतन: रिक के जवाब के अनुसार, मिश्रण कुछ है कि काम करता है उत्पन्न करता है। इस प्रकार, पीछे की ओर काम करने से मैंने यह निर्धारित किया कि यह वास्तव में तथ्य है कि मैं ScaleTransform का संदर्भ सीधे UIElement के माध्यम से करता हूं जिसमें यह शामिल है। मैं निम्नलिखित करने के लिए मेरे XAML बदल गया और यह के रूप में की उम्मीद काम करता है:

<Border x:Name="PART_Root" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" RenderTransformOrigin="0.5,0.5"> 
    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup Name="CommonStates"> 
      <VisualStateGroup.Transitions> 
       <VisualTransition From="Normal" To="MouseOver" GeneratedDuration="{StaticResource MouseEnterDuration}"/> 

       <VisualTransition From="MouseOver" To="Normal" GeneratedDuration="{StaticResource MouseLeaveDuration}"/> 
      </VisualStateGroup.Transitions> 

      <VisualState Name="Normal"/> 

      <VisualState Name="MouseOver"> 
       <Storyboard> 
        <DoubleAnimation Storyboard.TargetName="PART_Root" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)" To="{StaticResource MouseOverScale}" Duration="0"/> 
        <DoubleAnimation Storyboard.TargetName="PART_Root" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)" To="{StaticResource MouseOverScale}" Duration="0"/> 
       </Storyboard> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 

    <Border.RenderTransform> 
     <ScaleTransform/> 
    </Border.RenderTransform> 

    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
</Border> 

हास्यास्पद (और एक स्पष्ट बग) लगता है, लेकिन यह काम करता है।

धन्यवाद

Answer 1

मैं नहीं कह सकता कि मैं पूरी तरह से समझते क्यों यह जिस तरह से हम यह करने के लिए उम्मीद थी काम नहीं करता है, लेकिन इन स्थितियों में हम अभिव्यक्ति मिश्रण का उपयोग कर सकते कार्य को और क्या मार्कअप को देखने के लिए यह उत्तपन करता है। मुझे लगता है कि किया है और यहाँ एक काम उदाहरण अपने नमूने के आधार पर दिया गया है:

<Grid> 
    <Grid.Resources> 
     <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type Button}"> 
         <Border x:Name="PART_Root" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" RenderTransformOrigin="0.5,0.5"> 
          <Border.RenderTransform> 
           <TransformGroup> 
            <ScaleTransform/> 
            <SkewTransform/> 
            <RotateTransform/> 
            <TranslateTransform/> 
           </TransformGroup> 
          </Border.RenderTransform> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup Name="CommonStates"> 
            <VisualStateGroup.Transitions> 
             <VisualTransition GeneratedDuration="0:0:1"/> 
            </VisualStateGroup.Transitions> 
            <VisualState Name="Normal"/> 
            <VisualState x:Name="MouseOver"> 
             <Storyboard> 
              <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="PART_Root"> 
               <EasingDoubleKeyFrame KeyTime="0" Value="2"/> 
              </DoubleAnimationUsingKeyFrames> 
              <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="PART_Root"> 
               <EasingDoubleKeyFrame KeyTime="0" Value="2"/> 
              </DoubleAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
          <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
         </Border> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Grid.Resources> 
    <Button Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="75" Style="{StaticResource ButtonStyle1}"/> 
</Grid> 

हालांकि मिश्रण एक अधिक सामान्य समूह को बदलने का उपयोग करता है, मुख्य अंतर यह है कि हम देख सकते है कि स्टोरीबोर्ड लक्ष्य एक तत्व और उस के माध्यम से एक संपत्ति पथ स्केलिंग कारकों के लिए तत्व।