自动图像滚动控制

时间:2011-12-03 23:13:59

标签: .net wpf vb.net image

我需要“自动图像滚动”的帮助。场景非常简单。我有一张图片,它应该向上移动,当它移出框架时,同样的图片会出现在自身下方并继续向上移动。一种循环。

Image-scroller

问题在于我没有一个线索如何在代码隐藏 XAML 中实现它,但它必须写在“代码隐藏”中“事情我正在与之挂钩。

感谢任何回答。

1 个答案:

答案 0 :(得分:1)

以下是使用ImageBrush的示例,因为您不需要查看所述框架的外部:

<Border Height="300" Width="300">
    <Border.Style>
        <Style TargetType="{x:Type Border}">
            <Style.Triggers>
                <EventTrigger RoutedEvent="Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <RectAnimation Storyboard.TargetProperty="Background.(ImageBrush.Viewport)"
                                    To="0,0,1,1" RepeatBehavior="Forever" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Border.Style>
    <Border.Background>
        <ImageBrush
                ImageSource="http://www.gravatar.com/avatar/3736a467816b5100e6bac91847cae8b6?s=128&amp;d=identicon&amp;r=PG"
                Viewport="0,1,1,1" TileMode="Tile" />
    </Border.Background>
</Border>

作为一种C#方法(当然不需要分层样式,这只是更接近XAML,我希望你能阅读C#,如果不是this converter可能会非常方便):

private Border CreateScrollingImage(string path)
{
    var anim = new RectAnimation() { To = new Rect(0, 0, 1, 1), RepeatBehavior = RepeatBehavior.Forever };
    Storyboard.SetTargetProperty(anim, new PropertyPath("Background.(ImageBrush.Viewport)"));
    var imageConverter = new ImageSourceConverter();

    return new Border()
    {
        Width = 300, Height = 300,
        Style = new Style()
        {
            TargetType = typeof(Border),
            Triggers =
            {
                new System.Windows.EventTrigger()
                {
                    RoutedEvent = FrameworkElement.LoadedEvent,
                    Actions =
                    {
                        new BeginStoryboard()
                        {
                            Storyboard = new Storyboard()
                            {
                                Children =
                                {
                                    anim
                                }
                            }
                        }
                    }
                }
            }
        },
        Background = new ImageBrush()
        {
            ImageSource = (ImageSource)imageConverter.ConvertFromString(path),
            Viewport = new Rect(0, 1, 1, 1),
            TileMode = TileMode.Tile
        }
    };
}
controls.Add(CreateScrollingImage("http://www.gravatar.com/avatar/3736a467816b5100e6bac91847cae8b6?s=128&d=identicon&r=PG"));

如果您需要图片统一,可能需要更改Stretch上的ImageBrush