Прокрутка экрана кредитов в WPF... идеи?

Я пытаюсь создать (возможно, 3D) экран прокрутки кредитов для моего приложения, который похож на то, что вы можете увидеть в конце фильма, но должен иметь возможность включать графику, анимацию и т. Д.

Каков наилучший способ сделать это? Я думаю, что мог бы создать очень высокий UserControl, который содержит весь контент для прокрутки, а затем просто анимировать его внутри ScrollViewer или даже просто Canvas и анимировать позицию, но есть очевидные проблемы с производительностью при выполнении чего-то подобного, и я Боюсь, это будет слишком медленно.

Было бы здорово, если бы титры могли прокручиваться на трехмерной поверхности, вроде Звездных войн, или с эффектом "рыбий глаз", но я знаю, что можно сказать о 3D в WPF.

Я определенно хочу, чтобы какое-то замирание / альфа-смешение было таким, чтобы титры постепенно исчезали внизу и / или исчезали вверху, но я также застрял на том, как это сделать.*

** На самом деле, для этого, я думаю, я мог бы наложить некоторый полупрозрачный градиент, если фон был сплошным цветом.*

Источник

2 ответа

Решение

Ну, так как никто, кажется, не имеет никаких комментариев, я пошел дальше и сделал вещи, как я описал, и должен сказать, что результаты довольно хорошие. Я использовал вертикальный LinearGradientBrush для затухания и просто анимировал UserControl внутри Canvas для прокрутки (анимация Canvas.Top из в (негативное)). Выглядит довольно хорошо:)

Вот анимация (обратите внимание, я должен был установить DoubleAnimation.To в коде на scroller.ActualHeight):

<DoubleAnimation
x:Name="scrollAnim"
BeginTime="0:0:30"
Duration="0:0:30"
From="200"
Storyboard.TargetName="scroller"
Storyboard.TargetProperty="(Canvas.Top)" />

И вот scroller элемент:

<Canvas
ClipToBounds="True"
x:Name="scrollerCanvas">
<Credits:ScrollingCredits
    x:Name="scroller"
    Canvas.Top="200"
    Width="{Binding ElementName=this, Path=ActualWidth}" />
</Canvas>

(Происходит еще кое-что, поэтому прокрутка начинается с 0:0:30.)

Вот фейдер:

<Border
x:Name="border"
Opacity="0">
<Border.Background>
    <LinearGradientBrush
        StartPoint="0,0"
        EndPoint="0,1">
        <GradientStop
            Offset="0"
            Color="Black" />
        <GradientStop
            Offset="0.2"
            Color="#00000000" />
        <GradientStop
            Offset="0.8"
            Color="#00000000" />
        <GradientStop
            Offset="1"
            Color="Black" />
    </LinearGradientBrush>
</Border.Background>
</Border>
Источник

Вы можете использовать VisualBrush, чтобы "нарисовать" свой кредитный пользовательский элемент управления на трехмерной поверхности.

Источник
Другие вопросы по тегам