- XAML Studio מאפשר לך לערוך ולצפות בתצוגה מקדימה של XAML בזמן אמת, עם אינטראקציה אמיתית בממשק.
- הוא כולל כלים מתקדמים כגון Binding Debugger, Data Context Editor ו-Visual Explorers.
- ניתן להוריד אותו מחנות מיקרוסופט או לקמפל אותו ממאגר הקוד הפתוח שלו תחת רישיון MIT.
- הוא מציע שליטה על טלמטריה ונועד להקל על תסכול עבור מעצבי Visual Studio.
אם אתם עובדים עם XAML כדי ליצור ממשקים ב-Windows , סביר להניח שנתקלתם בקשיים עם מעצב Visual Studio, זמני קומפילציה אינסופיים או שגיאות קשירת נתונים שקשה לאתר. כאן נכנס לתמונה XAML Studio, יישום שתוכנן בדיוק כדי לאפשר לכם לבדוק, לאתר באגים ולנסות עם XAML במהירות ועם פחות חיכוך.
לאורך מאמר זה, נבחן בפירוט מהו XAML Studio, כיצד הוא עוזר לכם ליצור אב טיפוס של ממשקי WinUI ו-UWP תוך דקות, אילו כלים הוא מציע לאיתור באגים של קישורים, ניהול נתוני בדיקה, ניווט בעץ הוויזואלי ועוד. תראו גם כיצד להוריד אותו מחנות Microsoft, מהן הדרישות אם תרצו לקמפל אותו מקוד המקור, וכיצד כל זה משתלב בהקשר הנוכחי של מפתחים שמאסו במקצת במעצבי Visual Studio.
מה זה XAML Studio ולמי הוא מיועד?
XAML Studio הוא יישום Windows המתמקד בפיתוח XAML , שנוצר במקור כפרויקט של Microsoft Garage וכעת יצא כפרויקט קוד פתוח בתוך .NET Foundation. מטרתו העיקרית היא לאפשר לך לכתוב XAML, לראות אותו פועל באופן מיידי ולקיים אינטראקציה עם הממשק כאילו היה חלק מהאפליקציה שלך.
זה מכוון במיוחד למפתחים שעובדים עם יישומי WinUI XAML ו- UWP , למרות שזה גם מאוד שימושי אם אתם מגיעים מ-WPF ורוצים להתנסות עם מושגי עיצוב, סגנונות, תבניות ומצבים חזותיים מודרניים של Fluent מבלי שתצטרכו לבנות פתרון שלם בכל פעם.
בניגוד ל-Visual Studio, שמכוון יותר למחזור הפיתוח המלא, XAML Studio משמש כמעבדת רעיונות עבור השכבה הוויזואלית : מעתיקים קטע XAML, מדביקים אותו, מתאימים אותו, רואים את התוצאה באופן מיידי, משחקים עם הנתונים, בודקים קישורים, וכשאתם מרוצים, לוקחים את הקוד לפרויקט האמיתי שלכם.
יתר על כן, בהיותו פרויקט קוד פתוח, התפתחותו פתוחה לקהילה: כל מפתח יכול לעיין בקוד, להציע שינויים , להגיש שיפורים ולהשתתף בדיון על תכונות חדשות דרך המאגר הציבורי.
תכונות עיקריות של XAML Studio עבור ממשקים לבניית אבות טיפוס
אחת מיתרונותיה של XAML Studio היא שהוא מאחד סט כלים ביישום אחד, המיועד לבדיקת עיצובים, יצירת פריסות מסך וניפוי שגיאות בקישורים עם זמן השבתה מינימלי. זה לא רק מציג XAML, אלא סביבה אינטראקטיבית לאיטרציות מהירות בממשק המשתמש שלך.
בין היכולות החשובות ביותר שלו נמצאת עריכה חיה: ניתן לכתוב או לשנות קוד XAML בעורך ולראות באופן מיידי תצוגה מקדימה פונקציונלית במלואה . חלון תצוגה מקדימה זה מאפשר אינטראקציה אמיתית: לחיצה על כפתורים, שינוי מצבים, הזזת מחוונים או בדיקת התנהגויות בדיוק כפי שהיית עושה באפליקציה הסופית.
מאפיין בולט נוסף הוא היכולת להתנסות בניווט XAML באמצעות שביל פירורי לחם. זה מאפשר לך לנוע בקלות בין מבנים מורכבים, לראות בדיוק היכן בעץ אתה עובד ולאתר במהירות את האלמנטים שברצונך להתאים.
בנוסף, XAML Studio כולל קבוצה של קיצורי דרך ואפשרויות תצוגה מקדימה מהירה: טעינה מחדש של תוכן, הפעלת רשתות יישור, החלת חיתוך או שינוי ערכות נושא, והכל מתפריט גישה מהירה שנועד לייעל את מחזור הניסוי והטעייה.
עריכה חיה ואינטראקציה עם תצוגה מקדימה
הבסיס של XAML Studio הוא מערכת עריכה ואינטראקציה חיה , תכונת עריכה חיה שמבטלת את הצורך לקמפל את הפתרון כולו בכל פעם שמשנים צבע, מרווח או תבנית. אתם כותבים קוד, שומרים אותו או אפילו משאירים אותו לא נשמר, והממשק מתרענן כך שתוכלו לראות את התוצאה באופן מיידי.
תצוגה מקדימה זו אינטראקטיבית לחלוטין, כלומר ניתן לבחון התנהגויות ממשק בעולם האמיתי : לנווט בין פקדים, להפעיל אירועים ולראות כיצד אלמנטים מתנהגים כאשר סגנונות, טריגרים ומצבים חזותיים משולבים. זוהי הצלה עבור אבות טיפוס מכיוון שהיא עוזרת לך להחליט הרבה יותר מהר מה נראה טוב ומה לא.
יתר על כן, XAML Studio כולל קווי יישור על פני השטח של העיצוב , מה שמקל על מיקום אלמנטים באופן עקבי וזיהוי חוסר יישור שאחרת עלולים להיעלם. זה מאפשר לך להשיג פריסה נקייה יותר מבלי לבצע אינספור התאמות שוליים עיוורים.
במערכות עיצוב מורכבות, שבהן WinUI ו-Fluent מציעים אפשרויות רבות עם צללים, קצוות מעוגלים ועיצובים אדפטיביים, תצוגה מקדימה אינטראקטיבית משולבת היטב עוזרת לכם להימנע מהרבה מהתסכול האופייני לכוונון עדין בייצור.
ניפוי באגים של קישורים וחקר העץ החזותי
אחת מכאבי הראש האמיתיים ב-WPF, UWP או WinUI היא שגיאות קשירת נתונים שקטות . כאשר קשירה נכשלת, לעתים קרובות רואים רק ערך ריק ומעט מעבר לכך, מה שמקשה על הבנת מה קורה. XAML Studio כולל ניפוי שגיאות קשירה שנועד לשפוך אור על בעיות מסוג זה.
בעזרת ניפוי הבאגים של קשירה, תוכלו לבדוק באופן ויזואלי כיצד מאפייני המודל שלכם מתחברים לבקרות בממשק. הכלי מציג את הסטטוס של כל קשירה, הערכים האחרונים שבהם נעשה שימוש , ועוזר לכם לאתר במהירות איזו קשירה נכשלת ומדוע. עבור דגמים מורכבים עם כמויות גדולות של נתונים, זה חוסך זמן משמעותי.
בהקשר לכך, XAML Studio משלב חוקרים חזותיים של עצים ומצבים חזותיים , הנגישים מלוח המאפיינים. חוקרים חזותיים של עצים מציגים את ההיררכיה המלאה של פקדים ואלמנטים המרכיבים את המסך, ומאפשרים לבחור כל צומת ולהציג את המאפיינים, הסגנונות והקשרים שלו.
בינתיים, חוקר המצבים החזותי מאפשר לראות בקלות ולעבור בין מצבים שונים של תצוגה (לדוגמה, רגיל, מחודד, לחוץ, מושבת), וזה חיוני כשעובדים עם פקדים מותאמים אישית או תבניות מתקדמות. זה מאפשר לך לבדוק במהירות כיצד כל מצב משפיע על העיצוב שלך מבלי שתצטרך לכפות ידנית כל סיטואציה ביישום עצמו.
ניהול נתונים עם עורך ההקשר של נתונים
בדיקת ממשק ללא נתונים אמיתיים היא כמו עיצוב עיוור. זו הסיבה ש-XAML Studio כולל עורך הקשר נתונים , כלי המאפשר לך להגדיר בקלות את הקשר הנתונים של התצוגה שלך כדי לאכלס אותה במידע בדיקה.
מעורך זה, ניתן לחבר את ממשק המשתמש למקורות נתונים סטטיים ודינמיים כאחד: לדוגמה, ניתן לטעון JSON מקובץ מקומי או מ-REST API ולהשתמש בו כ-DataContext עבור הפקדים. זה מאפשר לראות כיצד הפריסה מתנהגת עם טקסט ארוך, אוספים גדולים או ערכי גבול, דבר חיוני לעיצוב חזק.
יכולת זו לשלב XAML עם נתוני בדיקה, מבלי שתצטרכו להגדיר את כל תשתית האפליקציה שלכם, מאפשרת לכם לבצע איטרציות מהירות יותר על המראה החזותי וההפצה של המידע, וחוסכת לכם את הצורך בהגדרת פרויקטים לדוגמה אד-הוק רק כדי לראות כיצד נראה טופס עם נתונים אמיתיים.
XAML Studio יכול גם לשחזר מסמכים ואת הקשר הנתונים שלהם בעת פתיחת היישום מחדש, הודות למערכת השמירה האוטומטית שלו, שחוסכת לכם את הצורך להגדיר מחדש את מקור הנתונים בכל פעם שתרצו להמשיך לבדוק עיצוב ספציפי.
כלי פרודוקטיביות: IntelliSense, שמירה אוטומטית ועוד
בנוסף לתכונות הוויזואליות גרידא, XAML Studio משלב מספר כלי פרודוקטיביות המקלים על העבודה היומיומית שלך בעת כתיבה אינטנסיבית של XAML . אחד השימושיים ביותר הוא תמיכה ב-IntelliSense, המציעה מאפיינים, סוגים, שמות פקדים ומרחבי שמות תוך כדי הקלדה.
IntelliSense זה לא רק מאיץ את כתיבת הקוד, אלא גם מסייע במניעת שגיאות הקלדה בקישורים, נתיבים ומאפיינים , במיוחד במבנים ארוכים של סגנונות, תבניות או משאבים משותפים. אם אתם כבר מכירים את IntelliSense ב-Visual Studio, תרגישו בבית.
תכונה מעשית נוספת היא שמירה ושחזור אוטומטיים של מסמכים . XAML Studio יכול לשמור אוטומטית את עבודתך, וכאשר תפתח מחדש את היישום, לאחזר את הכרטיסיות והמסמכים שבהם השתמשת, כך שתוכל להמשיך בדיוק מהמקום בו הפסקתם מבלי שתצטרכו לפתוח קבצים אחד אחד.
הממשק כולל ארגז כלים לתיעוד המשמש כקיצור דרך לדוגמאות, עזרה והפניות לבקרות ומאפיינים. זה מאפשר לך לעיין בתיעוד מבלי לצאת מהכלי , וזה נוח במיוחד בעת בדיקת ממשקי API פחות מוכרים או מאפיינים ספציפיים ל-WinUI.
עזרי עיצוב: ממשק משתמש שוטף, מדריכים ומרחבי שמות
גרסאות אחרונות של הפרויקט כללו ממשק משופץ המבוסס על Fluent UI , מערכת העיצוב המודרנית של מיקרוסופט. עדכון זה ניכר הן במראה החזותי של הכלי והן באופן שבו הוא משלב פקדים, ערכות נושא ופריסות נוכחיים.
כדי לעזור לכם עם הפריסה, XAML Studio כולל מדריכי יישור ורשתות במשטח התצוגה המקדימה. מדריכים אלה מקלים על יישור שוליים, ריפוד ופריסות, והם שימושיים במיוחד כשאתם מנסים לשכפל עיצובים מושלמים לפיקסלים או כשאתם רוצים לוודא שהאלמנטים מיושרים כראוי מבלי שתצטרכו למדוד הכל באופן ידני.
תחום נוסף שבו הכלי עוזר הוא ניהול מרחבי שמות של XAML. בעזרת עוזרי מרחב השמות שלו, ניתן להוסיף ולתקן קבצי xml בצורה יעילה יותר, תוך הימנעות מהבעיה הנפוצה של הצהרות לא שלמות או כפולות שמפריעות לעיצוב או יוצרות אזהרות מעצבנות.
שיפורים קטנים לשימוש יומיומי שולבו גם כן, כגון היכולת לשכפל כרטיסיות פתוחות מתפריט ההקשר , וזה נהדר כשרוצים להתנסות בשתי וריאציות של אותה פריסה מבלי לאבד את הגרסה המקורית או ליצור קובץ חדש מאפס.
תמיכה בתיקיות וניהול משאבים
אחת ההתפתחויות העיקריות ב-XAML Studio הייתה תמיכה בתיקיות ומשאבים חיצוניים . משמעות הדבר היא שניתן לעבוד עם קבוצה של קבצים קשורים, ולא רק עם קובץ XAML בודד.
הודות לתכונה זו, האפליקציה יכולה להתמודד עם טעינת תמונות מתיקיות, קבצי נתוני עיצוב ומשאבים משלימים אחרים שבדרך כלל נלווים לממשקים בפועל. לדוגמה, ייתכן שיהיה לכם סט של תמונות בדיקה עבור קרוסלה, סמלים לכפתורים או קבצי JSON המשמשים כמקור נתונים.
תמיכה זו בתיקיות מקרבת את XAML Studio הרבה יותר לזרימת עבודה בעולם האמיתי, במקום להיות סתם ארגז חול פשוט. היא מאפשרת לך להגדיר תרחישי בדיקה קטנים המחקים את מבנה המשאבים של יישום מלא , אך עם האופי הקל של סביבה שנועדה אך ורק לבניית אבות טיפוס.
כל זה, בשילוב עם שאר כלי התצוגה המקדימה, הקישור והניווט, הופך את XAML Studio לאופציה אטרקטיבית מאוד עבור אלו המעוניינים לחדד את המסכים שלהם לפני שילובם בפתרון כבד משקל.
הורדה מחנות מיקרוסופט והתקנה ידנית
עבור רוב המשתמשים, הדרך הקלה ביותר להתחיל היא להוריד את XAML Studio ישירות מחנות Microsoft . הוא זמין שם כאפליקציה חינמית, כך שכל מה שצריך לעשות הוא לחפש אותו, להתקין אותו ולהתחיל להתנסות עם XAML תוך דקות.
גרסת החנות, לפי המידע הזמין, עדיין נמצאת בענף 1.1, בעוד שהפיתוח הפעיל ביותר מתבצע בענף הפיתוח של מאגר הפרויקטים. זה חשוב אם ברצונך לגשת לתכונות העדכניות ביותר או לתרום לפיתוח, מכיוון שייתכנו הבדלים בין מה שאתה רואה בחנות לבין מה שנמצא בקוד המקור.
אם אתם מעדיפים להתקין אותו ידנית מהמאגר, או לקמפל אותו בעצמכם, ישנן מספר דרישות מינימום הקשורות ל-Visual Studio שעליכם לזכור כדי להבטיח שהכל יעבוד כראוי.
קומפילציה של XAML Studio מקוד המקור
אם ברצונך ללכת צעד קדימה ולקמפל את XAML Studio מקוד המקור שלו , תצטרך להכין את הסביבה שלך ב-Visual Studio עם רכיבים ספציפיים המכוונים לפיתוח יישומי Windows מודרניים.
ראשית, עליך להתקין את עומס העבודה של פיתוח יישומי Windows ב-Visual Studio. עומס עבודה זה כולל את כל מה שקשור ליישומי UWP, WinUI וטכנולוגיות XAML מודרניות אחרות בפלטפורמת Windows.
בנוסף, תצטרכו להתקין את כלי פלטפורמת Windows האוניברסלית , כמו גם את ערכת פיתוח התוכנה הספציפית של Windows 17763. ללא ערכת פיתוח תוכנה זו, ייתכן שחלקים מסוימים בפרויקט לא יעברו קומפילציה נכונה, לכן מומלץ לבדוק זאת במתקין Visual Studio לפני פתיחת הפתרון.
לאחר שכל הרכיבים נמצאים ברשותכם, כשאתם פותחים את המאגר, ודאו שהפרויקט שנקרא XAMLStudio מסומן כפרויקט ההפעלה בתוך הפתרון. לאחר מכן, פשוט לחצו על F5 כדי להפעיל את האפליקציה במצב ניפוי שגיאות ולהפעיל אותה מסביבת הפיתוח שלכם.
פרויקט קוד פתוח, רישיונות וקוד התנהגות
מכיוון שהוא פורסם כפרויקט .NET Foundation , XAML Studio מופץ תחת רישיון MIT, אחד מרישיונות הקוד הפתוח המתירניים ביותר. משמעות הדבר היא שניתן לעיין, לשנות, לעשות שימוש חוזר ולתרום לקוד באופן חופשי למדי, כל עוד מכבדים את תנאי הייחוס הרגילים.
המאגר כולל קובץ NOTICE.json עם ייחוסים של צד שלישי , התואם את המידע המוצג בתוך האפליקציה עצמה בנוגע לספריות החיצוניות בהן נעשה שימוש. אם אתם מודאגים לגבי תאימות רישיונות בסביבות ארגוניות, קובץ זה הוא מקור שימושי לבדיקת אילו רכיבים שולבו.
הפרויקט אימץ את קוד ההתנהגות של מיקרוסופט בקוד פתוח , כך שהשתתפות בנושאים, בקשות משיכה או דיונים מחייבת הקפדה על כללי התנהגות ברורים: כבוד, מקצועיות ואפס סובלנות להטרדה. ישנו גם דף שאלות נפוצות בנוגע לקוד ההתנהגות וכתובת ליצירת קשר ( [email protected] ) לשאלות או בעיות.
עבור אלו המעוניינים לשתף פעולה באופן פעיל, קובץ CONTRIBUTING.md מתאר כיצד להציע שינויים, להגיש תרומות ולדווח על בעיות . הוא מפרט את הדרך המומלצת לעבודה עם ענפים, את תהליך העבודה של סקירת הקוד והיבטים מעשיים אחרים של שיתוף פעולה בפרויקט.
טלמטריה, פרטיות ואיסוף נתונים
כמו יישומים מודרניים רבים אחרים, XAML Studio כלל מנגנוני טלמטריה לאיסוף מידע על השימוש , במטרה להבין אילו תכונות נמצאות בשימוש הרב ביותר, כיצד האפליקציה מתפקדת בגדלי מסמכים שונים, ואילו סוגי שגיאות מתרחשות בתדירות הגבוהה ביותר.
החדשות הטובות הן שהאפליקציה עצמה מציעה שליטה ברורה על טלמטריה זו: מדף ההגדרות, במקטע משוב , ניתן לשנות את האפשרות נתוני אבחון ל"לא" כדי להשבית איסוף נתונים מהאפליקציה המבוזרת עצמה.
ראוי לציין כי, על פי מידע מהפרויקט, App Center - הפלטפורמה המשמשת כבסיס לטלמטריה - הוצא משימוש, וכרגע, טלמטריה אקטיבית אינה בשימוש בגרסה v2 בזמן שמחליטים על פתרון חלופי לאבחון.
בכל מקרה, מיקרוסופט מצהירה כי התוכנה עשויה לאסוף מידע על השימוש ביישומים, אשר עשוי לשמש לשיפור שירותים ומוצרים . אם אתה, כמפתח, משתמש בתכונות שעשויות לאסוף נתוני משתמשי קצה (לדוגמה, שילובי שירותים באפליקציות שלך), עליך לציית לחוק החל ולספק הודעות ומדיניות פרטיות מתאימות, תוך קישור להצהרת הפרטיות של מיקרוסופט במידת הצורך.
מותג, לוגואים ושימוש בסימנים מסחריים
המאגר והאפליקציה עצמה עשויים להכיל סימנים מסחריים ולוגואים של מיקרוסופט או של צדדים שלישיים אחרים. הפרויקט מבהיר כי השימוש בסימנים מסחריים אלה כפוף להנחיות המיתוג הרשמיות של מיקרוסופט.
אם תחליט ליצור גרסאות שונות של הפרויקט או הפצות חלופיות, עליך לעשות זאת באופן שלא יגרום לבלבול או ירמז על חסות רשמית מצד מיקרוסופט כאשר לא קיים קשר כזה. כלל זה חשוב במיוחד אם אתה מפיץ מחדש קבצים בינאריים או משלב חלקים מהפרויקט במוצרים מסחריים.
באופן דומה, כל לוגו או סימן מסחרי של צד שלישי המשמש בקוד כפוף למדיניות של אותם צדדים שלישיים, לכן מומלץ לבחון היבטים אלה אם אתם מתכוונים לעשות שימוש חוזר בחלקים גדולים מהאפליקציה בפרויקטים הציבוריים שלכם.
הקשר: תסכול ממעצבי Visual Studio והערך של XAML Studio
שחרורו של XAML Studio כפרויקט קוד פתוח הגיע בתקופה בה מפתחים רבים הביעו חוסר שביעות רצון מהמעצבים הוויזואליים של Visual Studio . בעיות ביצועים, קריסות, התנהגות לא עקבית וקשיים באיתור ניפוי שגיאות ב-XAML מורכב היו תלונות חוזרות ונשנות.
בתרחיש זה, XAML Studio נתפס כמעין שסתום מילוט: כלי קל משקל, המתמקד במיוחד בתכנון ובדיקות XAML, שמפחית חלק מהחיכוך של מחזור העריכה-קומפילציה-הרצה המסורתי. הוא אינו שואף להחליף את Visual Studio, אלא להשלים את המומחיות שלו בתחום שבו זה הכי פוגע: איטרציה מהירה בממשק.
גישה זו מתיישבת גם עם החששות של טכנולוגיות למידה כמו WinUI, WPF או UWP. עבור רבים, השילוב של קבצי .sln, תצורות מורכבות ואריזה לקבצי הרצה יכול להיות כאב ראש של ממש, במיוחד בהתחלה. כלי עצמאי שמתמקד אך ורק בשכבת ה-XAML הופך את תהליך הלמידה והניסוי לחלק הרבה יותר.
בקיצור, XAML Studio מצאה את הנישה שלה כיישום מוערך מאוד עבור אלו המקדישים חלק ניכר מזמנם לבנייה ושיפור ממשקי משתמש במערכת האקולוגית של Windows, ומציעה סביבה גמישה יותר ופחות מסורבלת לתמרון XAML על בסיס יומי.
עבור כל מי שמתחיל עם C#, WPF, UWP או WinUI, או עבור אלו שכבר סובלים מ-XAML אך עדיין מתקשים עם בדיקות איטיות וניפוי שגיאות מבלבל, כלי כמו XAML Studio בהישג יד מייצג שינוי משמעותי באופן שבו ניגשים לבניית אבות טיפוס , ניפוי שגיאות בקשרים מורכבים ואימות עיצובים לפני שילובם בפרויקטים גדולים - והכל עם הגמישות של פרויקט קוד פתוח והשקט הנפשי של היכולת לשלוט באילו נתונים משותפים וכיצד הם משמשים.
