none
怎么做淡入淡出效果 RRS feed

  • 问题

  • 想用convas作一个对话框,点击按键后将convas的Visibility属性设置为visible,点击canvas上的按键再将Visibility属性还原,可是我想在点击按键的时候convas不是立马就出现 而是有那种淡入淡出的效果 该怎么实现呢?
    2012年1月11日 11:59

答案

  • 你好,你可以使用blend套件进行效果设计,淡入淡出效果的实现主要是控制不同时间轴下的透明度。

    2012年1月11日 14:34
  • 你好,

    你也可以使用Animation实现类似的功能,利用Canvas的Opacity属性,如下所示:

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <Canvas  Background="Red" Height="100"  HorizontalAlignment="Left" Margin="132,159,0,0" Name="canvas1" VerticalAlignment="Top" Width="200" >
                    <Canvas.Resources>
                        <Storyboard x:Name="myStoryboard">
                            <DoubleAnimation 
                    Storyboard.TargetName="canvas1" 
                    Storyboard.TargetProperty="Opacity" From="1"                 To="0" Duration="0:0:2" />                    
                        </Storyboard>
                        <Storyboard x:Name="myStoryboard2">
                            <DoubleAnimation 
                    Storyboard.TargetName="canvas1" 
                    Storyboard.TargetProperty="Opacity" From="0"                 To="1" Duration="0:0:2" />
                        </Storyboard>
                    </Canvas.Resources>            
                </Canvas>
                <Button Content="淡出" Height="72" HorizontalAlignment="Left" Margin="187,302,0,0" Name="button1" VerticalAlignment="Top" Width="160" Click="button1_Click" />
                <Button Content="淡入" Height="72" HorizontalAlignment="Left" Margin="187,380,0,0" Name="button2" VerticalAlignment="Top" Width="160" Click="button2_Click" />
            </Grid>
    
     private void button1_Click(object sender, RoutedEventArgs e)
            {
                myStoryboard.Begin();
            }
    
            private void button2_Click(object sender, RoutedEventArgs e)
            {
                myStoryboard2.Begin();
            }

    希望有所帮助。

    • 已标记为答案 poison123 2012年1月14日 7:29
    2012年1月12日 6:09
    版主

全部回复

  • 你好,你可以使用blend套件进行效果设计,淡入淡出效果的实现主要是控制不同时间轴下的透明度。

    2012年1月11日 14:34
  • 你好,

    你也可以使用Animation实现类似的功能,利用Canvas的Opacity属性,如下所示:

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <Canvas  Background="Red" Height="100"  HorizontalAlignment="Left" Margin="132,159,0,0" Name="canvas1" VerticalAlignment="Top" Width="200" >
                    <Canvas.Resources>
                        <Storyboard x:Name="myStoryboard">
                            <DoubleAnimation 
                    Storyboard.TargetName="canvas1" 
                    Storyboard.TargetProperty="Opacity" From="1"                 To="0" Duration="0:0:2" />                    
                        </Storyboard>
                        <Storyboard x:Name="myStoryboard2">
                            <DoubleAnimation 
                    Storyboard.TargetName="canvas1" 
                    Storyboard.TargetProperty="Opacity" From="0"                 To="1" Duration="0:0:2" />
                        </Storyboard>
                    </Canvas.Resources>            
                </Canvas>
                <Button Content="淡出" Height="72" HorizontalAlignment="Left" Margin="187,302,0,0" Name="button1" VerticalAlignment="Top" Width="160" Click="button1_Click" />
                <Button Content="淡入" Height="72" HorizontalAlignment="Left" Margin="187,380,0,0" Name="button2" VerticalAlignment="Top" Width="160" Click="button2_Click" />
            </Grid>
    
     private void button1_Click(object sender, RoutedEventArgs e)
            {
                myStoryboard.Begin();
            }
    
            private void button2_Click(object sender, RoutedEventArgs e)
            {
                myStoryboard2.Begin();
            }

    希望有所帮助。

    • 已标记为答案 poison123 2012年1月14日 7:29
    2012年1月12日 6:09
    版主