locked
אנימציית GIF ב WPF RRS feed

  • שאלה

  • היי, 

    אני רוצה לבצע איזושהי אנימציה על קובץ GIF, שהוא עצמו כולל אנימציה. נניח יש לי קובץ GIF שמכיל פרפר שכנפיו עפות, ואותו אני "מעיפה" במסלול הרצוי.

    הבעיה: WPF לא ממש תומך באנימציה של קובץ GIF.. 

    חיפשתי על זה המון, ומה שמצאתי וניסיתי:

    לשים בתוך MediaElement: הבעיה היא שמפסיק "להנפיש" את קובץ הGIF אחרי מספר פריימים.

    לשים בתוך PictureBox: משום מה לא מצליח למצוא לי את System.Windows.Forms.Integration.

    חשבתי גם ליצור בעצמי תמונה מונפשת בWPF (יש לי את התמונות שמרכיבות את הפריימים) אבל לא מצאתי איך.

    אשמח לעזרה..

    תודה רבה :)

    שבת 21 יולי 2012 20:37

תשובות

  • ניסיתי גם עם MediaElement. אם אני לא טועה MediaElement מאפשר להציג GIF, אך נתקע אחרי כמה פריימים..

    הפיתרון שמצאתי בסופו של דבר:

    הורדתי DLL מ CodePlex בשם WpfAnimatedGif. השימוש בו מאוד פשוט- זה הקוד, כולל הנעה במסלול החופשי:

    הוספתי את הניימספייס:

    xmlns:gif="http://wpfanimatedgif.codeplex.com"

    וזה הקוד:

       <Image gif:ImageBehavior.AnimatedSource="butterfly_2.gif" Width="180" Height="80">
                <Image.RenderTransform>
                    <TranslateTransform x:Name="AnimatedTranslateTransform"  />
                </Image.RenderTransform>
                <Image.Triggers>
                    <EventTrigger RoutedEvent="Path.Loaded">
                        <BeginStoryboard>
                            <Storyboard RepeatBehavior="Forever">
                                <DoubleAnimationUsingPath
                    Storyboard.TargetName="AnimatedTranslateTransform"
                    Storyboard.TargetProperty="X"
                    PathGeometry="{StaticResource AnimationPath}"
                    Source="X" 
                    Duration="0:0:5"  />
    
                                <DoubleAnimationUsingPath
                    Storyboard.TargetName="AnimatedTranslateTransform"
                    Storyboard.TargetProperty="Y"
                    PathGeometry="{StaticResource AnimationPath}"
                    Source="Y" 
                    Duration="0:0:5"  />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Image.Triggers>
            </Image>

    תודה בכל מקרה :)


    • נערך על-ידי RotemR10 יום שני 30 יולי 2012 09:06
    • סומן כתשובה על-ידי Elad R Katz יום שני 30 יולי 2012 10:53
    יום שני 30 יולי 2012 09:05

כל התגובות

  • נראה לי ש System.Windows.Forms.Integration זו הדרך הכי פשוטה ומהירה. שימי לב כי בשביל להשתמש בניימספייס הזה יש צורך להוסיף רפרנס לDLL המתאים (WindowsFormsIntegration)


    http://blogs.microsoft.co.il/blogs/eladkatz @ElatKt

    • הוצע כתשובה על-ידי Elad R Katz יום ראשון 22 יולי 2012 13:26
    • הצעה כתשובה בוטלה על-ידי Elad R Katz יום שני 30 יולי 2012 10:54
    יום ראשון 22 יולי 2012 12:18
  • ואיך אני מוסיפה רפרנס לDLL הזה? (אני מנסה ב Add Reference בטאב Net., ולא מוצאת שם. יש את System.Windows.Forms ואת System.Windows.Forms.DataVizualization. לא מצאתי DLL בשם WindowsFormsIntegration )

    תודה:)

    יום ראשון 22 יולי 2012 12:53
    • הוצע כתשובה על-ידי Elad R Katz יום שני 23 יולי 2012 08:07
    • הצעה כתשובה בוטלה על-ידי Elad R Katz יום שני 30 יולי 2012 10:54
    יום ראשון 22 יולי 2012 12:56
  • מצאתי, תודה רבה!
    יום ראשון 22 יולי 2012 13:09
  • הצלחתי להוסיף את ה PictureBox לזאמל, ואכן מופיעה לי תמונת GIF.

    אבל זה לא מספיק לי- אני רוצה להניע את התמונה במסלול שהגדרתי. משום מה אני לא מצליחה (ולא רואה משהו בעייתי בחלון ה Output). ניסיתי להכניס ל StackPanel ואותו להניע, אבל ג"כ זה לא זז.

    לעומת זאת, כשאני מכניסה לזאמל פקד אחר, נניח ComboBox- הוא זז במסלול שהגדרתי! מה שעוד יותר מוזר, שאם נניח אני מכניסה את הקומבו בתוך הגריד מחוץ ל StackPanel - אז בכל לחיצה על הקומבו תמונת ה GIF זזה, וסך התנועות יוצר מסלול שדומה למסלול שהגדרתי...

    הקוד:

    <Window.Resources> <PathGeometry x:Key="AnimationPath" Figures="M 0,0 C 35,0 135,0 160,100 180,190 285,200 310,100 585,300 180,190 160,100 135,0 35,0 0,0" PresentationOptions:Freeze="True" /> <PathGeometry x:Key="ellipse" Figures="M 200 50 A 150 100 0 0 1 200 250 A 150 100 0 0 1 200 50" /> </Window.Resources> <Grid Width="589" Height="400">

            <ComboBox Height="23" Name="comboBox1" Width="120" />

    <StackPanel> <wfi:WindowsFormsHost Height="200" Width="200" Margin="0"> <winForms:PictureBox x:Name="pictureBoxLoading" ImageLocation="C:\butterfly_2.gif" > </winForms:PictureBox> </wfi:WindowsFormsHost> <StackPanel.RenderTransform> <TranslateTransform x:Name="AnimatedTranslateTransform" /> </StackPanel.RenderTransform> <StackPanel.Triggers> <EventTrigger RoutedEvent="Path.Loaded"> <BeginStoryboard> <Storyboard RepeatBehavior="Forever"> <DoubleAnimationUsingPath Storyboard.TargetName="AnimatedTranslateTransform" Storyboard.TargetProperty="X" PathGeometry="{StaticResource AnimationPath}" Source="X" Duration="0:0:5" /> <DoubleAnimationUsingPath Storyboard.TargetName="AnimatedTranslateTransform" Storyboard.TargetProperty="Y" PathGeometry="{StaticResource AnimationPath}" Source="Y" Duration="0:0:5" /> </Storyboard> </BeginStoryboard> </EventTrigger> </StackPanel.Triggers> </StackPanel> </Grid>

    אשמח שתאירו את עיני :)

    תודה רבה!



    • נערך על-ידי RotemR10 יום שני 23 יולי 2012 18:04
    יום שני 23 יולי 2012 17:08
  • מעניין, אני מניח שזה באג - לא נתקלתי בזה בעבר.

    בכל אופן, להציע כיוון אחר - אולי תשתמש ב MediaElement? (מסתבר שהוא יודע לנגן קבצי גיפ)
    <MediaElement Source="1.gif" />


    http://blogs.microsoft.co.il/blogs/eladkatz @ElatKt

    יום ראשון 29 יולי 2012 14:25
  • ניסיתי גם עם MediaElement. אם אני לא טועה MediaElement מאפשר להציג GIF, אך נתקע אחרי כמה פריימים..

    הפיתרון שמצאתי בסופו של דבר:

    הורדתי DLL מ CodePlex בשם WpfAnimatedGif. השימוש בו מאוד פשוט- זה הקוד, כולל הנעה במסלול החופשי:

    הוספתי את הניימספייס:

    xmlns:gif="http://wpfanimatedgif.codeplex.com"

    וזה הקוד:

       <Image gif:ImageBehavior.AnimatedSource="butterfly_2.gif" Width="180" Height="80">
                <Image.RenderTransform>
                    <TranslateTransform x:Name="AnimatedTranslateTransform"  />
                </Image.RenderTransform>
                <Image.Triggers>
                    <EventTrigger RoutedEvent="Path.Loaded">
                        <BeginStoryboard>
                            <Storyboard RepeatBehavior="Forever">
                                <DoubleAnimationUsingPath
                    Storyboard.TargetName="AnimatedTranslateTransform"
                    Storyboard.TargetProperty="X"
                    PathGeometry="{StaticResource AnimationPath}"
                    Source="X" 
                    Duration="0:0:5"  />
    
                                <DoubleAnimationUsingPath
                    Storyboard.TargetName="AnimatedTranslateTransform"
                    Storyboard.TargetProperty="Y"
                    PathGeometry="{StaticResource AnimationPath}"
                    Source="Y" 
                    Duration="0:0:5"  />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Image.Triggers>
            </Image>

    תודה בכל מקרה :)


    • נערך על-ידי RotemR10 יום שני 30 יולי 2012 09:06
    • סומן כתשובה על-ידי Elad R Katz יום שני 30 יולי 2012 10:53
    יום שני 30 יולי 2012 09:05
  • שמח לשמוע שהסתדרת :)

    http://blogs.microsoft.co.il/blogs/eladkatz @ElatKt

    יום שני 30 יולי 2012 10:53