Question

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

Image-scroller

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

感谢任何回答。

Answer 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。

自动图像滚动控制

1 个答案: