דוגמאות ב WPF

DORON AMIR TRAINING AND CONSULTING LTD ©
Microsoft Certified Trainer & Solution Developer
Mail: [email protected] Mobile: 0505994911
© ‫ * כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ‬.‫ אך מיועד לנשים וגברים כאחד‬,‫* המסמך רשום בלשון זכר מטעמי נוחות‬
WPF-Windows Presentation Foundation
W PF
Windows ‫ מספקת למפתחים מודל תכנות מאוחד לחוויית בניית יישומיי‬WPF ‫טכנולוגיית‬
.‫תקשורת ומסמכים‬,‫ חכמים המשלב ממשקי משתמש‬Client
: ‫מטרת התרגיל‬
‫ביצוע אנימציה לאליפסה ברגע לחיצה על הכפתור השמאלי של העכבר בפרויקט מסוג‬
.WPF Client Application
. ‫ הכולל הגדרות גלובאליות הקשורות ליישום‬App.xaml ‫ בשם‬XAML ‫ קובץ‬: ‫קבצים‬
.‫ המכיל את הגדרות התצוגה והאנימציה‬MainWindow.xaml ‫ בשם‬XAML ‫קובץ‬
. WPF Client Application ‫הקבצים נמצאים בפרויקט‬
.‫הגדרת תצורת האליפסה‬:‫מטרת הקוד‬
<Ellipse Width="200" Height="100" Fill="Green">
.‫ביצוע אנימציה לאליפסה בעת לחיצה על הכפתור השמאלי של העכבר‬:‫מטרת הקוד‬
<Ellipse.Triggers>
<EventTrigger RoutedEvent="Ellipse.MouseLeftButtonDown">
<BeginStoryboard>
<Storyboard TargetProperty="Width">
<DoubleAnimation Duration="0:0:5" From="0" To="200"
AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Ellipse.Triggers>
DORON AMIR TRAINING AND CONSULTING LTD ©
Microsoft Certified Trainer & Solution Developer
Mail: [email protected] Mobile: 0505994911
© ‫ * כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ‬.‫ אך מיועד לנשים וגברים כאחד‬,‫* המסמך רשום בלשון זכר מטעמי נוחות‬
:‫הסבר קוד‬
<Ellipse.Triggers>
.Ellipse (class)‫ למחלקה‬Trigger ‫הוספת‬
:‫הסבר קוד‬
<EventTrigger RoutedEvent="Ellipse.MouseLeftButtonDown">
‫ המבצע קבוצה של פעולות‬Trigger ‫ לייצג‬EventTrigger (class)‫תפקידה של המחלקה‬
.(Event)‫בתגובה לאירוע‬
.Trigger-‫( אשר יפעיל את ה‬Event)‫ מגדיר את האירוע‬RountedEvent Property-‫ה‬
:‫הסבר קוד‬
<BeginStoryboard>
<Storyboard TargetProperty="Width">
<DoubleAnimation Duration="0:0:5" From="0" To="200"
AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
-‫ להכיל את פעולות האנימציה המיועדות ל‬Storyboard (class) ‫תפקידה של המחלקה‬
‫ אליו אנו מעוניינים לבצע‬Property-‫ מגדיר את ה‬TargetProperty .‫ או לאובייקט‬Property
‫ אשר‬BeginStoryboard ‫ נגדיר אלמנט בשם‬Storyboard-‫על מנת להפעיל את ה‬.‫אנימציה‬
. ‫ ברגע הפעלתו‬Storyboard ‫ אל האלמנט‬Begin ‫יבצע קריאה למתודה‬
‫ בזמן‬Property ‫ של‬Double ‫ מעדכנת ערך מסוג‬DoubleAnimation (Class)‫המחלקה‬
. Duration – Property-‫מוגדר באמצעות ה‬
– Property-‫ מגדירים את תהליך האנימציה מהערך המצוין ב‬From -‫ ו‬To– Properties-‫ה‬
.To -Property-‫ אל הערך המצוין ב‬From
.‫ מגדיר האם לבצע חזרה בכל סיום איטרציה‬AutoReverse -Property-‫ה‬
DORON AMIR TRAINING AND CONSULTING LTD ©
Microsoft Certified Trainer & Solution Developer
Mail: [email protected] Mobile: 0505994911
© ‫ * כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ‬.‫ אך מיועד לנשים וגברים כאחד‬,‫* המסמך רשום בלשון זכר מטעמי נוחות‬
‫הקוד המלא‬
App.xaml : ‫קוד‬
<Application x:Class="Animation.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentati
on"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
<Application.Resources>
</Application.Resources>
</Application>
App.xaml.cs :‫קוד‬
using
using
using
using
using
using
System;
System.Collections.Generic;
System.Configuration;
System.Data;
System.Linq;
System.Windows;
namespace Animation
{ {
/// <summary>
/// Interaction logic for App.xaml
/// </summary>
public partial class App : Application
{
}
}
DORON AMIR TRAINING AND CONSULTING LTD ©
Microsoft Certified Trainer & Solution Developer
Mail: [email protected] Mobile: 0505994911
© ‫ * כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ‬.‫ אך מיועד לנשים וגברים כאחד‬,‫* המסמך רשום בלשון זכר מטעמי נוחות‬
MainWindow.xaml :‫קוד‬
<Window x:Class="Animation.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentati
on"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="300" Width="300">
<Grid>
<Ellipse Width="200" Height="100" Fill="Green">
<Ellipse.Triggers>
<EventTrigger
RoutedEvent="Ellipse.MouseLeftButtonDown">
TargetProperty="Width">
<BeginStoryboard>
<Storyboard
<DoubleAnimation
Duration="0:0:5" From="0" To="200" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Ellipse.Triggers>
</Ellipse>
</Grid>
</Window>
MainWindow.xaml.cs :‫קוד‬
using
using
using
using
using
using
using
using
using
using
System;
System.Collections.Generic;
System.Linq;
System.Text;
System.Windows;
System.Windows.Controls;
System.Windows.Data;
System.Windows.Documents;
System.Windows.Input;
System.Windows.Media;
DORON AMIR TRAINING AND CONSULTING LTD ©
Microsoft Certified Trainer & Solution Developer
Mail: [email protected] Mobile: 0505994911
© ‫ * כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ‬.‫ אך מיועד לנשים וגברים כאחד‬,‫* המסמך רשום בלשון זכר מטעמי נוחות‬
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace Animation
{ {
/// <summary>
/// Interaction logic for Window1.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
}
}
:‫מסכים‬
. MainWindow.xaml ‫הרצת קובץ‬
‫© ‪DORON AMIR TRAINING AND CONSULTING LTD‬‬
‫‪Microsoft Certified Trainer & Solution Developer‬‬
‫‪Mail: [email protected] Mobile: 0505994911‬‬
‫* המסמך רשום בלשון זכר מטעמי נוחות‪ ,‬אך מיועד לנשים וגברים כאחד‪ * .‬כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ ©‬
‫לאחר לחיצה על הלחצן השמאלי של העכבר‪,‬מתבצעת אנימציה של האליפסה‪.‬‬
‫© ‪DORON AMIR TRAINING AND CONSULTING LTD‬‬
‫‪Microsoft Certified Trainer & Solution Developer‬‬
‫‪Mail: [email protected] Mobile: 0505994911‬‬
‫* המסמך רשום בלשון זכר מטעמי נוחות‪ ,‬אך מיועד לנשים וגברים כאחד‪ * .‬כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ ©‬
‫מסך פרויקט‪:‬‬
‫סיכום כללי‪:‬‬
‫‪ (WPF) Windows Presentation Foundation‬מספקת קבוצה רבת עוצמה של גרפיקה‬
‫אשר מאפשרת לנו ליצור ממשקי משתמש )‪ (User Interface‬אטרקטיביים‪.‬‬
‫בדוגמא זו הראנו את יכולת אנימציה של ‪ WPF‬באמצעות קוד ‪ XAML‬בלבד לבצע אנימציה‬
‫לאליפסה ע"י האובייקט ‪ Storyboard‬אשר מאפשר לנו לבצע אנימציה ל‪.Property-‬‬
DORON AMIR TRAINING AND CONSULTING LTD ©
Microsoft Certified Trainer & Solution Developer
Mail: [email protected] Mobile: 0505994911
© ‫ * כל הזכויות שמורות לדורון אמיר יעוץ והדרכה בע"מ‬.‫ אך מיועד לנשים וגברים כאחד‬,‫* המסמך רשום בלשון זכר מטעמי נוחות‬