[Powered by Google Translate] [סמינר - Windows 8 - App / פיתוח משחקים עם HTML5]
[כריס בואן, אדווין Guarin - אוניברסיטת הרווארד]
[זה CS50. - CS50.TV]
>> היי, כולם. השם שלי הוא אדווין Guarin. זה כריס בואן.
אני אתן לו להציג את עצמו בשנייה.
אני רק רוצה לעשות הודעה מהירה.
קודם כל, כל מה שאתה CS50 תלמידים לקבל את Windows 8 בחינם.
אז אם אתה חושב על בעצם שימוש בו לפרויקט הגמר שלך, זה שלך.
נייט ישלח את הדוא"ל בהמשך לקבלת הוראות.
הדבר השני הוא אם אתה מחליט לכתוב אפליקציה Windows 8 לפרויקט גמר CS50 שלך,
אנחנו הולכים לעשות כמה מתנות: Xbox,
אנו עשויים להיות מסוגלים לתת צפחה משם, דברים כאלה.
אז אם יש משהו שעוצר אותך, תן לי כריס או אני יודע
איך אנחנו יכולים לעזור לך לבנות משהו ממש מגניב.
אז שוב תודה שבאתם היום, ואני למסור אותו לכריס.
>> תודה לך, אדווין.
תודה לכולם, שהצטרף אלינו היום.
אני כריס בואן. אני אחד מעמיתיו של אדווין כאן בצפון מזרח.
רק רציתי לבלות קצת זמן עם אתה מדבר
כיצד להפוך את היישום של Windows Store עם HTML5, JavaScript, ו-CSS
ולקבל סוג של כל שאלה שיש לך על זה ענתה לך
כמו שאתה מחפש כיוון לחשוב על אולי להשתמש בו להזדמנות גמר CS50.
>> שאמרו, אנחנו פשוט לצלול ישר פנימה
אני מתכוון לעבור על שקופיות לכאן.
אם יש לך שאלות כלשהן, אל תהסס לשלוח לי מייל.
אני cbowen@microsoft.com, ויש בבלוג שלי ושלי לצפצף.
עם זאת ברצונך ליצור קשר איתי, וזה בסדר.
יש לי בערך שעה של דברים, ואני רוצה לקבל את השאלות שלך בדרך,
אז אל תתביישו על כך שיש שאלות בתקופה זו.
הם לא יכולים לראות את מי שואלים שאלות על ההקלטה,
כך תוכל להיות אנונימי כמו שאתה רוצה להיות.
>> תן לי לצלול ממש, רק לתת לך מבוא קצר ל-Windows 8,
ולהראות לך כמה הדברים על אפליקציות Windows Store שאתה עשוי לשקול
כמו שאתה חושב על פיתוח יישום.
אנחנו מסתכלים על Windows 8. אנחנו כבר יצאנו לכמה שבועות.
הרבה אימוץ חזק בחוץ כבר.
יכול להיות שראיתם כבר את מכונות המשטח שיש לנו גם כן.
יש אחד כאן למעשה אתה יכול להעיף מבט על אם אתם כאן באופן אישי.
אני באמת רוצה לדבר איתך, להראות לך מסביב קצת על Windows 8.
הרעיון עם Windows 8, זה באמת להקדים את כל הדברים שאתה יודע על Windows
לכמה חוויות חדשות - בפרט, דברים כמו במכונה השטח עם מגע,
סוג של יותר מכשירים ניידים שנמצאים כעת בשוק אלה,
אבל זה גם Windows בליבה שלה.
אז זה אומר שאתה יכול להתקין אותו ממש על כל דבר שבו פועל Windows 7,
מהמתקן שלך הגדול ביותר המשולש SLI המשחקים עד למחשב הנייד שלך
והמבריק ההתקנים האחרים החדשים שלך, כי אתה עלול להרים היום.
הם להפעיל את Windows 8.
אני אראה לך סביב רק קצת,
ואת כל החוויות שאתה תראה כאן הן דברים שאתה יכול ליצור.
הרעיון הוא אם זה מגע, עכבר, מקלדת,
מה המכשיר הוא שאתה מפעיל את היישום שלך על, זה הולך לרוץ נהדר.
Windows 8 תעזור לך עם כל התרחישים הללו.
>> שקופיות אלה בצד, בואו פשוט לקבל זכות ללקיחת מבט כאן.
תן לי להראות לך סביב מסך הבית שלי. זה מסך ההתחלה שלי.
אני רק אתן לך קצת סיור כאן.
אני במכונה שאינו מגע, ולכן כל מה שאני רוצה לגעת במסך המחשב הנייד שלי,
זה לא יעשה דבר, אז אני פשוט לגלול פה קצת ולהראות לך.
יש דברים שייתכן שתבחינו הם העובדה כי אלה מה שנקראו אריחים חיים
למעשה יכול נפש, והם יכולים לספק לך מידע -
אולי עדכונים על סטטיסטיקות למשחק
או להראות לך חדשות מחלק מהאפליקציות הקודמות שנמצאות כאן בצד השמאל.
הנה. אני בטוח שזה רק חיובי וחדשות פנטסטי גדולות.
אתם יכולים לראות כאן זה באמת קורא את תשומת לבכם בחזרה לאותה האפליקציה, ואמר,
"היי, יש משהו חדש כאן. תסתכל. תחזור ובלראות מה חדש בשבילך."
זה נקרא אריחים חיים, ואתה יכול לעשות הודעות
או זכות מהיישום עצמו
או אם תסתכל בפירוט רב יותר, תוכל לגלות כיצד לכתוב שירות מרחוק
כי בעצם יכול לדחוף מידע לאריחים,
וזה מה שקורה עם אפליקציות החדשות הללו.
הם ממש מקבלים את החדשות מהענן ועדכון האריח ממש שם
כך שאנשים יודעים שיש סיבה לפתוח את היישום ותסתכל
בכל מה החדשות האחרונות היא בכל אחד מאלה
או אם יש מתכונים חדשים או ציון גבוה חדש כדי לנצח
או נגינת חבר או מה על יישומים אלה.
זה משהו כדי לפתות בחזרה אותך פנימה
אז זה האריחים חיים, וזה יכול להיות אדם, זה יכול להיות אתר אינטרנט גם כן.
בדרך כלל זה יישום.
>> פחות או יותר את כל הדברים האלה שיש לי כאן הגיעו מחלונות הראווה. אני נשיק את זה.
זה אחד מהיישומים שאתה מקבל כברירת מחדל
על כל מכונה שמפעילה את Windows 8.
אתה יכול לבוא לכאן כדי למצוא משהו שהיית רוצה,
מדברים שמודגשים למשחקים שלא ראיתי בעבר.
הו, וואו, יש לנו פינבול חדש כאן.
אתה יכול להתקין את אלה ממש כאן מהחנות,
ונדבר על איך לפתח את אלה.
יש לך הרבה אפשרויות באיך אתה יוצר אותם.
אנחנו להתמקד בסיפור JavaScript עם HTML ו-CSS,
אבל למשתמש, לרוכש של האפליקציה, זה לא משנה מה הוא נכתב בו
הם יכולים להמשיך ולעבוד עם זה.
אני מסוקרן זה, אז אני צריך לפתוח את זה ותסתכל.
כל יישום, כולל אלה שאתה יכול להגיש ולמכור או לתת אותו בחינם,
כל מה שאתה רוצה לעשות בחנות, יקבל את דף בית כמו זה.
ניתן להגיש עם הבקשה שלך חבורה של תמונות מסך - אתה רואה כמה כאן -
פרטים על היישום, ועם זמן תוכל לצבור שני דירוגים -
הם בעצם רק את דירוג הכוכבים - וחוות דעת,
אשר מספק קצת יותר תובנה.
למעשה, מישהו צריך להקליד משהו ולהגיד לך כמה מדהים אתה,
ושייכנס לקטע ביקורות שלך לכאן, שלא הסתכלתי.
פנטסטי. "אפילו לא ייפתח." עד כמה גדול.
ובכן, לאנשים שעבורם זה עשה פתוח וארוך, הם נראים באמת ליהנות ממנו. [צוחק]
שמור את זה בחשבון. האינטרנט. כל אחד יכול להגיד מה שהם רוצים על הבקשה שלך.
אז לוודא שאתה עושה עבודה נהדרת עם זה,
לוודא שאתה עושה את זה נוח ככל עבור המשתמש שאתה יכול
בגלל שהם בני זוג לוחץ ממתן חוות דעת,
ושיצטבר עד לדירוג הביקורת הכללי שלך.
ואתה רוצה לעשות את הכי טוב שלך, כי אתה הולך להיות מול יישומים אחרים.
יהיו אלפי יישומים כבר בחנות,
ורוב הסיכויים, ייתכן שיש משהו שעושה פונקציונליות דומה למה שאתה עושה.
אז אם אתה באמת יכול לבלוט בקהל, שהולך להיות לטובתך, כמובן.
>> אנחנו נגיע לחנות קצת יותר מאוחר.
אני באמת רוצה להתמקד ביצירת יישומים.
אבל הגרסה הקצרה של החנות היא הפצה בעולם,
זה באופן אוטומטי חלק של Windows 8, אנשים פשוט לפטר אותו ויסתכלו על אפליקציות שונות כאן,
יש לך הלבשת מדבקת הספר וכל מיני סוגים של אפליקציות שונות.
צבע טרי, אני משתמש בזה הרבה - בצורה גרועה, אבל אני משתמש בו הרבה.
זה מראה לי שאני כבר בבעלותה.
תן לי להראות לך משהו שאין לי - UVideos אין לי כמותג חדש.
אתה רואה כאן זה בחינם, כך שאתה יכול להתקין את זה נכון מהחנות.
יש לך יותר מדי אפשרויות. כמובן שאתה יכול לתת אותו.
אתה יכול לשים את פרסום באפליקציה או משחק.
אתה יכול גם לגבות תשלום עבור זה, ואתה יכול מאוד בקלות לספק משפט ליישום, כמו גם
כך שאתה יכול לתת לאנשים לנסות את זה במשך שבוע כל מה שאתה רוצה לעשות או.
זה רק להתאמה אישית באמצעות הפורטל. אתה לא כותב קוד כל בשביל זה.
אז אתה אומר, "אתה יכול להשתמש בזה במשך שבוע ואז אתה חייב לקנות את זה",
או שאתה יכול לעשות דברים כמו, "אתה יכול לשחק 3 הרמות הראשונות של המשחק הזה
"ואז אתה חייב לרכוש כדי לגשת לשאר."
גם אתה יכול אפילו לעשות רכישות בתוך היישום, כך שאתה יכול להגיד,
"יש לנו הרפתקאות או קבוצות של גרפיקה או דברים שאינן נעולות נוספות -
"מתכונים יותר שאינם נעולים -. אם אתה רוכש ערכות האלה מורחבות"
ואתה יכול לעשות את זה כל בתוך האפליקציה או המשחק עצמו.
אז, לגמרי תלוי בך, הבחירה שלך.
יש הרבה דברים שאתה יכול לעשות בחנות,
ואז בעצם אתה מגיש אותו לערוץ הסמכה.
אנחנו יכולים לדבר על כל שקצת מאוחר יותר, אבל זו המטרה.
אתה רוצה לקבל את החשיפה העולמית האפליקציה שלך בחנות כאן.
>> חזור על המסך התחל כאן, אני רוצה להראות לך מסביב קצת יותר.
אם אני להפעיל יישומים אלה, הרשו לי לתת לך דוגמא של חלק מהפונקציונליות של אפליקציה צולבת כאן.
כדי לעשות זאת, אני נשיק צבע טרי.
דבר אחד שתראה כאן הוא כל ביט אחד של המסך,
כל הפיקסלים של המסך, ללכת לאפליקציה שלך.
חלפו ימים שבם יש לך גבולות אלה סביב חלונות
עם המון כפתורים, כי הם תמיד שם תופסים מקום כל הזמן.
עכשיו אתה באמת רוצה להתרחק מזה ורק צריך את התוכן שלך להיות המוקד.
אנחנו יכולים לעשות דברים עם Windows על ידי גישה לסוגים אחרים של תפריטים.
אחד מהם הוא למעשה מה שנקרא בר הקמעות,
וזה יוצא מהצד השני של המסך.
למעשה אתה יכול בהינף מהצד אם יש לך מסך מגע,
נכון שאתה יכול ללחוץ אם יש לך עכבר, יש קיצור מקשים עבורו,
תמיד יש יותר מדרך אחת לעשות משהו בסביבה כאן.
זה מביא את מספר של דברים שאתה יכול לעשות.
הברור ביותר הוא שאתה יכול לחזור למסך פתיחה,
אבל 4 האחרים הם מה שנקראו קסם.
הם חוזים, כי אתה יכול לחבר אל כמפתחת אפליקציה. הם די מגניבים.
חיפוש, אני בטוח שזה משהו שאתה הולך לעשות,
שיתוף אני אראה לך בשנייה,
והתקנים והגדרות, כל אלה הם דברים שהאפליקציה שלך יכולה לחבר אל
למנף את Windows, כדי לומר, "אני כבר עשיתי את החלק שלי
"ואני רוצה Windows כדי לתמוך בחלק מהפונקציונליות של אחרת,
"ואני לא רוצה לכתוב הרבה קוד כדי שזה יקרה".
זה באמת יתרון של שימוש בתכונות אלה.
תן לי להראות לך אחד.
כדי לעשות את זה, אני אעשה את הציור חדש.
דיברתי גם על שימוש בכל פיקסל לאפליקציה שלך.
כברירת מחדל, זה מה שאפליקצית הצבע נראית כמו כשאתה משתמש בו.
זה באמת רק על מה שאתה ציור, התוכן שלך.
אני יכול לעשות דברים נוראיים כאן. מה כדאי לי לצייר? אני לא יודע.
קשקושים? אוי, גדול. אני יכול לעשות את השרבוטים. פנטסטי.
תרנגול הודו? [צוחק]
זה התרנגול הודו המופשטת ביותר שתראה.
אני יכול גם להביא את מה שנקרא בר היישום,
וזו באמת אחת הדרכים המרכזיות שאתה יכול להשתמש
כדי להסתיר ממנו את כל הדברים שאולי היו על האפליקציה שלך או משחק לפני
רק תופס מקום כל הזמן.
אז עכשיו אתה יכול לשים את זה כאן, וזה באמת אחת החוויות היפות יותר
עם סרגל האפליקציה שאני ראיתי.
שים את הבחירות כאן לבחירה בצבעים שונים.
רצינו תרנגול הודו, כך יהיה לנו לשים קצת חום כאן, להתחיל לערבב בכמה צבעים.
אנחנו ניקח את צבע ביניים כאן ולאחר מכן לחזור לכאן.
אתה יכול להתחיל בציור. יש את התרנגול שלך. פנטסטי.
אני לא יכול לצייר מלכתחילה, אבל לעשות את זה עם משטח מגע מול קהל הוא אפילו טוב יותר.
זה מדהים.
הרעיון, אם כי, הוא כל מה שאכפת לי ממנו ממש כאן, על פני השטח.
בואו נגיד שאני כל כך מרוצה מזה שיש לי לחלוק אותו עם מישהו.
בדרך כלל מה שהיית עושה עם גרסאות אחרות של Windows,
היית אולי לקחת צילום מסך, היית עושה העתקה והדבקה של הטקסט שלך כמה
או דברים כאלה שברצונך לשתף את,
ואז ללכת ולפתוח יישום אחר והכניסו אותו לתוכה.
כאן אתה לא צריך לעשות את זה.
למעשה אתה יכול להביא את בר קמעות ואומר, "אני רוצה לחלוק את זה."
בשלב זה שזה הולך להראות לכם את כל האפליקציות
שיודעים איך לעבוד עם כל מה שהוא להיות משותף.
במקרה זה מדובר בתמונה, כך שזה הולך אומר, "אני רואה שיש לך תמונה."
"האם אתה רוצה לחלוק את זה?" אתה יכול לראות אותי בדוא"ל לעצמי דברים כל הזמן.
היא מכירה בכך, וזה הציע לי כי כקיצור דרך,
אבל זה גם מראה לי כל אפליקציה שיודעת איך להתמודד עם צילום תמונה
ועושה עם זה משהו.
אלה יש את כל הצביעו ל-Windows שהם יכולים לעשות את זה.
בשלב זה זו של Windows.
המשתמש פשוט בוחר את מה שהם רוצים לעשות עם זה.
אני אעשה את שלי רגיל של PuzzleTouch. אתה יכול לראות שיצרתי כל מיני חידות לאורך זמן.
אני אקח את PuzzleTouch ואומר, "אני רוצה לחלוק את היצירה המדהימה הזו עם PuzzleTouch".
זה הולך קדימה, ואומר, "יופי. אתה רוצה לחלוק את זה? פנטסטי".
"האם אתה רוצה לעשות חידה זה קל, בינוני, מה?"
אני אעשה ביניים אחד כאן.
זה הופך את החידה. זה הולך להיות חידה נוראה, כי זה בעיקר ריק.
אבל זה מוכן, וזה בעצם חזרה ביישום האחר.
אם אני בא לכאן, אני יכול לחפש אותו ולהפעיל אותו.
עכשיו, אם אנחנו לגלול מעל קצת כאן, אנחנו צריכים לראות את היצירה שלי באיזה מקום.
לאן אני הולך? איזה סוג של חידה שאני עושה? האם אני עושה את זה בקלות?
אה, הנה זה, בדיוק שם.
[מגחך] זה פאזל טורקיה זיהוי בקלות על זה כאן.
אבל הדבר שאני רוצה להצביע לך, הדבר מגניב כאן
היא האפליקציות שלא ידעו שום דבר על זה.
הם רק אמרו, "יש לי תמונה לשתף, ואני יודע איך להתמודד עם תמונות".
ואתה כיזם, אתה לא צריך לכתוב קוד ש.
כאשר מישהו מבקש ממני לשתף, אני הולך לשים כמה נתונים לתוך מבנה נתונים הקטן הזה
ואני עושה.
האפליקציה אחרת משתלטת, עושה את הדבר שלו, וזה הסוף של החוויה השיתוף.
זה רק דבר אחד שאתה יכול לעשות - ממש, ממש חזק -
וזה הולך להיות אחד מאותם דברים שבאמת יכול לעזור להבדיל האפליקציה שלך
וגם את המשחק שלך גם בחנות.
אנשים הולכים להיות מסוגל לומר, "זה באמת שימושי."
"אני משתמש ביוצר חידה זה כל הזמן. זה פנטסטי".
>> זה בערך מספיק סקירה קצרה של מה שקורה כאן.
יש כמה תכונות אחרות גם שאולי תהיה לנו להדגיש שאנו עוברים קוד.
אבל אני רוצה לצלול לתוך שקופיות, וכדי לעשות את זה, אני הולך ללכת לשולחן העבודה,
שהוא עצמו עוד אריח חי כאן.
אני יכול להיכנס לזה, ואכן, אני בשקופיות שלי,
אבל תן לי להראות לך באמת איפה אנחנו נמצאים.
אנחנו נמצאים למעשה במצב שולחן עבודה.
זה ממש שבו מה שאמרתי קודם על Windows נושאת קדימה
לחוויות חדשות מציג את עצמו.
זהו Windows אתה יודע.
יישומי Windows נקראים יישומי שולחן עבודה. הם רצים כאן.
אם יש לך יישומים קיימים ואתה רוצה להפעיל אותם ב-Windows 8,
אתה בהחלט יכול לעשות את זה.
אלה לא אותם הדברים כמו יישומים בחנות, הנמצאים כאן,
כמו צבע טרי ואפליקציות חדשות NBC האלה ודברים כאלה. אלה יגיעו מהחנות.
הם יכולים לחבר אל כמה מהתכונות שאני מראה לך
ואחרים שלא הראה לך עדיין.
אבל רק לזכור את זה. יש לנו תמיכה בשני הדברים האלה גם כן.
אני מצטער. האם משהו לא מראה על המסך? אני כבר איבדתי את זה לגמרי. זה מוזר.
אוקיי. תודה על וציינת כי.
מה שאתה לא היה רואה במשך זמן הוא שלי מראה לך ששולחן העבודה היא כאן.
מהו הדבר האחרון שאתה ראית? האם אתה רואה את זה?
זהו שולחן העבודה. אתם כבר יודעים איך זה נראה.
זה שום דבר יוצא דופן מאוד.
זה שלנו נושא את החוויה שקדימה עבורך ומאפשר לך להשתמש בדברים שהיה לך.
לדוגמא, אני אציג לך Visual Studio. זה הוא יישום שולחן עבודה.
זה הולך לפעול במצב זה.
זה הולך לתמיכה בסביבה מורכבת יותר
עם הרבה אפשרויות ודברים כאלה, אז זה הופך אותו לאופציה טובה כמו יישום שולחן עבודה.
>> שאמרו, בואו נלך לשקופיות עבור רק קצת
ואתן לך קצת תוכן מבוא ולאחר מכן להיכנס למעשה קידוד כאן.
החדשות טובות היא, ששמעתי שאתה כבר מתמקד בהרבה CSS ו-JavaScript, HTML.
כל אותם הדברים שאתה כבר לומד לשאת ישירות לתוך מה שהופך את אפליקציות Windows Store.
הדברים שאתה כבר שומע על עם החלת סלקטורים ב-CSS ואת כל הדברים האלה
זה בדיוק מה שאתה עושה כדי ליצור יישום כאן לחנות.
נלך דרך הדברים קצת אלה על ידי קצת.
בעיקרון, אני בונה על הדברים שאתה כבר לקח את הזמן כדי ללמוד.
זהו התרשים הכללי של הטכנולוגיות שאתה יכול להשתמש
כדי להפוך את היישומים עבור Windows 8.
הדברים בצד הימין, יישומי שולחן העבודה, זה באמת מה שאנחנו כבר יודעים.
זה חומר שהוא באמת העולם של Windows 7 מועבר לתוך Windows 8.
כל האפשרויות האלה לשאת קדימה: C #, VB, סוג של פיתוח Win32.
גדול. אין בעיה. הדברים החדשים הוא בצד שמאל.
זה אפליקציות Windows Store, אז אני רוצה לקבל קווית הבקשה שלי לתוך Windows 8
תוך שימוש בכל התכונות האלה, לקבל אותו לתוך החנות, ולקבל את החוויה ממש מגניב
של יישומי חלונות הראווה.
כדי לעשות זאת, אתה יכול לראות כאן שיש לך את כל האפשרויות שלך עם XAML, C + +,
C #, VB, אתה יכול לעשות את DirectX, דברים כאלה, דברים שהם מעבר לשקופיות.
אבל בשבילנו, אנחנו הולכים להתמקד נכון על העובדה ש-HTML, CSS, ו-JavaScript
באמת אזרח ממדרגה ראשונה להכנת יישומים עבור Windows 8
ועבור Windows Store.
אז זה טוב לכולם כאן ואנשים צופים בוידאו
כי אתה יכול רק למנף את כל אלה החוויות שיש לך
ובאמת לקשור למה שמציעה Windows.
אתה הולך לעשות את זה באמצעות מערכת של ממשקי API, שאמורה להיות לא מפתיע.
לכל מערכת הפעלה ממשקי API שלה.
אנו חושפים את מה שWindows יכול לעשות באמצעות מה שנקרא WinRT.
זה סט של ממשקי API שפשוט עושה הכל בשבילך.
אם אתה צריך לפתוח את הקבצים, אתה צריך להשתמש במצלמה, המיקום הגיאוגרפי, דברים כאלה,
הם עוברים את מה שWindows יכול להציע לך.
כדי לגשת לזה, יש לנו כמה JavaScript יותר שהולך לעשות את זה אפילו יותר קל
כדי שתוכל לעשות את זה. אנחנו נגיע לזה ברגע.
אבל לעת עתה, זה בעצם מפת הדרכים שלך.
הדברים שאתה כבר עושה על גבי כמה APIs
שנסייע לך לעבוד עם Windows שווה-App Store.
וזה באמת על כל מה שאתה צריך לדעת, מהרמה הגבוהה.
>> אנחנו לצלול לתוך למעשה עובדים עם החומר עכשיו.
הדברים שאתה בטח נתקלת בחבורה של כבר,
עם IE9 קצת אחורה הצגנו תמיכה בהרבה, באותו הזמן,
סטנדרטים חדשים באינטרנט, ולכן הרבה תכונות CSS חדשות,
הרבה HTML חדש, ECMAScript 5, שהוא באמת ב-JavaScript.
אז הכל בשביל שפרט למצב מחמיר היה בIE9.
רק המון דברים עם CSS, CSS3, הכל נמצא שם.
וכל הדברים האלה נושאים קדימה אל מה שאנחנו עושים עם Windows 8.
אתה יכול להשתמש בדברים האלה, ואתה יכול להשתמש בכל מה שחדש בIE10.
עם IE10 אנחנו מציגים תמיכה לכל הדברים האלה גם כן.
הם כולם בחומרה מואצת, כך שאם אתם במכונה שיש לו סוג כלשהו של GPU,
שהוא כנראה די הרבה בכל מכונה שאתה יכול לקבל ב 8 השנים האחרונות,
אתה הולך להיות מסוגל לקבל פלט בחומרה המואצת,
פלט חזותי עם CSS, בד, SVG.
את כל הדברים האלה יעברו האצת חומרה
ויהיה זה הרבה יותר מהר ויעיל יותר.
הגרסה הקצרה של כל זה - אני לא הולך לעבור כל דבר ודבר כאן -
אם אתה רואה אותו ברשימה הזאת, אם אתה יכול לעשות את זה בIE10,
אם זה יישום אינטרנט שאתה מפעיל שפועל בIE10,
זה משהו שאתה יכול לעשות כאפליקצית Windows Store.
וזה פחות או יותר אותו. אז אם זה עובד בIE10, זה הולך לעבוד כאפליקצית Windows Store.
זה על השולחן כמו משהו שאתה יכול להשתמש.
>> יש הרבה כאן. אין לנו עד חצות, אז אני לא יכול לבדוק כל דבר כאן.
אבל יש כמה אתרים שיעזרו לך להבין מה הדברים האלה יכולים לעשות,
ואני אראה לך אחד מהם בשנייה.
אני רק רציתי להצביע על כמה הדברים המרכזיים שעשוי אתה מסתכל.
אולי אתה כבר ראית כמה כאלה בלימודים שלך,
אבל אלה הם באמת מועילים, במיוחד עם אפליקציות Windows Store, מהצד ה-CSS.
אז להיות מסוגל לעשות התמרות ומעברים, לספק תנועה עם אנימציה -
כל אלה הם חלק מCSS עכשיו, והם כולם נתמכים על ידי דפדפנים מודרניים,
וIE10 וIE9 הוסיפו תמיכה לאורך זמן לכל הדברים האלה.
ואז למה לכתוב את זה בעצמך, למה לעבור את כל הצרות של לעשות את הדברים האלה ביד
כאשר אתה יכול להשתמש ב-CSS פשוט להפוך כדי ליצור אפקט 3D ליישום שלך?
גדול. ככה זה עובד.
אני לא יכול לעשות את זה כל קשה יותר מזה.
אם אתה יודע איך לעשות את זה ב-CSS, אתה יודע איך לעשות את זה באפליקצית Windows Store.
>> הולך מעבר לזה לפריסה, דברים כמו גם את יישום החנות,
אבל הולך מעבר לזה, מסתכל אולי אפליקציה חדשות שמראה לך מאמרים
או מתכונים או דברים כאלה, אלה סוגים אחרים של תכונות ב-CSS הם באמת שימושיים:
רשת, Flexbox, אזורי CSS הוא יותר של תקן חדש למדי גם כן.
כל הדברים האלה הולכים לעזור לך להוציא את תוכן וזרימת תוכן בין חלקים,
להיות מסוגל לעשות את העימוד והמיקוף מבלי שתצטרך לכתוב את הדברים בעצמך.
אתה פשוט אומר, "אנא בצע את הפעולות הבאות עבורי",
וכמו מסך הנדל"ן שונה במחשבים שונים
או כפי שתראה ברגע, כמו שאתה לצלם יישום
יש כמויות קטנות יותר של שטח על המסך, זה לא בעיה עבור ה-CSS.
זה יכול לקחת את יתרון של - דיבורים, נה על שאילתות בתקשורת בשנייה -
זה יכול לטפל בדברים עם למקם מחדש את התוכן שלך, זורם תוכן מאזורים
רק עם הדברים האלה, כי ייתכן שכבר ראו עם טכנולוגיית אינטרנט.
>> בצד HTML5, יש גם כמה דברים
שיהיה מועיל מאוד בשבילך עם אפליקציות Windows Store.
שוב, אנחנו לא לעבור את כל אלה, אבל הם פשוט כאן.
אז אם אתה צריך להשתמש בו, אודיו וידאו, אם אתה רוצה לעשות את האימות מהטפסים,
מיקום גיאוגרפי, כל הדברים שאתה יכול לעשות ב-JavaScript עם JavaScript 5 או ECMAScript 5,
IndexedDB לאחסון מקומי - כל אלה הם האפשרויות בשבילך.
אם אתה מחפש תשובה, רק להסתכל לטכנולוגיות קיימות עם HTML5 ו-CSS
ואתה תמצא את תשובות יותר קלה ממה שיש לגלגל הרבה דברים בעצמך.
תן לי להראות לך סביב קצת כאן.
יש לי אתר שאנחנו יכולים ללכת.
תן לי לפרוש מהשקופית הזו לרגע.
>> אם אנחנו יוצאים לIETestDrive.com,
אני לא עושה הרבה מהדגמה כאן.
IETestDrive.com הוא באמת מראה לך הרבה מה חדש עם IE10,
הדברים שאתה יכול לעשות.
אני מוצא את זה ממש שימושי כי במקום לקרוא דרך חבורה של ניירות לבנים,
אסתכל על כמה הדגמות, וזה הולך לעזור לך לשים אותו על הרדאר האישי שלך
לגבי שאלה אם טכנולוגיה הגיוני אפילו לעשות את כל מחקר יותר עם
כדי שתבין, "אני רואה מה זה עבור."
"אני מבין מה מסגרת אנימציה בקשה עושה בשבילי."
"אני מבין איך אני יכול להשתמש באזורים או מסנני SVG".
אתה רואה אותם בפעולה, לראות אותם בדוגמה כאן,
ולהחליט בעצמך אם זה הולך להיות שימושי עבורכם בפרויקטים שלכם ומעבר
כפי שאתה ממשיך לעבוד עם טכנולוגיית אינטרנט.
כאן הייתי ממליץ לך רק כדי להעיף מבט.
אני לא חושב שאני מבלה זמן רב פועל דווקא אלה.
יש לנו מספיק כדי להראות בכתיבת קוד.
אתה רואה כאן את הדברים ממגע אפקטים למשחקים מבוססי מגע באותו סעיף,
אנימציה, אנימציה בחומרה המואצת ממש מהר לשם,
כמה אופטימיזציות שתראו כמו גם בחלק מהדוגמות אלה,
ויש הרבה, הרבה יותר.
אם אתה הולך לכאן ולפתוח את מפת האתר,
יש רק מספר מגוחך של דגימות כאן.
אתה יכול לראות את כולם כאן.
אם אתה מסתכל על משהו או שאתה שמעת על משהו
ואתה תוהה אולי זה יהיה משהו מגניב להשתמש באפליקציה,
נסה לחפש כאן, ויש כנראה הדגמה די טובה לזה כדי להציל את עצמך כמה זמן.
>> אוקיי? כל שאלות עד כה לאנשים כאן?
אוקיי. אנחנו נישאר כאן.
שוב, רק לבדוק את זה.
הם תקני אינטרנט, ולכן ללכת לכל אתרי ראווה אחרים שאתה מכיר
ולראות אם טכנולוגיות אלה הגיוניים עבור מה שאתה מנסה לעשות.
>> חזור לשקופיות.
עם זאת, אתה עובר מעולם אינטרנט כדי באמת עולם יישום המקומי מותקן,
אז יש כמה דברים לציין כאן.
קודם כל, אין שום שרת אינטרנט המעורב כאן.
אין אפצ'י, אין IIS פועל כאן
מגיש את דפים ללקוח מרוחק, לסוכן דפדפן מרוחק.
במקרה זה, באמת שהכל ארוז בשבילך.
אתה מגיש את זה כבקשה שלך לחנות, הוא מקבל מוסמך,
זה בחנות, ואז אנשים באלפיהם יתקינו את המשחק שלך או האפליקציה שלך.
אבל בעיקרון, הם משכו אותו כלפי מטה באופן מקומי למחשב שלהם.
אין צורך לצאת לאינטרנט יותר, אלא אם כן יש לך שיחות שצריכים API מרוחק,
וגם זה, כמו גם זה נורמלי לחלוטין.
אבל הם לא הולכים להיות במצב שבו הם צריכים ללכת בתגובה לבקשה משרת
כדי לקבל את הדף הבא של התוכן שלהם.
אז שאמרו, יש כמה הבדלי API קטין. אלה הם קלים להפליא.
הם סביר להכות אותך בקידוד הרגיל שלך, אבל הם לפחות מתועדים.
הם סוג של אתה קצה המקרים שם.
>> הדבר האחר כדאי לציין הוא הבדלי האמון.
אני מזכיר את זה רק בגלל שאני רק רוצה לוודא שאמרתי את זה
כך שאם אתה נתקל בזה מאוחר יותר, אתה חושב, "כריס אמר משהו על זה,
"אז אולי, כן, בסדר," ואז אתה חוזר ולך לגלות מה זה היה.
הקשרים משנה.
כברירת מחדל שאנו מנסים להגן על המשתמש מוקטורים של תקיפה.
יש דברים מסוימים שאתה יכול לעשות כברירת מחדל
ודברים מסוימים שאתה צריך לשנות את ההקשר כדי לאפשר.
כפי שאתה משתמש בכמה ספריות שם בחוץ - הדברים כאלה כבר כבר עובדים עם jQuery,
אבל אם אתה מסתכל על ספריות אחרות שם בחוץ - ייתכן שאתה משתמש בחלק מהפונקציונליות
שסוג של שימוש חורג מקומי, אין אינטראקציות דינמיות יותר
בקשות XHR, דברים כאלה.
לפעמים אתה עלול למצוא את אלה יהיו זמינים כברירת מחדל,
ובמקרה זה, פשוט לעשות חיפוש, לחפש באינטרנט והקשר מקומי,
ואתה תגלה איך לתקן את זה.
רק לוודא שאתה ידעת על זה כמו שאתה מתחיל להשתמש במסגרות אחרות,
אשר, אני צריך להזכיר, אתה בהחלט מסוגל לעשות.
אז אם אתה מוצא כמה מסגרת אחרת - דיבורים, נה על זה בשנייה -
למשחקים ואתה רוצה להשתמש בזה, אתה רוצה להשתמש בכמה ספריות שליטה כי הם שם
ואתה לא רוצה לכתוב דברים שאת עצמך - זה רעיון טוב, נכון? -
בהחלט אתה יכול להשתמש בחומר הזה.
אין שום דבר שעוצר אותך מהשימוש בכל סוג של ספרייה המבוסס על JavaScript,
CSS, HTML5.
שוב, אם זה משהו שאתה יכול לעשות בIE10, אשר הוא לעזאזל של הרבה בימים אלה,
אתה יכול לעשות את זה.
למשוך אותו לתוך האפליקציה שלך, התייחסות שספריית JavaScript, ולהשתמש בו ביישום שלך,
רק לזכור שאתה עלול לפגוע בהקשר אבטחה פעם בכמה זמן - לא לעתים קרובות מאוד.
>> ולאחר מכן התכונות, נעבור על עוד כמה מאותם כמו שאנחנו הולכים.
UX אתה סוג של להתרגל לכפי שאתה רואה יותר ויותר יישומים
מחלונות הראווה.
אתה מקבל תחושה של איך הם עובדים ואיך העיצוב האסתטי נוטה לעבוד
בין יישומים שונים ומה שאנשים ישמשו לחווים.
זה באמת חלק החשוב.
ודא כי כאשר הם יורים את האפליקציה שלך שהם לא צריכים לקרוא את ספר,
שהם אף פעם לא עושים, דרך אגב.
הם פשוט צריכים להיות מסוגלים להתחיל לשחק עם היישום שלך
ולהבין אותו ללא קושי רב.
על ידי דבק והקפדה הרבה של פרקטיקות אלה,
אתה הולך לעשות את המשתמשים שלך טובה גדול, מה שהופך את זה לקל יותר.
>> אוקיי. דבר אחד אחרון בצד ה-API ולאחר מכן נגיע לבעצם כתיבת קוד.
WinJS הוא דבר שהזכרתי לזמן קצר מאוד עם שקופית זו מורכבת
עם כל אלה אפשרויות שונות שיש לך עבור מה שהופך את היישומים.
WinJS, אתה יכול לחשוב על זה כעל חבר.
זה חבר שלך שתעזרו לך לכתוב דברים במהירות רבה יותר.
זה רק JavaScript ו-CSS. אתה לא צריך להשתמש בו. אתה יכול להשתמש בו.
אם אתה הולך להיות בקורא לתכונות של Windows, אתה תהיה בסופו של דבר באמצעותו,
אבל אם יש דברים כמו כמה תבניות עיצוב או פקדים שאתה ממש לא רוצה להשתמש בו,
אתה רוצה להשתמש במשהו אחר, זה תלוי בך.
החלט מה אתה רוצה להשתמש וסגנונות שברצונך להשתמש בו.
התכונות מדור namespacing ומעמד - תלוי בך.
אם אתה מעדיף אחד או אחר, זה לגמרי הבחירה שלך. זה עדיין JavaScript ו-CSS.
אבל זה הולך לעזור לך לעשות הרבה דברים.
לדוגמא, הנה משנה של מה הוא יכול לעשות,
דברים כמו עזרה לתכנות אסינכרוני עם הבטחות.
מישהו מכם שמע או עבד עם Node.js?
זה דפוס נפוץ לעבוד עם תכנות אסינכרוני.
אז בעצם מה שאתה אומר זה, "לך לעשות משהו,
"ואתה הולך לתת לי הבטחה שתחזור אליי כשתסיים."
זה בעצם מה שקורה.
אז אתה לא להקפיא את היישום שלך בזמן שהמשתמש הולך ולקטוף קובץ
או שהוא מוזרם משהו למטה מהאינטרנט.
ממשק המשתמש נשאר קשוב.
ואתה יכול לעשות את זה על ידי שימוש בתכנות אסינכרוני.
זה נשמע מגוחך מורכב, אבל זה ממש קל, כי אתה משתמש בהבטחות
ואתה פשוט אומר, "לך לעשות את זה וכשתסיים, להתקשר שוב לשיטה זו."
זה פחות או יותר אותו. זה כל מה שנבנה לWinJS.
זה הולך לעשות את זה הרבה יותר קל לכתוב יישומים באמת גמישים ורבים עוצמה.
>> אתה יכול לראות את שאר כאן, הרבה אנימציות.
כנראה אחד הדברים חשובים יותר בשקופית זו הוא שולטת.
אני חושב שיש לי כל - כן, אני עושה.
הנה דוגמא של רק חלק מהפקדים שאתה יכול להשתמש ביישומים שלך.
כל זה ישר מWinJS.
אתה לא כותב בעצמכם אלה,
אתה פשוט אומר, "הנה איך שאני רוצה להלחין את הבקשה שלי".
"אני אשתמש בתצוגה להעיף אז אני יכול ללכת בין תמונות שונות."
אני לא הראינו לך זום הסמנטי. אני אראה לך את זה בשנייה.
ListViews. יש GridViews.
אתה כבר ראית את רשת כחלק מיישום החנות,
כך שאהיה מסוגל להשתמש בלוקים של תוכן וגלילה על פני ש.
תפריטים נשלפים תראו מעת לעת.
בר האפליקציה שגם הראה שביישום הצבע הטרי,
כך שאתה ראית איך אתה יכול להתאים אישית את זה על ידי לשים את הכפתורים על זה
ויש שלהסתתר כאשר אתה לא אכפת לי להשתמש בזה.
זה באמת לגמרי תלוי בך לשימוש.
כל אלה הם הבקרות שהנן חלק מWinJS.
אני אראה לך איך לעשות אלה רק שני, אבל יש יותר מאשר רק זה,
והדבר העיקרי הוא להשתמש בם אם אתה רוצה, לחסוך קצת זמן.
>> אם יש לך ספריות שליטה אחרות שאתה רוצה להשתמש בו, זה בסדר גמור מדי.
דברים כמו jQuery UI, כמו גם עושים הרבה של רעיון מסוג זה,
מתן יותר פקדים שמרחיבים את מה שאתה יכול לעשות ב-HTML ו-JavaScript.
בואו לצלול פנימה שכבר אמר את זה. השתמש במה שאתה רוצה.
רק זכור כי אתה עלול להיתקל בכמה בעיות בהקשר.
אבל אתה בהחלט יכול לערבב ולהתאים כל סוג של ספריות שאתה מרגיש בנוח עם,
אתה רוצה ללמוד, אתה רוצה להשתמש בו, כדי לחסוך לעצמך קצת זמן.
>> בואו נדבר על כלים רק לרגע.
אתה יכול לקבל מה שאתה צריך כדי להתחיל לעבוד עם יישומים של Windows Store.
אם אני חוזר החוצה, יש לי יותר מדי דברים עד כאן.
אם אתה הולך לדף הזה, שהוא dev.windows.com,
אתה יכול להוריד את כל מה שאתה צריך.
כסטודנטים, יש לך גישה ליותר מ הציבור הרחב עושה,
כך שתוכל לקבל גרסאות גבוהות הסוף של Visual Studio.
אדווין הזכיר כבר שאתה יכול לקבל את Windows גם כן.
אבל באופן כללי, לכל המפתחים, אתה יכול ללכת לאתר זה
ולהוריד כל מה שאתה צריך כדי להפוך את יישום, וכל זה בחינם.
אז יש גרסה חינמית של Visual Studio,
יש כמה כלים שיתקינו לצדו של זה -
כל מה שאתה צריך כדי ליצור ולבדוק את הבקשה שלך.
זה רק כאשר אתה הולך לפרסם את הבקשה שלך עד לחנות
שאתה הולך צריך חשבון מפתחים.
גם זה אני מאמין שהוא חופשי. האם זה חינם לתלמידים, כמו גם? >> [Guarin] איזה מהם?
חשבון היזם, ההגשה בפועל. >> [Guarin] כן.
אלה חדשות טובות יותר.
אתה הולך להסתכל על זה.
זה יגיד ליחיד כברירת מחדל זה 49 $.
אבל לא להירשם לזה כסטודנט.
אנחנו נוציא אותך קצת מידע באמצעות התוכניות שלך, כי אתה יכול לקבל חשבון בחינם,
ושאאפשר לך לאחר מכן להגיש את היישומים שלך ממש עד לחנות,
כמה שאתה רוצה, ואת כל טוב שבקרוב תבוא בעקבותיו.
אז זה dev.windows.com.
ניתן להוריד את הכלים שאולי אתה צריך מכאן.
ואם אתה רוצה, אתה יכול לקבל גרסת ניסיון של Windows כאן,
אבל שוב, אתה לא צריך.
>> האתר האחר - הרשה לי לציין את זה עבורך במהירות - הוא design.windows.com.
זה היה dev.windows.com.
Design.windows.com, אתה יכול לנחש מה זה עבור.
זה בעצם אתר ידידותי למדי. יש הרבה מידע טוב כאן.
אתה יכול לעבוד דרכו.
זה הולך לתת לך כמה עצות על כמה דברים
שאולי לא חשבת עליהם לפני או נאלצתי להתמודד עם העבר,
כמו עיצוב למגע, עיצוב עבור טופס גורמים שונים,
עיצוב ליכולות של Windows 8, הדברים שציינו קודם
כמו חיפוש ושיתוף, יש דברים שלא דיברתי עליו כלום.
הם כולם מופיעים כאן, וזה סט די טוב של דפי קובץ מועילים
שיעזור לכם להבין איך לעשות סוג מסוים של יישום,
איך לעשות את האינטראקציה, איך להתמודד עם ממשק המשתמש וUX של היישום שלך.
אני הייתי ממליץ לך תסתכל על זה, במיוחד אם אתה בשלב מסוים
מקווה לפרסם את יישום לחנות.
אתה הולך רוצה לדעת איך לעשות את יישום טוב
מכיוון שציינתי קודם אם לא, יש ביקורות אלה שוב.
אנשים הולכים להיות אומלל.
הם לא יהיו מסוגלים למצוא את הדברים שהם מצפים במקומות הנכונים.
אף אחד לא רוצה שזה יקרה לך.
>> נע קדימה כאן, תנו לי לסגור את זה.
עכשיו שאתה יודע איפה להשיג את הדברים, אני אראה לך איך להתחיל דווקא באמצעות דברים.
כדי להתחיל, אני בעצם להראות לכם כאן דוגמא של יישומי שולחן עבודה על מסך ההתחלה שלי.
כאן אתה יכול לראות Visual Studio, אתה יכול לראות בלנד וכלי פיתוח אחרים שיש לי.
יש להם אריחים שונים במקצת.
זה בגלל שהם יישומי שולחן עבודה,
ובמקרים אלה הם כולם עומדים להשיק חזרה לשולחן העבודה שלי
ממש כשם שאפליקציות שאתה רגיל.
אז ניסיון של Windows, זה אותו הדבר.
הם לא, למשל, כמו מזוינים! או את הדברים האלה. הרשה לי לפתוח במהירות אחד.
למעשה, הנה אחד מעניין.
זו פותחה על ידי סטודנטים עובדים בשיתוף בNERD.
יישום במסך מלא, אלו סוגים של חוויות כאן.
אה, מסכי לחתוך נחמדים וכל מיני דברים כיפיים.
הם פיתחו את זה. אנחנו יכולים גם להראות את כל העניין בזמן שאנחנו מדברים על זה.
למעשה, אני עבדתי איתם קצת, נתתי להם כמה עצות על דברים
בגלל שהם עושים JavaScript ליישום שלהם.
בבקשה, אני לא לוקח קרדיט על העבודה שלהם, הם עשו את כל העבודה.
אני רק נתתי להם קצת עצות פה ושם,
אבל הם עשו כמה דברים גדולים על ידי שימוש בקצה קדמי JavaScript
וקשירה בכמה מנועי פיסיקה ודברים לעשות הרבה עבודה זו.
ללכת. בואו אראה אם ​​זה עובד.
וואו, זה עדיין עבד. בסדר, טוב. אבל אתה מקבל את הרעיון.
אפליקציה במסך מלא, חוויה ממש טובה.
זה תמיכה לא רק העכבר והעט שלי אם יש לי דברים כאלה, אלא גם לגעת.
אם היה לי מסך מגע, אני יכול פשוט לצייר עליו ולהמשיך לעבוד עם זה.
>> דבר אחד אני לא הראיתי, והסיבה לכך שאני מביא את זה
הוא רציתי שיהיה לי אפליקציה אחרת כדי להראות לך את מה שאתה יכול לעשות,
למעשה אתה יכול לקחת יישומים ב-Windows ולגרור אותם לצד השני של המסך.
זה נקרא מצלם יישום.
במקרה זה, אני כבר לקחתי Inkarus ואני הוספתי אותו לצד כאן.
עכשיו זה בתצוגת הצמד, וזה מאפשר לי לעשות משהו אחר בזמן שהיישום שהוא שם.
רוב המשחקים שתמצאו יהיו פשוט לעצור.
זה בדרך כלל דבר הגון לעשות, אלא אם כן המשחק שלך יכול איכשהו לקצץ
כדי שקטן של רזולוציה, כמו אולי באיזה משחקים קופסה
או דברים כאלה על אירוע.
אבל באופן כללי, הדבר הקל ביותר לעשות והדבר המתאים ביותר לעשות עבור משחקים
הוא להשהות את היישום.
ליישומים כמו יישומי חדשות, אם אני להשיק את זה ואז אני הצמדתי אותו,
אתה תראה שזה באמת משנה באופן משמעותי באיך זה מציג את הנתונים אליך.
הנה זה מראה לך בבאמת מחבת יותר אנכית כי מידע,
אבל אני עדיין יכול בהחלט להשתמש ביישום.
כך שזה עדיין מאוד שימושי.
העובדה שזה בתצוגה קטנה יותר לא תמנע ממני השימוש באפליקציה הזאת. אז תחשוב על זה.
זה משהו שאתה צריך היישומים שלך לעשות במידה מסוימת,
אבל זה תלוי בך כדי לקבוע כיצד תפקודי צריכים להיות היישומים שלך
בסוג כזה של סביבה קטנה יותר.
תן לי לסגור כי אחד למטה ולחזור לאיפה שהיינו כאן.
>> אדווין, שהוספת את התמונה שלי כבר? >> [Guarin] כן. >> [Bowen] תראה את זה.
רואה את זה? אדווין הוסיף תמונה. [צוחק]
>> בואו נחזור לכאן לVisual Studio. תן לי לפתוח את זה בשבילך.
אני יכול שלחצת על המשבצת שבמסך ההתחלה.
זה החזיר אותי למצב שולחן עבודה, וזה משיק יישום שולחן העבודה של Visual Studio.
זהו Windows שאתה כבר יודע.
אני יכול להמשיך וליצור פרויקט כאן.
אנחנו נתמקד שוב על JavaScript, HTML.
אני הולך לצאת ולבחור עד כאן תחת JavaScript, Windows Store.
יש מספר התבניות שאתה יכול להשתמש.
לפריון, אני ממליץ לך להעיף מבט על כמה מאלה אחרים אלה כאן
כמו הרשת והפיצול.
הם ממש שימושיים אם אתה מבצע את יישום
זה הולך להיות סוג כזה של עיצוב וניווט. אתה רואה את אלה הרבה.
אחד אני רק הראיתי לך היה למעשה מופע של יישום הרשת.
אז אם אתה חושב שאתה הולך להיות ביצוע אפליקציה חדשות או קורא ה-RSS
או משהו כזה העוסק במספר ערכים שבם אתה רוצה להראות את הפרטים,
לחשוב על שימוש באחת מתבניות אלו כדי להתחיל לעבוד במהירות
והתאמה האישית שלו משם.
אבל רק כדי שאוכל להראות לך את כל החלקים הנעים כאן
אני הולך ליצור את האפליקציה הריקה, ואחר כך נלך קצת עמוק יותר לתוך הפרטים.
אני רק עושה את זה יישום ריק כאן.
זה הולך ליצור את הפרויקט כולו בשבילי.
אני אפתח את הדברים שאני רוצה להראות לך כברירת מחדל.
תן לי רק להתקרב קצת כדי להראות לך את מה שיצר לנו כאן.
הדברים שאתה הולך להסתכל בהתחלה הם כולם ברירת המחדל בשם.
אז אתה הולך לחפש default.html, default.js, וdefault.css.
הדבר נוסף שיש לציין הוא שכבר יש לנו התייחסות למה שציינתי קודם.
זה WinJS. אף אחד לא באמת קורא לזה שם ארוך זה כאן.
זה WinJS, ספריית Windows עבור JavaScript.
אם אתה פותח אותו, אתה יכול לראות את כל זה כאן.
יש קבצי CSS שונים, יש ב-JavaScript.
זה שם כדי לעזור לך.
זה באמת שם כדי לספק בקרות וסגנונות וכל מיני דברים שאתה יכול פשוט להשתמש באופן אוטומטי.
אבל שוב, אם יש דברים שאתה רוצה להשתמש במקום במונחים של עיצוב ופקדים אחרים,
זה לגמרי תלוי בך. אני אראה לך איך להשתמש בכמה מהדברים האלה עכשיו.
>> חזור על גבי צד השמאל שלנו, תן לי להראות לך את דף ברירת המחדל ב-HTML.
כבר ראו הדברים WinJS, וזה באמת כל מה שקורה שם
עם קווי אמצע אלה של סימון, רק להביא בCSS כברירת מחדל
ומביא בכמה קבצי JavaScript מWinJS.
אתה לא צריך להיות אדון של מה שקורה בתוך קבצים אלה.
זה די מעניין להעיף מבט על אותם לסקור סוג של מה שקורה שם
בגלל שיש טכניקות ביניים ומתקדמות די מעניינות קורה שם,
אבל הדבר נחמד הוא כמו מפתחים, אתה יכול פשוט לנצל אותם, רק להשתמש בם
ולא ממש צריך לדאוג בקשר לזה.
אתה עדיין יכול לנהוג במכונית מבלי לדעת איך זה עובד, נכון?
אז זה מסוג הדברים שקורה כאן.
יש בקרות וסגנונות וכל מיני דברים שאתה יכול פשוט להמשיך ושימוש
וקוד שאתה יכול להשתמש בשני מבלי לדעת מה יש שם.
הנה הקבצים שלך.
אלה המקומות שלך שאתה יכול לשנות CSS משלך
וJavaScript שלך כדי לקבל דברים מתגלגלים.
אתה תהיה הוספת קבצי JavaScript בהחלט אחרים וקבצי CSS אולי אחרים
כפרויקט שלך גדל, אבל זה באמת רק נקודת התחלה.
הנה שלום, המקבילה בעולם של ה-HTML, ולכן אנחנו שוב בתג הגוף.
בחלק העליון, דרך אגב, זה הסוג של מסמך HTML5,
כך תוכל להכיר בכך ממה שאתה כבר עובד עליו.
יש IntelliSense המלא בכאן, כמו גם, כך שאם אתה עושה את דברים כמו סוג בתגית וידאו
ולהרחיב את זה, יש לך כנראה למד על העובדה
כי אתה צריך לעשות קידוד fallback לתגי וידאו ב-HTML5 - או אולי יש לך -
כדי לוודא שיש לי דפדפנים שונים תמיכה בוידאו שלך.
יש לנו דברים כאלה על פני HTML, על פני JavaScript, מול ה-CSS.
שנבנה בשנת, ואני אראה לך CSS בשני.
כאן אתה יכול ללכת קדימה ולהתחיל לשנות את קוד, הסימון.
למעשה, לפני שאני משנה משהו, אני הולך להפעיל את זה ולהראות לך מה שאתה מקבל.
אתה הולך לקבל את מסך פתיחה שבו אתה יכול להתאים אישית
ואז אתה מקבל את שלום, ניסיון בעולם כאן. זה פנטסטי, נכון?
קדימה, ספינה, נכון?
תוכן הולך כאן. זה הדבר הבסיסי.
זה יכול רק להשתפר משם.
נלך קדימה ולהוסיף כמה דברים.
יש לי קצת סימון אני הולך להעתיק לכאן
רק כדי שלא יצטרך לראות אותי ההקלדה.
תן לי ללכת להביא את ארגז הכלים כאן, ואני להצמיד את זה כי אני עושה את זה כמה פעמים.
ארגז כלים, אם אתה לא ראית את Visual Studio, הוא לאן אתה הולך למצוא חבורה של פקדים.
גם אתה יכול לשים את קטעי קוד לזה שאתה יכול לעשות שימוש חוזר.
כאן אני רק אקפוץ בכמה HTML אחר, שום דבר לא מתקדם מאוד בכולם כאן.
זה פשוט HTML בסיסי אומר שיש לי קלט שבו אני יכול להקליד,
יש לי כפתור שבו אני יכול להגיש אותו, ולאחר מכן יש לי div שהוא למעשה מציין מיקום
שאני יכול להשתמש בו כדי פלט "שלום, אתה מקליד את זה."
זה הפתיח לדוגמא ה-HTML.
אם אני מפעיל את זה, אנחנו באופן אוטומטי לקבל את ה-HTML, אבל אנחנו גם מקבלים באופן אוטומטי את סגנון.
זהו אחד הדברים החשובים מWinJS.
זה הולך לתת לך כברירת מחדל כמה מראה ותחושה שהוא באמת עולה בקנה אחד
עם שאר מה Windows 8 הוא עושה.
כאן אתה רואה את דברים כמו הכפתור.
כפתור ברירת המחדל ב-HTML לא נראה ככה, אבל הוא עושה כאן
כי זה מתחיל להיות שזכות CSS מאותו קובץ CSS בWinJS.
אם אתה רוצה להשתמש במשהו אחר, אם אתה רוצה לשנות את זה, בסדר גמור,
ללכת ולעשות את מה שאתה רוצה. אבל זה ברירת המחדל.
זה הולך להיות מוכר יותר למשתמשים.
וכמובן, זה לא יעשה שום דבר, כי אני לא ממש חוט עד כל סוג של קוד
כדי להגיב לזה. זה היה רק ​​ה-HTML.
אז אני יכול להיפטר מזה, ואנחנו נחזור לבקשה שלנו.
>> תן לי לעבור לdefault.js שלנו.
זה נראה די מורכב, אבל זה פשוט עושה כמה דברים בשבילך.
זה מוכן מראש. זה הולך להיות זהה בכל הפרויקטים שלך.
הדבר היחיד שזה עושה הוא פשוט סוג של שואל, "איך הגעתי לכאן?"
ואמר: "האם אתה משיק את היישום הזה בפעם הראשונה?"
"האם אתה לחדש את היישום מהצורך להיות מושעה את זה?"
כמה דברים כאלה.
באמת, המיקוד שלנו על הקובץ הזה כאן הוא בערך כאן.
בשלב זה, שורה אחת של קוד היא די חשובה.
זה באמת הולך ללכת ולחפש דרך כל הסימון שלך,
וזה הולך למצוא דברים שבקשתם להפך לשולט,
פקדים עמוקים יותר כמו שליטת דירוג, כמו תצוגת רשת, כמו התפריט הנשלף
ואלה דברים אחרים שהראיתי לכם בשקופית זו בעבר.
הם לא שולט HTML ילידים.
אתה פשוט לא אומר נשלף כאלמנט ויש לו יודע מה לעשות.
מה שאנחנו עושים בפועל הוא אותו הדבר שקורה בסוגים אחרים של מסגרות שליטה.
ממשק משתמש jQuery עושה את אותו סוג של גישה כללית.
אתה משתמש בסימונים ב-HTML שלך, ולאחר מכן כמה JavaScript מגיע דרך מאוחר יותר ואומר,
"אה, אני יודע מה זה. הוא פשוט מחפש את זה שהפך לחומר הזה",
וזה ה-HTML יותר אקספרסיבי האחר לעשות כמו שליטת דירוגים,
וזה מה שאני אראה לך עכשיו.
קו זה של קוד הוא הבטחה שאומרת, "כאשר הבטחה זו מתממשת,
"כבר יצרו את כל מה שבקשת לכך."
וזהו זה. זה נראה קצת מורכב, אבל זה באמת אותו הדבר בכל פרויקט.
כאן הוא מקום שבו אתה יכול להתחיל להוסיף בכל דבר אחר שאתה רוצה שקורה,
אז אנחנו נחזור לזה בשנייה.
>> קודם כל, אני צריך קצת קוד שיכול להגיב לעובדה
שמישהו לחץ על הכפתור.
אני הולך קדימה ולשים את זה בכאן למטה.
שוב, אני לא הולך לעשות שום הקלדה מולך כאן.
JavaScript הבסיסי מאוד רק אומר כאשר זה נקרא
אנחנו הולכים להיות מסופקים כמה פרטים על איך הגענו לכאן
ולאחר מכן אנחנו הולכים לעשות כמה דברים בסיסיים.
לך תמצא את הדבר בדף ה-HTML שלי שנקרא על שמו nameInput,
לתפוס אותו, קח את הערך שלו, סטירה "שלום" על החלק הקדמי שלו, ואת המקל שמחרוזת וכתוצאה מכך
שלתג div שהיה לנו לפני שבאמת לא היה שום דבר בעבר.
עכשיו אנחנו הולכים למצוא את התג ושלהפוך את התוכן הפנימי שלה שווה למחרוזת ש.
JavaScript פשוט מאוד.
אני מקווה שאתה מכיר בכך שיש באמת דבר יוצא דופן קורה כאן.
זה פשוט ישר HTML ו JS כאן.
אם אני מפעיל את זה עכשיו, זה עדיין לא הולך לעשות שום עבודה כי אני לא חוטית אותו
כדי לקבל את האירוע.
כדי לעשות את זה, אני אעשה את זה ממש כאן, חוזר שוב לארגז הכלים שלי,
קופץ אותו כאן.
אני מניח שכבר ראיתי את כל זה סוג של דברים בעבר, אז אני לא מעל להסביר את זה.
עכשיו אנחנו הולכים לקבל את helloButton.
אנחנו הולכים לומר, "לחצן, מזל טוב."
"הנה אירוע שאתה עכשיו מגיב".
"כאשר מישהו לוחץ עליך, קורא לפונקציה זו, buttonClickHandler".
וזה פונקציה שרק הוספנו ימין למטה בתחתית שם. זה מכיל.
אז עכשיו יש לנו יישום להפליא פונקציונלי.
אני חושב שאתה תהיה ממש התרשם מזה.
כריס. חכה לו. וואו. אוקיי. זה מדהים. [צוחק]
אבל יש עוד. לא קונה את זה עדיין. חכה.
>> תן לי להראות לך קצת יותר כאן ולצאת ממסך מלא.
אנחנו הולכים ללכת לפני שאנחנו רצים.
תן לי להיכנס ובעצם להראות לך קצת עם CSS.
רק כברירת מחדל, אם אנחנו מסתכלים אחורה בדף כאן,
כל פעם שאנחנו משכתי בדברים האלה מWinJS ויש לנו ממשק המשתמש-הכהה,
למעשה, אתה יכול לשנות אותו לברירת המחדל עבור השימוש ביישום אור.
UI הכהה הוא טוב ליישומים גרפיים כמו שימוש בהרבה תמונות,
אתה מראה הרבה תוכן ויזואלי.
אם אתה מראה הרבה תוכן טקסטואלי, ממשק משתמש האור הוא בדרך כלל בחירה טובה.
אתה לא צריך לבחור בו, אבל אני כבר עברתי את זה
ועכשיו אתה רואה את אותו סימון, הכל אותו דבר,
זה רק באמצעות בעצם תכנית הפוכה כאן
שבו כל מה שהוא עושה זה טקסט שחור על גב לבן.
זה כל מה שטוב ויפה.
תן לי לצאת לכאן, ובואו באמת לעשות קצת יותר עם CSS.
אני החזרתי אותו בחושך, כי אני חושב שזה כנראה קל יותר לראות על המסך
כאשר אני מתחיל לעשות את הדברים האלה.
אני הולך להחליף את הגוף עוד פעם אחת.
אני אלך כאן. תן לי יפציץ זה.
בואו נביא בגוף עם שיעורים.
אני מאמין שעשית את בוררים בסיסיים עם CSS ודברים כאלה כבר,
אז אתה בטח יודע מה קורה כאן.
רק הקצאה כמה שיעורים לכותרת שלנו, ואנו יוצרים div חדש
לעטוף את שאר דברים שעכשיו אנחנו יכולים להשתמש בו כדי לעצב את כולם יחד.
אז מה אני יכול לעשות עכשיו הוא לעבור על ל-CSS ברירת המחדל שלנו.
האם הסתכל על שאילתות בתקשורת עדיין? האם דיבר על זה בכלל?
שאילתות מדיה הן חלק ממגמה מתהווה זה -
או שזה מגמה הוקמה החברה בפועל באינטרנט -
לעיצוב או אדפטיבית תגובה,
והרעיון הוא שהיישומים שלך באמת יכולים להתאים את עצמם כראוי
על סמך מה שהמכשיר שהם מוצגים ביכולים לעשות.
אז אם אתה במכשיר נייד, ברור שאתה לא הולך יש לי הנדל"ן כמה שמסך
כפי שאתה על צג 30 אינץ גדול יושב עם שולחן עבודה, מחשב גדול כמו זה.
אז התשובה הישנה שלתהיה לנו 5, 6 גרסאות שונות של אותו הדף
ואתה הייתי פותח את הגרסה שהיה מכוון שלמסך בגודל מסוים.
לא גדול. זה מאוד, מאוד חוזר על עצמו ויש המון תחזוקה לעשות את זה.
עכשיו יש לנו משהו שנקרא שאילתות בתקשורת CSS,
ואנחנו יכולים להשתמש בזה כדי לזהות באופן אוטומטי כאשר יש גדלים מסוימים
או שימושים מסוימים של התוכן שלך מתבצע.
כך שאתה יכול להגיב על זה ואתה יכול לומר, "בסדר, במקרה זה
"אתה כנראה אפילו לא צריך אותי כדי להגיד לך מה קורה כאן."
זה רק אומר שאם בקשה זו התפרצה, כמו שהראיתי לך לפני -
תופס אותו ולשים אותו לצד השני של המסך -
אז בואו נעשה את הסטיילינג הבא.
סטיילינג הוא לא רק על צבעים ודברים כאלה.
זה גם על שינוי גודל ושוליים ואטמים ואורינטציות של תוכן
או אפילו השבתה או הפעלת חלקים שלמים של הדף שלך
וכן, במקרה זה, האפליקציה שלך או המשחק שלך גם כן.
אז הנה אתה יכול לעשות פשוט כמו שאתה רוצה.
זה לא יהיה שימושי ביישומים שלך, אבל זה זמן הדגמה,
אז אני הולך לקדימה, רק להוסיף בגוף הבורר בסיסי ואומר,
"כשאני התפרצתי, בואו נלך קדימה ולעשות את צבע הרקע ובואו לבחור משהו."
יש לך IntelliSense כאן. זה ממש ממש מגניב.
בשנת 2012 שהוספנו הרבה דברים לתמיכה ב-CSS ו-JavaScript ו-HTML.
יש כמובן לך הנפתח IntelliSense מדי, אבל זה לא הדבר מגניב.
הדבר מגניב הוא שיש לך סלקטורים חזותיים להרבה דברים גם כן.
אז אתה יכול לעבור ופשוט לבחור צבע,
או שאתה יכול לצאת ולהיות אפילו יותר ספציפי ואתה יכול לבחור -
זה הולך להיות נורא. אני ממש אצטרך לבחור צבע הגון כאן.
צפה הסימון מדי, דרך אגב. זה הפורמט הסטנדרטי RGB שלך שם.
אבל אם אני עובר את האטימות, זה הולך לעבור לבורר ערוץ אלפא כאן.
אז אתה יכול לראות את זה, את הצבע עם מהות שקיפות אחוזים שיש לך בשביל זה
כל אפוי ממש שם.
אני הולך לשמור אותו כ100% ולאחר מכן כאשר סיימתי עם זה, הכל טוב ויפה.
עכשיו, אם אני מפעיל את האפליקציה ואנחנו לוקחים את האפליקציה והצמדנו אותו,
שצבע הרקע הוא להיות מותאם באופן אוטומטי
רק בגלל שיש לנו כמה CSS שאומר, "לך לעשות את זה."
אתה גם יכול לכתוב JavaScript מדי שיעשה את אותו הדבר
או שאתה יכול להשתמש בעצם כדי להשהות את משחק, עושה דברים כאלה.
זה כנראה כשאתה הייתי להשתמש ב-JavaScript.
היית מכבה את משחק הלולאה בשלב זה.
היית צריכים קצת JavaScript, כי זה לא יהיה משהו שהיית ב-CSS ל.
אבל יש לזכור שזה רק מקרה.
אפשר לומר, "כאשר הבקשה שלי היא לשנות את הגודל,
"בואו נראה אם ​​אנחנו התפרצתי". וזהו זה.
>> אוקיי? אני מדבר הרבה. האם יש שאלות עד כה על איפה אנחנו נמצאים? כן.
[תלמיד] האם יש הדרכה לכל אחד לקבל מידע נוסף? >> כן.
השאלה היא, האם יש הדרכה לזה? אני רק להרחיב אותו לכל דבר.
יש כמה דברים שאתה יכול ללכת. בואו באמת נצא מכאן.
תן לי לחזור לכאן.
דבר אחד שיש לציין הוא של Visual Studio עצמו יש הדרכות בנויות פנימה
תן לי להיפטר מזה.
אם אתה רוצה ללכת וליצור פרויקט חדש, אל קובץ, פרויקט חדש,
ולהסתכל על צד שמאל, יש צומת אינטרנט בבורר זה.
זה הולך לקחת קצת. אני בMyFi שלי כאן.
אבל זה הולך לבוא וזה הולך לתת לי סיכוי למצוא תבניות
אלא גם, וחשוב יותר, דגימות גם כן.
אז אני יכול ללחוץ על JavaScript.
זה הולך למצוא דוגמאות בשבילי. הרזולוציה שלי היא הדרך גבוהה כאן.
בדרך כלל, היית לראות רשימה של הרבה דברים שונים כאן.
אם יש משהו שאתה רוצה לנסות, לבחור את השפה,
JavaScript כאן, ואומר: "אני לא יודע איך לעשות את המיקום הגיאוגרפי."
"אני לא יודע איך לפתוח את קובץ."
"אני לא יודע איך לנצל את מצלמת האינטרנט
"או לייעל למגע או דברים כאלה."
ישנן דוגמאות לכל דבר: שיתוף, חיפוש, ברים יישום,
ביצוע שיחות מרחוק לשירות, קידוד JSON.
כל הדברים האלה יש דוגמאות לכאן,
והם לא דגימות עצומות שהם הולכים לקחת אותך כל הלילה כדי לפרק
רק כדי לגלות שדבר יחיד שאתה רוצה ללמוד.
הם באמת טובים. הם קטנים, נכון לנקודת הסוגים של דגימות.
אני למדתי המון על ידי עובר האלה בעצמי,
ולכן אני ממליץ שהרבה כדבר אחד.
>> דבר נוסף מדי להצביע הוא כמובן הראיתי לך dev.windows.com,
כך שאם אתה חוזר לזה, תראה בתחתית יש גם דוגמאות כאן.
אז אתה יכול להוריד את כולם בבת אחת, אבל גם יש גם הרבה משאבים אחרים כאן
שיכול לעזור לך להגיע עד למהירות.
>> עוד דבר אחד, ואני באמת ממליץ לך לנסות את זה,
יש לי אותו בבלוג שלי, אבל אני פשוט אלך ישר לעניין.
אני אראה לך. יש בבלוג שלי משאבים ודברים כאלה.
אחד הדברים להצביע הוא ממש כאן, הדבר הזה: הרעיון שלך. האפליקציה שלך. 30 ימים.
אם תלחץ על זה, זה הולך להביא אותך לאתר באמת מועיל.
זה הרבה יותר מועיל ממה שאתה יכול לצפות.
זה הולך להיות 30 ימים של תוכן שאתה בעצם יכול לקבל טיפים וטריקים
לאורך כל תהליך שכפי שאתה יוצר את אפליקציה.
וכמו שאתה לא יכול לצפות, למעשה אתה יכול לקבל אותו למשחקים מדי
ועבור יישומי טלפון, דברים כאלה.
אז בעצם להירשם לזה, והם הולכים להיות שולחים לך טיפים וטריקים על,
"האם חשב על עושה את זה? האם אתה תומך בצמד?"
"הנה כמה קווים מנחים על איך לעשות את זה טוב".
"חשבת על הגשה לחנות?"
"חשבת על איך אתה הולך למכור את הבקשה שלך?"
זה הולך לעבור דרך כל אלה דברים שונים.
ובעצם, אם אתה על מסלול המשחקים, בשלב מסוים
תוכל להתחיל לזהות האדם מדבר אליך
כי אני בעצם הייתי צריך ללכת לRedmint לעשות ו2 קטעי וידאו המוקלטים אלה שם.
אבל זה הכל חלק ממסלול המשחקים,
ויש גם מסלול מלא על פיתוח אפליקציה כללי.
זה נקרא הדור App.
הייתי בהחלט ממליץ לך את זה גם כן, בנוסף לדגימות.
>> יש הרבה קטעי וידאו באתר שנקרא ערוץ 9 גם כן.
זה כנראה הדבר האחרון שאני ממליץ, כמו גם לפני שאנחנו עוברים כאן.
Channel9.msdn.com.
זה נהדר, כי אתה לא הולך להיות קריאה דרך טונות של ניירות לבנים.
זה בעצם הרבה קטעי וידאו, screencasts ודברים שהם ישר לעניין.
אני לא צריך להגיד שזה תמיד ישר לנקודה. תלוי מי עושה את השיחה.
אבל בדרך כלל, יש כמה קטעי וידאו באמת to-the-הנקודה כאן
זה יראה לכם משהו מסוים אולי אתה רוצה ללמוד או לראות demoed.
יש גם את כל התוכן שלנו מהכנס שלנו שקרה לפני כמה שבועות
בשם בנה, ואתה תראה את זה שם.
יש טכנולוגיות ליבה של Windows 8 משחקים. הנה לך.
אני הייתי שם, בעצם. אתה לא יכול לראות אותי. אני היה כאן.
אבל בכל מקרה, זה בצד, אני הייתי ממליץ לך להעיף מבט בסרטונים האלה.
הם די מועילים.
אם אתה תקוע במשהו או שאתה רק רוצה לראות את מה שיכל לעשות משהו, לפטר אותם למעלה.
>> [Guarin] Windows Mail פשוט שלח לי מייל עם קישור לתוכן
לסטודנטים להוריד עם קוד לדוגמא ודברים כאלה. >> [Bowen] גדול.
מדהים. תודה לך, אדווין.
>> טוב. >> [תלמיד] יש לי שאלה. >> [Bowen] אה. כן, בבקשה.
[שאלת תלמיד לא נשמעה] >> [Bowen] הו, אני שמח ששאלתי את זה. כן.
השאלה הייתה, האם יש ממשק ויזואלי עבורי ליצור דברים?
אדווין יגמול לכם ביד רחבה לשאלה הזאת.
יש דרך לעשות את זה.
אנחנו צריכים לעשות את זה עכשיו? בואו נעשה את זה עכשיו.
אני הולך ללכת לזה עכשיו.
למעשה, הרשה לי להוסיף דבר אחד יותר להדגמה זו,
ואז אני אראה לך את התשובה בפועל.
אני הולך להוסיף בCSS קצת יותר כאן.
הייתי קצת בסיפורים מעשיות כאן.
הרשה לי להכניס קצת CSS כאן כדי לנצל
של המעמדות שהוספנו לפני זמן קצר,
לכותרת, לdiv mainContent, ולאחר מכן לgreetingOutput.
אם אני עושה את זה ולהפעיל אותו, אתה יכול לראות עכשיו שיש לנו ריפוד שונה קצת ומרווחים,
אז יש לנו בעצם כמה קיזוז כאן.
אלה הם יותר לכיוון מה שאתה הולך לצפות ביישום מלוטש סופי.
אבל אני רק מראה לך את זה כי זה ישר ב-CSS.
אז את הדברים שאתה כבר יודע שאתה יכול להשתמש כאן כדי לכוונן את התוכן כרצונך.
כבר ראו איך לעשות את הרקע לשנות את זה ככה.
>> אם אני חוזר ל- HTML שלנו, אני הולך להוסיף בסט נוסף של סימון,
וזה באמת הולך להיות שליטה מWinJS.
אני הולך ללכת ולתפוס את זה, תווית. תן לי לוודא שאני עושה את זה במקום הנכון.
כנראה מספיק טוב.
הנה אני רק הוספתי - ונלך מסך מלא כך שתוכל לראות את כל העניין -
אני הוספתי לתווית div הבא.
Div נקרא ratingControlDiv.
בפני עצמו זה לא לעשות כלום.
אם אתה פותח את זה בדפדפן, היית מסתכל על ריק, div עצמו.
אבל בגלל שהשורה מסתורית של קוד שהראיתי לך בעבר,
התהליך כל, זה הולך לחפש משהו שנראה כך -
הנתונים-win-שליטה - וזה הולך למצוא כל מה שהוא בפרמטר זה.
זה הולך להפוך את המופע של מה שזה לא זה והצביע.
במקרה זה, מדובר בשליטת דירוג, ולכן אני אומר, "בבקשה ללכת ולהחליף את הדבר הזה
"עם כל מה שאתה צריך לעשות כדי להפוך את שליטת דירוג".
זה יכול להיות שליטה שנייה, זה יכול להיות טבעת ההתקדמות או מה ששליטה ברצונך להשתמש.
הם כולם הולכים לעבוד למעשה באותה הדרך.
אתה משתמש בסימון HTML5 סטנדרטי כדי לציין את מה שאתה רוצה,
ואז אתה הולך לקבל את שליטה בסוף זה. תן לי להפעיל את זה.
אני פשוט העתקתי כי ב, ועכשיו סימון שהופך את זה,
שהוא למעשה מספר לא מבוטל של רכיבי HTML.
כל אלה הם תמונות בודדות, ויש אלמנטים מסוג div סביבם עם בוררים.
אני מקווה שאתה יכול לראות את זה. זה קצת עדין.
אני יכול לרחף מעל הפריטים השונים, וזה הולך כדי לאפשר לי לראות את הדירוג כאן.
אני יכול ללחוץ עליו, והוא זוכר את הדירוג אבל זה על זה.
זה לא באמת עושה שום דבר עם הדירוג.
>> הדבר האחרון שאני רוצה להראות לך על זה
לפני שאנחנו עוברים לחוויה עיצוב חזותית יותר
הוא קצת קוד שאני יכול להשתמש בו כדי להגיב לפקדי WinJS אלה.
תן לי לצאת משם, בחזרה מתוך מסך מלא,
ולעבור לJS כאן לשני.
אני יכול לעשות את זה כאן. אני חושב שאני נחליף את כל הדבר הזה.
למעשה, אני חושב שזה יחליף את כל זה, אבל תוכל למצוא את הדרך ביחד.
אני אשים את זה כאן. כן. אני הולך למחוק את זה יותר מדי.
מה שאני לא להוסיף? זה נראה כמו הרבה. זה לא הרבה.
אני רק הרחבנו את הקו של קוד שכבר דיבר עליהם לפני,
ואני אומר, "כאשר הכל נעשה, כאשר כל הפקדים שלי כבר עשו,
"ואז לעשות את זה." אז לאחר מכן להפעיל פונקציה זו נקראת הושלם.
במקרה זה, זה דברים שאתה יכול להבין.
לך תמצא ששליטת div.
למעשה, יש דבר אחד שאני צריך לציין.
שהשורה הבאה היא בעצם אומרת, "יש לי ratingControlDiv את זה".
"אני רוצה לדבר אליו כאילו היו שליטה אמיתית, שליטת WinJS".
אז בעצם, אתה מבקש שממנו.
אתה אומר, "אני רוצה לדבר איתך כביקורת."
ואז אתה יכול להתחיל אומר דברים כמו, "אנחנו הולכים להוסיף מאזין בשבילך
"אז כשאתה שינית אנחנו יכולים להגיב על כך".
ואז גם אנחנו יכולים לעשות דברים כאלה. למעשה, זה הקוד הישן שם.
אני חושב שאני חסר הדבקה בתפקיד אחד יותר,
וזה יהיה הפונקציה הממשית שתגיב לשליטת הדירוג שהשתנתה.
תן לי פופ שבכאן נכון,
איפשהו שם בסביבה.
ובמקרה הזה, הדבר היחיד שחדש הוא העובדה שאנחנו הולכים אל
מה אומר לנו שליטת הדירוג ואנחנו מבקשים את מה שנקרא tentativeRating.
יש חבורה של דברים שונים אחרים ששליטה שיכולה להגיד לך,
וזה הולך שליטה על ידי שליטה.
זה מאוד פשוט. אתה תהיה מסוגל להבין את זה ללא בעיה כלשהי.
אני מפעיל את זה, ועכשיו כשאני משנה את דירוגים ולחץ על הדירוג,
אתה יכול לראות עכשיו זה בעצם להגיב אליו.
זה מכניס את הדירוג שעל המסך שלתג div ריק
מתחת לשליטת הדירוג.
זה הקסם של הרבה דברים גם כאן.
אז כפי שאתה יוצר יישומים עבור Windows Store,
יש טונה של פקדים שאתה יכול פשוט להשתמש. כולם עובדים ככה.
>> תן לי להראות לך את הצד החזותי של עיצוב עבור יישומים אלה.
חדשות טובות היא כבר יהיה לך כלי זה בעת התקנת הכל
אם אתה הולך להורדה ושאתה מקבל Visual Studio.
אני יכול לחץ לחיצה ימנית על זה. אני לא זום פנימה
זה פשוט אומר להרחיב בתערובת.
תערובת היא כלי נוסף שעובד זה לצד זה עם Visual Studio
והרבה יותר ממוקד בצד העיצוב של דברים,
כך שזה באמת משטחי כלים שמותאמים ליצירת סגנונות,
יצירת אנימציות, עבודה עם CSS, הרבה דברים בסוג כזה של וריד.
הנה מה שצריך להיות מאוד מעניין ודי ברור באופן מיידי שאנחנו מסתכלים על האפליקציה.
אני מקווה שאנחנו עדיין נמצאים.
במקום לראות את הקוד, שבו אנחנו עדיין רואים בתחתית,
אנחנו רואים ייצוג בפועל של היישום.
מה עוד, שזה לא רק ייצוג של האפליקציה, הוא למעשה הריצה האפליקציה.
וזה מה שבאמת נחמד על תערובת.
צוות עשה הרבה עבודה כדי להביא את ה-HTML ו-JavaScript ו-CSS לכלי הזה.
עכשיו אתה יכול למעשה, אם אתה סקרן, "מה זה אומר? מה אני יכול לעשות?"
אני ממש יכול לעצב לבקשה זו למרות שדברים כאלה לא קיימים בסימון שלי.
זכור כי שליטת דירוג? זה היה רק ​​תג div.
החומר הזה, כוכב זה, קיים רק בזמן הריצה. איך אני יודע את זה?
יש קצת קסם לכאן.
ראה הברקים האלה?
בכל פעם שאתה רואה את ברק, זה אומר שהוא נוצר על ידי משהו בזמן הריצה.
JavaScript כמה רץ והפך למשהו זה או יצר את זה עם קצת היגיון.
כוכבים אלה שאתה רואה שם נוצרו על ידי JavaScript על ידי WinJS.
הדבר נחמד הוא, שזה לא משנה לי, אני עדיין יכול לעצב אותו,
אני עדיין יכול להיכנס ולשנות את זה, אני יכול לברר מה קורה כאן,
אני יכול להסתכל על CSS, אני יכול להמשיך ולגלות למה הצבע הוא כפי שהוא,
אני יכול להתחיל להתעסק עם דברים ועושים דברים נוראיים,
כל מה שאני רוצה לעשות.
למעשה, אני אשאיר את הדברים לבד.
אבל אתם יכולים לראות כאן זה הכל CSS וזה מראה לך כאן.
אם אני עולה לשם, זה הולך להראות לכם את כל מה שהם מכנים נצחון,
כל כך את כללי CSS כי הם הספציפיים ביותר ונבחרו ברוב עבור פריט זה,
שיש לך כנראה נעלם מעל כבר בשיעורים שלך,
שבו אתה יכול לומר שיש בגופן כללי שאנחנו פונים לכל דבר,
אבל בגלל זה הוא H1 ויש לי צבע שהוגדר לh1s,
זה הולך להיות בצבע הזה, וזה בגלל שזה יותר ספציפי מbody1.
דבר זה אחד ממש כאן מציג את כל שאתה,
וזה באמת חומר חזק כמו שאתה מקבל מורכב יותר,
אתה תוהה למה הדברים האלה הם כפי שהם.
למעשה הוא יגיד לך, ואתה יכול לבחור כל אחד מפריטים אלה כאן.
צבע זה לא רע, למען האמת.
באפשרותך לבחור אותם. אני מקווה שאתה יכול לראות את זה.
לכל מה שיש לך על הבקשה שלך, אתה רואה את כל מפל
מכל את ה-CSS שהיה יכולים להיות מיושם על זה ואיזה מהם הוא זכייה,
איזה מהם באמת קיבל עדיפות.
אלה הם סוג של משעממים. אין הרבה קורה בכמה מאלה.
אם אני הולך ולשנות את הצבע, אז אתה תתחיל לראות כמה מדורג שם.
אתה יכול גם להשתמש ב-HTML גם כאן.
אני יכול לעבור ולשנות את מאפייני ה-HTML לכל הדברים האלה כמו שאני רוצה.
יש רק טונות של דברים כאן.
>> אני לא רוצה לקחת את הזמן שלך על ידי עובר כאן הכל. רק יודע שזה כאן.
יש הרבה פונקציונלי מוכוונת עיצוב זה רק זמין עבורך
כך שאתה יכול להישאר חזותי, לעבוד עם היישום, ולא צריך לעשות הרבה ניחושים
כי היית צריך לעשות בדרך כלל ורכיבה על אופניים חזרה מדפדפן בחזרה לעיצוב שלך,
בחזרה לדפדפן.
זה באמת דברים מגניבים בשביל זה, וכפי שאתה לפתח אפליקציה Windows Store,
זה הולך לגרום לך הרבה יותר פרודוקטיביים.
>> תראה גם זה מעקב את הסימון כאן וב-CSS
כמו שאתה עובד על דברים שונים.
זה כנראה באמת קשה לך לראות את זה, במיוחד בוידאו,
אבל זה מה שקורה כאן, ואני ממליץ לך להכיר את זה.
זה יחסוך לכם הרבה זמן. זה תערובת.
אם אתם עושים כל שינוי כאן, הם באופן אוטומטי הולכים לבצע חזרה למעלה
ל-Visual Studio.
זה אותו הקבצים, שזה אותו דבר הכל. אני אשאיר אותו לבד.
יש לי דוגמא טובה יותר שאני רוצה להראות לך.
אבל אם אני עשיתי שינוי שם והצלתי אותה וחזרתי ל-Visual Studio, זה היה אומר,
"היי, אתה פשוט משהו השתנה. האם אני יכול לטעון אותו מחדש בשבילך?" כן.
ואתה משתמש באותו חומר שם.
זה סופו של מדגם מסוים.
>> אני רוצה להראות לך דוגמא סוף גבוהה יותר רק כדי לתת לך תצוגה של פונקציונליות אחרת
אתם עשויים לחשוב על גם כן.
זוהי אפליקציה לדוגמא שאתה יכול להוריד.
אם אתם מחפשים משהו שנקרא המחנה של Windows בתיבה,
יש כמה דוגמאות שנמצאות בזה, ואחד מהם הוא ספר הבישול של Contoso.
אני רק יכול להפעיל את זה בשבילך.
מסך פתיחה מותאמת אישית. זהו יישום תצוגת גריד.
הם כבר חייבים כמה נתונים מותאמים אישית כאן. אתה יכול לנווט את זה.
אתה יכול ללכת ותסתכל על דברים שונים שיהפוך אותנו רעב ביום שישי אחר הצהריים.
אני לא יודע. מה הוא הולך לעשות לי את רעב ביותר?
אני לא יודע. אני רק הולך לבחור אחד.
אתה נכנסת לדברים האלה. זה יראה לכם את המתכון.
אתה יכול גם, במקום ללחוץ על פריט,
אתה יכול ללכת ישר לאותה קטגוריה של תוכן, כי הסעיף של תוכן.
במקרה זה, אתה יכול לקרוא המון לטיני מזויף אומר לך על כל המתכונים האלה כאן
ואז ללכת ימינה לתוך המתכון הספציפי.
זה תומך גם בדברים כמו השיתוף שהראיתי לך בעבר עם התמונות.
ניתן גם לחפש ליישום זה יותר מדי.
זה מאוד פשוט לעשות חיפוש.
בעיקרון, אתה רק מקבל מחרוזת טקסט מ-Windows
ואתה מחליט איך אתה רוצה לטפל בחיפוש עם זה.
זה כמה שורות קוד כדי לקבל את זה, ואז מה אתה עושה עם זה אחרי זה הוא לגמרי תלוי בך.
>> כאן יש להם גם בר יישום שבו הם משתמשים בחלק מהפונקציונליות אחרת.
אני רק אגיד לך מה זה.
תזכורת הוא הולכת להשתמש במה שנקרא הודעת טוסט.
זה באמת שימושי עבור נותן למשתמש לדעת מתי דברים קרו,
כמו יישום הותקן או משהו הושלם.
מדי זה גם טוב למשחקים.
אם יש לך עולם מתמשך או לוח מנהיג ושירות שאירוח ש
אולי במכונה נפרדת, ניתן לשלוח הודעות אלה למכונה
וגם אם המשתמש אינו משתמש במשחק שלך, לשחק את המשחק שלך או ריצת האפליקציה שלך,
הם עדיין יכולים לקבל הודעות על אותם סוגים של אירועים.
אז אתה יכול להגיד, "הטירה שלך כבר נהרסה או נהרסה כמעט."
"אחזור לכאן ולהגן עליה", או משהו כזה.
אתה לוחץ על ההודעה, אתה הולך זכות חזרה למשחק, ואתה יכול לשחק בו.
אז דברים כאלה יכולים לעזור באמת למשוך אנשים בחזרה לאפליקציה שלך די ביעילות.
>> יש גם תמיכה ביישום זה לשימוש במיקרופון, מצלמת האינטרנט,
עושה וידאו ולצלם.
ניתן גם להצמיד אריחים משני.
זה שימושי אם אתה רוצה, רק כדי להיות אריח שהולך ימינה לתוכן מסוים.
במקרה זה, זה הולך ימינה למתכון הזה.
כל מה שאני מציין אני רק מראה
כי זה דברים שאתה יכול לחשוב על שימוש גם כן.
על פי רוב, הם מאוד פשוטים לשימוש.
אני ממליץ לך רק מעלה כי סייר מדגם
ולמצוא לדוגמא שיכול להראות לך איך לעשות את זה.
זה די פשוט להביא אותם לתוך היישומים שלך גם שם.
>> אני הולך להראות לכם משהו אחר זה די מגניב כאן.
אני מקיש ביישום זה, ואני מתכוון לחזור לVisual Studio.
יישום זה פועל. הוא פועל מתוך Visual Studio.
אני יכול לעשות כמה דברים די מגניבים עם זה.
למעשה יש לי אפשרות לבחור אלמנט,
ואני יכול ללכת לכאן ליישום בשידור חי ואני יכול לומר,
"אני תוהה למה הכנת זמן הוא אפור קצת קל יותר מאשר התואר עצמו?"
אני יכול ללחוץ עליו.
זה הולך לסנכרן בחזרה לתוך Visual Studio,
וזה הולך להראות לי בדיוק את התוכן שנוצר שהביא בחלק זה של ממשק המשתמש.
אז במקרה הזה, זה פריט-כתוביות ומבנה כפול H4,
וזה כנראה אומר לנו את מה שאנחנו צריכים לדעת כי כמו H4 בהקשר זה,
זה הולך כדי לקבל סוג מסוים של גופן.
אבל אם אני עדיין לא יודע למה, אני יכול ללחוץ על סגנונות Trace.
אז אני יכול להרחיב את צבע ואני יכול לברר בדיוק למה הצבע שאינו בצבע הגוף
אך למעשה הוא משהו אחר.
זה הוא למעשה כלי הפיתוח מ-Internet Explorer
במידה הביאה לVisual Studio.
אם אתה כבר עובד עם כלים Chrome Dev, Firebug, דברים כאלה,
אלו סוגים של כלים הנמצאים בדפדפן,
סוג זה של פונקציונליות כבר הביא ישר לתוך-Visual Studio
אז אתה לא באמת צריך להשיק דפדפן ולעבוד עם הכלים האלה בנפרד.
עכשיו יש לי אפליקציה Windows Store פשוט רצה,
ואני יכול להתחיל למשוך אותו לגזרים ולגלות למה הדברים עושים מה שהם.
>> גם אני יכול גם לעשות את זה בדרך זו.
אני יכול ללכת ופשוט לבחור משהו נכון מהסימון ולברר מה זה
ביישום עצמו. אני חושב שכבר עבר הכל.
הנה אני מרחף מעל זה. אני יכול לבחור בה.
זה הולך להראות לי ביישום הריצה בפועל שבו הדבר הזה הוא
כי אני עכשיו בלחיצה על הסימון.
דברים ממש מגניבים.
כפי שאתה מנסה להבין מה קורה ומה ה-HTML עושה,
מה CSS הוא עושה, לשמור את זה בחשבון.
זכור את זה הוא כאן בשבילך
וגם בלנד שיכול לעבוד עם יישום ריצה בשידור חי.
>> דבר אחד האחרון שרציתי להראות לך עם יישום זה -
דרך אגב, זה מראה לך דלתא כדברים משתנים יותר מדי,
כך שאתה יכול לצפות עבור מדגיש הצהוב האלה.
אלה הם דברים שיש להם רק שינו ביישום.
אבל דבר אחד אחרון. אני רוצה לחזור לBlend רק לרגע כאן.
אנחנו תפתחו את זה, להרחיב בתערובת, אותה אפליקציה, אותו דבר.
אני רק רוצה להראות לך את החוויה כאן הוא לא רק שאתה תקוע בעמוד הבית
מסתכל על הדברים שאתה תקבל כברירת מחדל כאשר אתה מפעיל את האפליקציה ולתת לו לשבת שם.
ניתן גם להפעיל על הסמל די הקטן הזה עד כאן.
זה נקרא מצב אינטראקטיבי.
אתה לוחץ על זה. זה הולך להעלות את הבקשה שלך.
אתה לא במצב עיצוב יותר, כך שאתה לא הולך להיות לחיצה על דברים
כדי לשנות פונקציונלי, אבל למעשה אתה יכול לעבוד עם היישום עכשיו.
אתה יכול ללחוץ דרך, אתה יכול לעשות מה, להגיע למתכון שאכפת לך
או לקטגוריה. בואו נלך לקטגוריה זו.
אני אומר, "בסדר, כאן מקום שבו אני רוצה לעצב".
ואז אתה לוחץ על לחצן זה שוב, זה יביא אותך בחזרה לתוך שטח העיצוב,
ועכשיו אתה יכול לעשות את כל הדברים האלה שאני מדבר עליהם לפני.
אני אשמור את הלחיצה עד שאני מקבל את זה שנבחר, לברר את ממדיו,
לגלות את ה-HTML עבורו, CSS בשביל זה
ליישום פועל, חלק חלק מאוחר יותר של היישום.
מאוד מאוד שימושי. אני אראה לך את זה.
נא לשמור את זה בחשבון אם אתם מחפשים לכתיבת קוד עם זה
כי זה הולך לחסוך לך הרבה טרחה, וזה חומר די טוב.
זה פחות או יותר כל מה שרציתי להראות לך בתערובת ובVisual Studio עבור כל זה.
>> כל שאלות על כל אחד מהכלים האלה?
משהו בכלל? יש לי >> [Guarin] דברים למסור, שאלות כל כך טובות, חומר טוב.
>> [בואן צוחק] אני כבר הראה לך ההדגמות שלי כאן.
אני הולך לשים את זה בעמוד המשאבים ופונים לשאלות עכשיו.
כי ההתייחסות הראשונה היא שאתר של הדור App עם מסלול משחק ואחר היישום.
הירשם לאלה.
אתה לא צריך לחכות 30 ימים כדי לקבל את התוכן.
אתה יכול להתחיל הולך ומסתכל על התוכן כרצונך.
אני מבין את מסגרות הזמן שלך עשויות להיות שונות מ-- [צוחק]
לכן, כאשר הוא Hackathon? זה כמה שבועות, נכון?
אז אין לך 30 הימים לחכות.
אז כן, אתה יכול להירשם לזה ואז פשוט להתחיל לתלוש את התוכן ממנו.
גם התפתחות ומרכזי העיצוב.
ולא הזכרתי את זה, אבל יש גם Docs Store.
זה יהיה לאחרי Hackathon כמו שאתה מוכן להתחיל הגשת האפליקציות שלך לחנות.
יש כמה קווים מנחים מועילים כאן, קצת הדרכה על איך להשיג דברים בחנות,
כמה מבעיות נפוצות שעלולים להכשיל אותך,
וזה הסוף של משאבים אלה.
>> אז מה בראש שלך? כל דבר אחר שאתה -
[Guarin] מי חושב על לעשות יישום של Windows עבור CS50? מגניב.
[Bowen] מגניב. גדול.
>> כל שאלות על הדברים שראיתם עד כה, ואיך זה קשור לזה?
לדוגמא, עם יותר זמן אני יכול לקחת את משחק שכתבתי
ושפועל בדפדפן ופשוט סוג של לעבור את התהליך
להביא את זה לתוך Visual Studio ומה שהופך את האפליקציה Windows Store.
זה לוקח יותר זמן ממה שאנחנו באמת היינו צריכים לכלול היום,
אבל את הגרסה הקצרה היא שזה אותו הקוד שיש לך לרוץ בדפדפן,
והדברים שאתה משנה הם הדברים שאתה מחליט לחבר ל-Windows 8.
אז אם אתה רוצה להשתמש בקסמיה, אם ברצונך לחפש או לשתף,
אתה צריך ליצור סרגל אפליקציה להסתתר כמה פונקציונלי על גבי זה,
אלה הם הסוגים של דברים שאתה תשתנה.
אבל הליבה של יישום האינטרנט שלך יכולה להישאר ללא פגע.
שוב, כל עוד זה עובד בIE10, זה הולך להיות יציאה ממש קלה
להביא את הדברים האלה לVisual Studio, לתוך תערובת, ולהפוך אותו לאפליקצית Windows Store.
שוב, הדברים היחידים שאתה צריך ללמוד הם תכונות אחרות אלה
כי אתה יכול להשתמש בו כדי להאיר את יישום, כמו אריחים חיים ודברים כאלה.
>> כן. >> [תלמיד] השאלה שלי היא על עבודה ניידת.
אז אם אתה עושה אפליקציה שפועלת כיישום בשולחן עבודה,
האם זה באמת קל להעביר אותו לסלולרי, או שיש -
השאלה היא, אם אני עושה אפליקציה Windows Store שבאמת מותאמת לסביבה זו
ואני רוצה להביא אותו לעולם נייד, במה זה כרוך עם עושה את זה?
כי, כמו שאלות רבות, הוא תמיד תשובה משתנה כל הזמן.
חדשות טובות היא שאם אתה דבק עם HTML ו-JavaScript, CSS,
אם אתה מתחיל מאפליקצית Windows Store,
זה הולך לתת לך להביא אותו לאינטרנט
ולאחר מכן להשתמש באותם סוגים של טכניקות, כמו שאילתות בתקשורת ודברים,
להסתגל למכשירים בגדלים שונים.
שאמרו, תמיד יש מסגרות ודברים שם בחוץ
תמיכת שהארכה את טכנולוגיות שונות, פלטפורמות שונות.
זה משתנה כל הזמן.
אנחנו גם לשנות דברים, כמו גם אנחנו נראים כלפי מה שיש לנו עכשיו
למעשה יצאתי עם טלפון Windows 8.
יש לנו כמה תשתיות ליבה משותפות
הציע בין יישומים לסביבות אלה.
אז את הדברים שאתה עושה כדי ליצור אפליקציה Windows Store,
הרבה שיכול לשאת מעל ליישום Windows Phone 8 גם כן.
זה שוב סיפור מתפתח, ולכן יש קצת תוכן על זה בבנייה.
SDK פשוט יצא לפני זמן קצר. הוא שוחרר רק לפני זמן קצר.
אבל במונחים של פלטפורמות אחרות גם
אתה בטח נתקל בהרבה מסגרות בפלטפורמות גם כן.
חדשות טובות היא הדברים שאתה עושה כאן,
פונקציונליות הליבה היא ישר דברים סטנדרטיים באינטרנט.
הדברים היחידים שלא לתרגם בקלות הם הדברים שעושים Windows 8,
אבל זה לא מפתיע כי זה תכונה של Windows.
אתה לא הולך למצוא שיתוף או סוגים דומים של חוזים בכל פלטפורמה אחרת.
אז אלה הם הדברים שאתה רוצה מנקודת מבט עיצוב
לוודא שיש לך דרכים לסוג של מופשט שכל כך אתה יכול לומר,
"אם אני פועל על זה, אני יכול לעשות את זה."
אם אני לא, יש כמה תבניות עיצוב שאתה יכול להשתמש בו כדי להסתיר את סוג של החומר שממנו.
אבל לזכור את זה. כן. סליחה. קדימה.
>> [תלמיד] אם אני רוצה לבדוק את האפליקציה שלי Windows על גבי [לא ברור]
[Bowen] כן. אני מדלג על דבר אחד יותר מדי. כן.
אני מוכן לענות על השאלה הראשונה שלך, אז אני אראה לך תכונה ששכחתי להזכיר.
יש לנו כמה מכונות זמינות באופן מקומי. אני מצטער.
השאלה הייתה, איך אוכל לבדוק את הדברים על מכשירים
אם אני לא במקרה יש המון דברים לבחירה?
[Guarin] אנו השאלתי לך חבר 'ה, אני חושב, 5 או 6. כמה אתה צריך?
[תלמיד] יש לנו 4 מהם. >> אוקיי. יש לכם 4 צפחות ​​לשחק עם סביב.
אז בהחלט לתת כולם יודעים, בבקשה. [צוחק] >> [Bowen] מדהים.
זה אפילו טוב יותר מאשר תשובה שאני הולך לתת לך.
יש לנו שעתי עבודה עבור מפתחים שאנחנו עושים במשרד שלנו
ועכשיו מגיע בקרוב לחנות של מיקרוסופט על פני בPru,
אבל אדווין כבר דאג לך.
ישנם 4 צפחות ​​זמינות להשאלה, לבדיקה.
הנה. יש דוגמא של עד אחד לשם.
אז כן, בהחלט. גדול.
בשום פנים וללא ספק הדרך הטובה ביותר לבדוק את זה היא להיות במכשיר.
אם אתה לא במקרה יש אחד עדיין או שאתה לא רוצה ללכת ברחבי קמפוס בשלג
כדי לתפוס את אחד או משהו כזה, יש דרך לעשות את זה בחזרה ב-Visual Studio.
אם אני חוזר לשם אני היה כאן, כאן במקום להשתמש במחשב מקומי,
אתה יכול להתחבר למחשב מרוחק, אבל זה לא על מה אני מדבר כאן.
סימולטור הוא הדבר שאולי אתה רוצה לבדוק.
אני אריץ את זה, ובאמת מה זה, זה בעצם חלון על גבי המערכת שלך.
כאן הוא למעשה הריצה המערכת שלי, ריצת Contoso,
אבל באופן שמאפשר לי לשנות חלק מפרמטרי ביצוע,
הפרמטרים הסביבתיים.
אז אני יכול לומר כאן, "אתה יודע מה?"
אה. יש לי כבר אותו פועל בצג 27 אינץ מדומה ב2560 רזולוציה.
אני יכול בקלות לרדת למטה ולראות מה הבקשה שלי הייתי עושה עם מסך קטן יותר
או על ידי שינוי הגדרות DPI או משהו כזה.
אז על גבי מסך קטן, 10.6, מה זה הולך לעשות?
זה עדיין נראה די טוב, נכון?
אתה רוצה לעשות את זה, במיוחד אם אתה הגשת לחנות, כי אנחנו עושים
כחלק מתהליך הבדיקה.
ואם יש בעיות כאלה,
אז אולי אתה נתקל בבעיה לקבל אישור לחנות.
אבל זה חלק מסימולטור. ממש מגניב. קל מאוד לעשות את זה.
ניתן גם להשתמש בתכונות כמו סיבובו גם כן.
אני יכול ללחוץ על הכפתור כאן, יש לסובב את זה, לראות מה מישהו יצטרך כחוויה
מסתובב הצפחה שלהם, הלוח שלהם, ובאמצעות היישום שלך עם זה.
יש כמה דברים אחרים כמו מגע אמולציה ועוד כמה דברים,
הגדרת ה-GPS.
אני יכול להעמיד פנים שאני במקום אחר ולראות מה הבקשה שלי עושה
כשאני מעמידים פנים שאני שוב בסיאטל או משהו.
אבל זה באמת תכונה שימושית, והוא בנוי לשני Visual Studio ובתערובת.
כן. השאלה שלך.
>> [תלמיד] אם אתה כותב משחק, אין לי-Visual Studio תמיכה בשום צורה לאנימציה?
כן. השאלה היא סביב תמיכת אנימציה, במיוחד עם משחקים.
זה תלוי. [מגחך]
עם JavaScript אני אומר שיש כנראה פחות תמיכה ממה שיש בצד XAML,
שבו יש לוחות זמנים, יש תרחישים ודברים שבנויים פנימה
לאנימציות ביישומי JavaScript, אני לא יודע עד כמה תשובה שאני רוצה לתת לך.
יש לי משאבים בבלוג שלי שעוברים דרך הרבה אפשרויות עבור שתי אנימציות הפיזיקה,
אפשרויות למשחקי מוכווני JavaScript ב-Windows 8.
הייתי להפנות אותך לאלה.
בעיקרון, יש כל כך הרבה אפשרויות.
הסיבה שאני מהסס היא שיש כל כך הרבה אפשרויות לעשות אנימציות עם JavaScript.
זה יכול להיות ב-CSS, יכול להיות מבוסס בד זה, זה יכול להיות אנימציות DOM רק בסיסיות,
זה יכול להיות הרבה דברים שונים, כך שזה באמת תלוי בבחירה שלך.
אם תחליט להשתמש במשהו כמו Create.js או ליים או סוגים אחרים של מסגרות -
ובכן, אני אפילו לא בטוח שאתה הולך להיות מסוגל להשתמש במסגרת קצה גבוהה
רוצה השפעה או לבנות.
שנוטה ליצור יותר קוד ממה שאתה עשוי לשקול מחדש.
אבל במקרים אלה, אתה עדיין יכול להשתמש בסימולטור, אתה יכול להשתמש בסביבות,
ואני נוטה רק לשימוש בסביבה זו לפלטפורמת המבחן שלי במקרים אלה
כמו שאני פיתוח משחקים.
אני כבר בסדר במיוחד עם אנימציות בד,
וזה כנראה הדבר הנפוץ ביותר.
הכי טוב שאתה הולך כנראה למצוא הוא הכולים הפיתוח בדפדפן
והכולים הפיתוח ב-Visual Studio.
סוג של תשובה פתלתלה לשם, אבל אני מקווה שיש לי את התשובה שלך. כן. שלך.
>> [תלמיד] מהן אפשרויות אחסון נתונים עבור Windows 8 אפליקציות?
מהן אפשרויות אחסון נתונים עבור Windows 8 Apps, אפליקציות Windows Store?
האפשרויות שלך הן באמת כל יישום מקבל בריכה של אחסון המקומי שלה
להגדרות ולנתונים, אבל זה גם גיחוך קל לשימוש נדידת אחסון,
כדי להשתמש באחסון מבוסס ענן. זה בחינם.
מה שקורה הוא שאתה בעצם לבחור בכיתה שונה, ואתה אומר,
"הגדרות נדידה, שמור, סט מסוים של תוכן,"
והחשבון שלהם מיקרוסופט, מה שהם כבר חתמו כב,
הולך להיות המפתח לנדידת מידע שמסביב.
אז אם אני משתמש במשחק שלך על המחשב הנייד שלי ולאחר מכן אני נכנסתי עם אותו החשבון
ואני משחק את המשחק על משטח או מחשב לוח,
באופן אוטומטי לשוטט שהגדרה ונתונים בין המכונות האלה.
זה דבר כברירת מחדל. זה טוב עבור כמויות מסוימות של נתונים.
לא היית לשים מסד נתונים ענק לאלה.
בשביל זה אתה צריך ללכת לסוגים אחרים של פתרונות, כמו מסד נתונים המתארחים בענן,
דברים כאלה.
יש כמה אפשרויות אחרות בקהילה סביב סוגים אחרים של טכנולוגיות מידע.
גם אני ראיתי כמה אפשרויות SQLite בקהילה מסביב.
כך יותר ויותר הם מתעוררים, אבל אלה הם הדברים העיקריים שהיית להסתכל לכיוון
למשחק או אפליקציה.
והיה לך שאלה בחלק האחורי מדי.
>> [תלמיד] במונחים של הרשת [לא ברור] העלאה או הורדה של קבצים [לא ברור]
[Bowen] האם השאלה שלך איך אתה יכול לראות את זה או איך אתה יכול לאתר באגים ושלבדוק את זה?
[תלמיד] איך אתה יכול לדבג אותו [לא ברור]
סליחה. אני לא יכול לשמוע את כולו.
[תלמיד] איך אתה מקבל את זה באג שנבדק וגם [לא ברור]
גדול. גדול.
איך אתם עובדים עם רשת? איך אתה יכול לראות מה קורה?
יש תשובות רבות ושונות לזה,
אבל תן לי להראות לך כנראה הדברים שהכי הקל כאן.
תן לי להיפטר של סימולטור לשנייה.
רק כמה אפשרויות ניפוי לעבודה ברשת.
יש ערימת רשת מלאה האפויה ישר לתוך הן ברמת WinRT ומWinJS,
כל כך בקלות אתה יכול להפוך XHR, סוג AJAX קורא ממשחק או האפליקציה שלך כדי לעשות את זה.
בראש ובראשונה, אני נוטה להשתמש 2 דברים.
אני משתמש בכלים בפועל dev עצמם, שיש להם מחסנית רשת האפויה לתוכם.
תן לי להראות לך את דף הבית של Windows.
אני יכול להביא את זה למעלה, ויש בעצם פרוקסי רשת אפוי לתוך כלים אלו כאן.
אז אני יכול לעשות את זה, אני יכול לרענן את הדף, וזה הולך להראות לי את כל האינטראקציות,
AJAX כולל קורא למושב זה, למשך הזמן של הבקשה.
זה שימושי. זה הולך להיות מאוד שימושי עבור יישומים מבוססי דפדפן.
עבור סוגים אחרים של יישומים, כוללים יישומים של Windows Store,
אני משתמש בכלי שנקרא כנר.
אתה הולך לקבל את משחק בתגובה. [מגחך]
כנר הוא פרוקסי פשוט. אני חושב שאני יכול להראות לך את זה.
זה פשוט GetFiddler.com, אשר, למרבה הפלא, אני התחקות מחסנית הרשת שלי
הולך GetFiddler.
אבל בכל מקרה, כנר כבר נכתב על ידי אחד מראשי הממשלה בצוות IE,
כך שהוא יודע מה הוא עושה.
זה פרוקסי טוב שאתה יכול להשתמש עבור תעבורת רשת באגים.
אני ממליץ על זה. שאלה גם שם.
>> [תלמיד] האם יש דרך קלה לשלב קלט שפה זרה,
כמו יפני או סיני, לתוך יישומים של Windows?
אני לא יכול להגיד שעשיתי יותר מדי ממנו בעצמי, אבל זה אפוי פנימה
ישנן אפשרויות עבור כמובן פולטת את הבקשה שלך - אני מצטער, אני לא אמרתי את השאלה -
אפשרויות סביב גלובליזציה, לוקליזציה של תוכן,
כולל דברים כמו להיות מסוגל למכור בשווקים שונים
ולמקד את הגרסה זו של היישום שלך לשפות בודדות אלה
או תרבויות או דברים כאלה. נבנה לחלוטין פנימה
היו לנו תמיכה שעבור לנצח,
ושנושא קדימה לאפשרויות שלך עבור Windows Store.
אתה יכול לעשות את זה בחנות עצמה, למכור בשווקים שונים,
אתה יכול לעשות את זה ביישום וכן גם עם שימוש במשאבים להגדיר,
"אם אני פותח לתרבות הזאת, ולאחר מכן להשתמש עוקף אלה התוכן הטקסטואלי שלי
"או להשתמש בזכות לקורא עזב".
כל אלה הם חלק מWinJS ברירת המחדל ו-APIs WinRT. שאלה טובה.
>> איך אנחנו עושים? כל האחרים?
ואם מישהו בוידאו יש שאלות, אני cbowen @ מיקרוסופט,
אז אני שמח לקחת את כל השאלות שלך מהעתיד.
מאוד - מן העתיד, עתיד [מחקה הד].
אז הנה הוא לי. תן לי להחזיר את הקשר שלי כאן.
אז פשוט לשלוח לי פתק, cbowen @ מיקרוסופט,
ואני אחזור אליך ברגע שאני יכול.
>> כל דבר אחר שאתם תוהים? האם אנחנו טובים?
גדול. בסדר. תודה רבה לכולכם. אני מעריך את זה. [מחיאות כפיים]
>> [CS50.TV]