当前位置：文江博客话题详情

如何制作“打字”动画SketchFlow 中的文本？

发布于 2024-08-02 06:36:07 字数 431 浏览 8 评论 0原文

在 Microsoft 的 Expression Blend 3 SketchFlow 应用程序中。

您将如何对文本输入进行动画处理，最好是按角色时尚分阶段进行。就像用户正在输入一样。

关联的闪烁光标会使它变得完美，但这远远超出了“拥有就好”的范围。

关键帧动画系统不允许您操纵

共同财产>正文

字段，因此它不会作为动画关键帧中记录的更改持续存在。

我正在寻找编辑器步骤（使用某种其他控件）甚至 XAML 代码...

<VisualState>
    <StoryBoard>
        <DoubleAnimationUsingKeyFrame ... >

原文

In Microsoft's Expression Blend 3 SketchFlow application.

How would you go about animating the typing of text, ideally in staged character by character fashion. As if the user is typing it.

An associated flashing cursor would make it perfect, but that's far into the realm of "nice to have".

The keyframe animation system, does not allow you to manipulate the

Common Property > Text

field so therefore it doesn't persist as a recorded change in that keyframe of animation.

I'm looking for either editor steps (using some kind of other control) or even XAML code...

<VisualState>
    <StoryBoard>
        <DoubleAnimationUsingKeyFrame ... >

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

半步萧音过轻尘 2024-08-09 06:36:07

在使用涉及擦除动画的解决方案发表博客后文本块上的矩形的，一篇响应博客文章，其中包含使用自定义的更高级解决方案创建了附加到文本块的行为。

创建“TypeOnAction”行为并添加到 TextBlock，将提供逐个字符显示所需的效果，并具有可自定义的出现率。此处获取完整的代码示例。

public class TypeOnAction : TriggerAction<TextBlock>
{
    DispatcherTimer timer;
    int len = 1;

    public TypeOnAction()
    {
        timer = new DispatcherTimer();
    }

    protected override void Invoke(object o)
    {
        if (AssociatedObject == null)
            return;

        AssociatedObject.Text = "";
        timer.Interval = TimeSpan.FromSeconds(IntervalInSeconds);
        timer.Tick += new EventHandler(timer_Tick);
        len = 1;
        timer.Start();
    }

    void timer_Tick(object sender, EventArgs e)
    {
        if (len > 0 && len <= TypeOnText.Length)
        {
            AssociatedObject.Text = TypeOnText.Substring(0, len);
            len++;
            timer.Start();
        }
        else
            timer.Stop();
    }

    public string TypeOnText
    {
        get { return (string)GetValue(TypeOnTextProperty); }
        set { SetValue(TypeOnTextProperty, value); }
    }

    public static readonly DependencyProperty TypeOnTextProperty =
        DependencyProperty.Register("TypeOnText", typeof(string), typeof(TypeOnAction), new PropertyMetadata(""));

    public double IntervalInSeconds
    {
        get { return (double)GetValue(IntervalInSecondsProperty); }
        set { SetValue(IntervalInSecondsProperty, value); }
    }

    public static readonly DependencyProperty IntervalInSecondsProperty =
        DependencyProperty.Register("IntervalInSeconds", typeof(double), typeof(TypeOnAction), new PropertyMetadata(0.35));

}

After blogging about this with a solution involving a wipe animation of a rectangle over a text block, a response blog post with a more advanced solution of using a custom behavior attached to a text block was created.

Creating a 'TypeOnAction' behavior and adding to a TextBlock, will give the desired effect of character by character display, with a customizable appearance rate. Get the full code sample here.

public class TypeOnAction : TriggerAction<TextBlock>
{
    DispatcherTimer timer;
    int len = 1;

    public TypeOnAction()
    {
        timer = new DispatcherTimer();
    }

    protected override void Invoke(object o)
    {
        if (AssociatedObject == null)
            return;

        AssociatedObject.Text = "";
        timer.Interval = TimeSpan.FromSeconds(IntervalInSeconds);
        timer.Tick += new EventHandler(timer_Tick);
        len = 1;
        timer.Start();
    }

    void timer_Tick(object sender, EventArgs e)
    {
        if (len > 0 && len <= TypeOnText.Length)
        {
            AssociatedObject.Text = TypeOnText.Substring(0, len);
            len++;
            timer.Start();
        }
        else
            timer.Stop();
    }

    public string TypeOnText
    {
        get { return (string)GetValue(TypeOnTextProperty); }
        set { SetValue(TypeOnTextProperty, value); }
    }

    public static readonly DependencyProperty TypeOnTextProperty =
        DependencyProperty.Register("TypeOnText", typeof(string), typeof(TypeOnAction), new PropertyMetadata(""));

    public double IntervalInSeconds
    {
        get { return (double)GetValue(IntervalInSecondsProperty); }
        set { SetValue(IntervalInSecondsProperty, value); }
    }

    public static readonly DependencyProperty IntervalInSecondsProperty =
        DependencyProperty.Register("IntervalInSeconds", typeof(double), typeof(TypeOnAction), new PropertyMetadata(0.35));

}

回复收藏 0 原文

~没有更多了~