Silverlight 中的 Spritesheet

发布于 2024-11-03 21:47:32 字数 120 浏览 5 评论 0原文

有谁有在 Silverlight 中使用 spritesheet 的示例吗?我想剪辑图像,并在按下按钮时跳到下一帧。 (如果用户持续点击该按钮,它将看起来像一个动画)。我环顾四周,但没有找到我正在寻找的东西。感谢您的任何帮助。

Does anyone have an example of using a spritesheet in Silverlight? I'd like to clip the image and, when a button is pressed, jump to the next frame. (If the user keeps tapping the button, it'll look like an animation). I've looked around but haven't found exactly what I'm looking for. Thanks for any help.

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

扫码二维码加入Web技术交流群

发布评论

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

评论(2

相思碎 2024-11-10 21:47:32

以下内容将完全满足您的要求。您可以使用键盘上的向上 和向下 键在动画中向前和向后导航。

XAML

<Rectangle x:Name="imgRect">
    <Rectangle.Fill>
        <ImageBrush x:Name="imgBrush" ImageSource="walking_spritesheet.png" Stretch="None" AlignmentX="Left" AlignmentY="Top" />                    
    </Rectangle.Fill>
</Rectangle>

C#

        imgRect.Width = 240; //Set the width of an individual sprite
        imgRect.Height = 296; //Set the height of an individual sprite
        const int ximages = 6; //The number of sprites in each row
        const int yimages = 5; //The number of sprites in each column
        int currentRow = 0;
        int currentColumn = 0;

        TranslateTransform offsetTransform = new TranslateTransform();

        KeyDown += delegate(object sender, KeyEventArgs e)
        {
            switch (e.Key)
            {
                case Key.Up:
                    currentColumn--;
                    if (currentColumn < 0)
                    {
                        currentColumn = ximages -1;
                        if (currentRow == 0)
                        {
                            currentRow = yimages - 1;
                        }
                        else
                        {
                            currentRow--;
                        }
                    }                        
                    break;
                case Key.Down:
                    currentColumn++;
                    if (currentColumn == ximages)
                    {
                        currentColumn = 0;
                        if (currentRow == yimages - 1)
                        {
                            currentRow = 0;
                        }
                        else
                        {
                            currentRow++;
                        }
                    }
                    break;
                default:
                    break;
            }

            offsetTransform.X = -imgRect.Width * currentColumn;
            offsetTransform.Y = -imgRect.Height * currentRow;
            imgBrush.Transform = offsetTransform;

为了进行测试,请尝试使用以下图像 (1440x1480):
在此处输入图像描述

The following will do exactly what you're looking for. You can use the Up and Down keys on your keyboard to navigate forwards and backwards through the animation.

XAML

<Rectangle x:Name="imgRect">
    <Rectangle.Fill>
        <ImageBrush x:Name="imgBrush" ImageSource="walking_spritesheet.png" Stretch="None" AlignmentX="Left" AlignmentY="Top" />                    
    </Rectangle.Fill>
</Rectangle>

C#

        imgRect.Width = 240; //Set the width of an individual sprite
        imgRect.Height = 296; //Set the height of an individual sprite
        const int ximages = 6; //The number of sprites in each row
        const int yimages = 5; //The number of sprites in each column
        int currentRow = 0;
        int currentColumn = 0;

        TranslateTransform offsetTransform = new TranslateTransform();

        KeyDown += delegate(object sender, KeyEventArgs e)
        {
            switch (e.Key)
            {
                case Key.Up:
                    currentColumn--;
                    if (currentColumn < 0)
                    {
                        currentColumn = ximages -1;
                        if (currentRow == 0)
                        {
                            currentRow = yimages - 1;
                        }
                        else
                        {
                            currentRow--;
                        }
                    }                        
                    break;
                case Key.Down:
                    currentColumn++;
                    if (currentColumn == ximages)
                    {
                        currentColumn = 0;
                        if (currentRow == yimages - 1)
                        {
                            currentRow = 0;
                        }
                        else
                        {
                            currentRow++;
                        }
                    }
                    break;
                default:
                    break;
            }

            offsetTransform.X = -imgRect.Width * currentColumn;
            offsetTransform.Y = -imgRect.Height * currentRow;
            imgBrush.Transform = offsetTransform;

For testing, try using the following image (1440x1480):
enter image description here

櫻之舞 2024-11-10 21:47:32

这是另一个适用于您创建的任何精灵表的解决方案,只需添加关键代码即可。

如果您愿意使用 Sprite Vortex (实际上是一个特定版本),您可以使用以下类。您必须使用 Sprite Vortex 1.2.2,因为在较新的版本中 XML 格式已更改。确保您添加属性的 XML 文件更改为“不编译”。

如果您需要一个可行的示例,我可以向您发送一个非常简单的示例。

ps Sprite Vortex 应该做与其他程序相同的事情,但是 v 1.2.2 有很多错误,但还不错。

该课程在这里:http://pastebin.com/sNSa7xgQ

Here is another solution that works with any sprite sheet you create, just add the key code.

If you are willing to use Sprite Vortex (a specific version actually) you can use the following class. You have to use Sprite Vortex 1.2.2 because in the newer versions the XML format is changed. Make sure that the XML file you add the property is changed to "Do not compile".

If you need a working example I can send you a very simple one.

p.s. Sprite Vortex should do the same thing you use the other program for, however v 1.2.2 is pretty buggy but not too bad.

the class is here : http://pastebin.com/sNSa7xgQ

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文