
הטקסט המלא של הדקות הראשונות בהרצאה «תכונות ופעולות IBOutlet And IBAction תרגול - Ask The Oracle» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
שלום וברוכים הבאים אנחנו רוצים להתחיל היום בסדרת סרטונים שעוסקת בפיתוח אפליקציות בסיסי בשפת סוויפט אם קודם למדנו את שפת סוויפט עצמה ואחר כך למדנו לייצר אפליקציות אז הגיע הזמן שנשלב את שתי הדברים יחד ונעבור לפיתוח אפליקציות שלשם כך התכנסנו אז אנחנו רוצים לפתוח את אקסקוד ובאקסקוד
לייצר פרויקט חדש פייל ניו פרוג'קט הפרויקט שלנו כמו תמיד הוא מסוג סינגל ויו אפליקיישן ואנחנו נלחץ פה נקסט. לפרויקט שלנו אנחנו נקרא היום Ask the Oracle.
עכשיו, אתם יכולים אולי לשאול מה זה Ask the Oracle. עכשיו, יש כל מיני, זאת אפליקציה מאוד מאוד פשוטה, מאוד בסיסית, סופר פשוטה, ובכוונה בחרתי בה כדוגמה.
יש בגוגל כל מיני אתרים כאלה שנקראים Ask the Oracle. בסדר? בואו נראה על מה מדובר, מה זה האתרים האלה. אז אני פשוט הולך רגע לגוגל, ואני אחפש נניח את צוות המילים האלה, אנסרינג אורקל או אסק דה אורקל כל מיני אורקל.
אורקל במיתולוגיה היוונית היה בעצם איזשהו נביא כזה שהיה אומר לאנשים נבואות, מנבא נבואות. אנחנו ניכנס פה לאתר הזה. דרך אגב יש מלא אפליקציות על אורקל באופן מפתיע בחנות והם נורא משעשעות.
בוא נשאל את אורקל האם אנחנו נלמד היום סוויפט. בוא נראה, כן, אנחנו רואים שאתה חושב היום על סוויפט אז בואו נלמד את זה. דרך אגב האורקל פונה סתם תשובות קשקושיות כאלה שפשוט מאוחסנות איתו באיזשהו מאגר והוא מגריל כנראה תשובה נכון? זה מה שהוא עושה עם התשובות שלו וזה גם
מה שאנחנו רוצים לעשות אנחנו רוצים להכין אוסף של שאלות ותשובות מוכנות מראש ולבחור ולהגריל ביניהן אלא אם כן יש לנו תשובה מוכנה באפליקציה קודם כל בואו ניגש למשימת הייצוב כמו שלמדנו בשיעורים הקודמים כדאי לתת איזשהו רקע מסביב כדי לעשות את זה אני
אחפש פשוט תמונת רקע בוא נעשה oracle background אנחנו רוצים לחפש תמונה שהיא כמובן חינמית וכולי אז אני אחפש בתמונות בכלי החיפוש ככה תחת כלים אני יכול להסתכל פה על זכויות שימוש ולחפש תמונות שמסומנות לשימוש חוזר מסחרי וככה בעצם אני יכול לחפש תמונות נו שמותר לי להשתמש
בהן אני רואה את התמונה הנחמדה הזאת ואני אנסה לקחת אותה כרקע אז אני אפתח את התמונה בטאב חדש ואני יכול להוריד כרגע את התמונה אליי אנחנו נעשה פה save image as אנחנו נשמור את התמונה להורדות שלנו לתיקייה של הקורס כאן אני אבחר בשם נניח אורקל כדי שיהיה יותר פשוט ועכשיו אני אפתח את התיקייה הזאת ואת xcode
בוא נפתח גם את התיקייה בסדר ואני אגרור את התמונה כמו שאמרנו לך יפה אז יש לי את הרקע בואו נעבור לייצוב של האפליקציה כאן אני ארצה פשוט להוסיף image view אני הולך לobject library שנמצאת כאן ופה יש לי את כל הפקדים אז בואו נוסיף פשוט image view והתמונה היא
כמובן התמונה של ה-oracle אז אני אעמוד פה על התמונה ובאטריביוט אינספקטור אני אבחר בתמונה של ה-oracle עכשיו אם אתם זוכרים אנחנו רוצים להוסיף אילוצים אני אלחץ על הכפתור של Add New Constraints, אני אוותר על ה-Constraints to Margins וגם אני אדאג שהאילוץ שאני אעשה יהיה ביחס ל-V עצמו ולא ביחס ל-Safe Area במקרה של Background
כי אנחנו רוצים שה-Background יהיה על כל המסך גם באייפון X ללא תלות ב-Safe Area באזור הבטוח שעליו דיברנו בהרצאות הקודמות.
אז עשיתי בעצם אילוצים לא ביחס ל-Safe Area ועכשיו אנחנו דואגים, סליחה, אפס אפס ככה מכל הכיוונים נכון בואו נראה איך הרקע שלנו יוצא נפלא יפה אנחנו יכולים ברגע שזה תמונה אנחנו יכולים להשתמש פה בקונטנט מוד כדי להחליט איך התמונה נפרסת בסדר נגיד האם היא נחתכת כדי להתאים האם אנחנו רוצים אולי ככה למרכז אותה באמצע פקד וכולי וכולי
בהקשר של התמונה הזאת אני חושב שהכי נעים יהיה לעשות באמת כמו שזה היה קודם בהתחלה סקייל טו פילד אז הנה יש לנו איזשהו בגראונד מעניין לאורקל שלנו עכשיו כמו שראינו באורקל היה לנו שם צורך בלייבל אז נלך לobject library אנחנו נבחר כאן לייבל ואנחנו נמקם אותו ככה במקום נחמד מה שאנחנו
נעשה אני אוסיף פשוט אילוצים בסדר אני אגיד 32 מלמעלה ובוא נאמר 16 משני הצדדים האחרים הפעם אין לי בעיה למקם את זה ביחס באמת לsafe area כמו שצריך רק רק ה-Background רציתי שהוא ייכנס, אתם רואים מתחת לקו של הסוללה, מתחת לשעון, ולכן האילוצים שעשינו קודם בכלל לא ביחס למרכזיות.
ה-Label שלי ממוקם יפה, הוא מתוח לשמאל, מתוח לימין ולחלק העליון, מה שכן, אנחנו רוצים כמובן למרכז את הטקסט, וכדאי לי גם לשנות את הצבע של הטקסט כדי שיהיה ככה נראה יפה על הרקע מסביב.
אני אבחר גם בפונט אחר, בואו נלך לשנות את הפונט יחד. איך משנים פונט? אני עומד פה על הפונט, משנה באות T מ-System Font ל-Custom Font וכאן אני יכול לבחור לעצמי פונט שנראה הרבה הרבה יותר נחמד, נגיד אני אבחר ב-Marker Feld עבור האורקל שלנו ואני אגדיל את הפונט נניח לפונט שמתאים לכותרת ובסטייל אני אלך על סטייל יותר רחב,
זה הגודל שאני רוצה לבחור, נגיד 32. אמרתי 32. עכשיו בכותרת, בוא נכתוב איזה כיף נכון אוקיי אז בכותרת בוא נכתוב ask the oracle מה נשאל את אני לא אוהב לצעוק פה אני אוריד את הסימן קריאה מה נשאל את ה oracle נכון אז מה אנחנו נשאל אותו אנחנו נשאל אותו בעזרת טקסט פילד יש
טקסט פילד הנה אתה טקסט פילד זה בעצם פקד שמיועד לקליטת טקסט נכון עכשיו בוא נאמר שאני רוצה אותו בדיוק ככה למקם את הטקסט פילד אבל יש לנו גם כפתור שאנחנו רוצים להוסיף אז בואו נוסיף גם את הכפתור איך נוסיף כפתור הולכים לאובג'קט ליברי בוחרים בבאטון ונגרור לנו גם כפתור אני חושב שאני אמקם את הכפתור כאן הפעם
נראה לי עיצוב נחמד אוקיי יפה מאוד לגבי הטקסט פילד אנחנו בעצם יכולים להגיד שאנחנו רוצים אילוצים של מלמעלה 8 מלמעלה או אפילו ככה נתרחק טיפה נעשה 16 מלמעלה ואני יכול לומר שאנחנו רוצים מהצדדים אפשר לומר שאנחנו רוצים נגיד 32 מהצדדים הוא קצת ימתח יפה.
עכשיו אלה האילוצים שלמדנו בהמשך אנחנו נלמד גם על איך אפשר לעשות אילוצים ככה ביחס ללייבל שמעל אבל בינתיים אלה הכלים שיש ברשותנו ובהם נסתפק.
עכשיו לגבי הבטון אנחנו נמקם מתחתיו נמקם את הבטון מתחת סליחה לטקסט פילד וגם נמתח אותו לכל הכיוונים פשוט הטקסט שלו יהיה במרכז זאת אומרת שגם אם ילחצו כאן וגם אם ילחצו כאן הבטון עדיין יהיה לחיץ.
בואו ניתן לבטון שלנו background גם כן כדי שנוכל ככה לראות אותו בצורה בולטת. ה-background של הבטונים נמצאים תמיד תמיד למטה למטה באזור איפה שכתוב view, וכאן אנחנו רוצים לתת רקע נניח נחמד לכפתור של האורקל, כשאת הצבע של הטקסט נשנה מיד לצבע טקסט נניח שחור ask, וגם כאן כדאי לנו להחליף את הפונט לאיזשהו custom
font שיראה יותר יפה בוא נבחר עוד פעם אני חושב בmarker field כדי ככה להתאים את עצמנו לעיצוב ונגדיל אולי טיפונת ל-22 ופה אנחנו נכתוב ask נעלה פה רגע למעלה ונכתוב ask כאן בטקסט פילד שלנו יש לנו את התכונה של הפלייס הולדר שבה אנחנו רוצים
לכתוב your request share יפה אז דרך אגב גם את זה כמובן אפשר למרכז. יפה, אז זה העיצוב שככה בחרנו לעשות. אתם מוזמנים נניח לעצור פה את הסרטון ולוודא שאתם מצליחים לעשות את זה א', כמו שאני עשיתי את זה, וב', אולי אתם רוצים לעצב את זה קצת אחרת, אולי עלו לכם רעיונות עיצוביים אחרים לראש ואתם רוצים לעצב את זה בצורה שונה, נניח להרחיק את זה קצת יותר או פשוט לערוך
טיפה את האילוצים, בסדר? אז אני לגמרי מזמין אתכם פה לעצור את הסרטון ולעצב את האפליקציה הזאת איך שאתם רוצים ורוצות. יפה.
גם כאן, אתם רואים, אני יכול לשנות פה את האילוצים ולעשות אילוצים מה שאתם בוחרים. אוקיי, אם בחרתם, נניח, אני בחרתי בכוונה לעשות פה איזשהו דירוג, אבל אם בחרתם לעשות יותר סימטריה, אתם לגמרי ככה מוזמנות ומוזמנים לבחור פה את האילוצים כמו שאתם רוצים.
יפה. בואו נתקדם הלאה. בעצם מה שאני רוצה לעשות אני רוצה שאם לוחצים על הכפתור תופעל פונקציה בסוויפט אוקיי אז בואו נלמד איך עושים את זה. כדי לעשות את זה כל מה שאנחנו צריכים לעשות זה ללחוץ פה על שתי החישוקים האלה שיש אשר יכנו הם חישוקיים.
עכשיו בתכלס קוראים לדבר הזה אסיסטנט אדיטור ואם אני אלחץ כאן על האסיסטנט אדיטור אז נפתח לי מסך כפול אתם רואים בצד שמאל יש לי את העיצוב ובצד ימין אנחנו רואים את הויו קונטרולר שלנו עכשיו שימו לב לאקורדיונים פה הם מאפשרים לי לפנות לעצמי קצת יותר מקום אני בעצם פותח את האקורדיון ימינה וגם שמאלה אוקיי יפה כדי לפנות לעצמי
מקום יש פה עוד אקורדיון אחד אם אני ממש ממש ככה רוצה לראות חצי חצי אז מצד אחד יש לנו את קובץ העיצוב ומצד שני יש לנו את קובץ ה-view controller, עדיין אנחנו בעצם מצייתים פה לאיזשהו design pattern שנקרא MVC ואנחנו נדבר עליו בהמשך.
כרגע אני אגרור את ה-label שלי לכאן, אתם רואים? איך אני עושה את זה? בואו נראה איך אנחנו עושים את זה. אנחנו יכולים לגרור בכמה דרכים, דרך אחת זה ללחוץ על הכפתור של קונטרול וגרירה, רואים?
עכשיו, דרך, ולעזוב, דרך אחרת זה לעשות קליק ימני אם יש לכם עכבר וגרירה גם כן יעבוד אוקיי אז קליק ימני וגרירה עובד באותה צורה בדיוק אנחנו יכולים לגרור עכשיו מה בעצם אנחנו יכולים לגרור אתם יכולים לשאול אותי אני רוצה נניח לגרור כרגע את הכפתור שלי אז את הכפתור אני גורר לכאן שימו לב לאן אנחנו
גוררים ומה בעצם אנחנו עושים כאן מה אמרתי לכם קודם אנחנו רוצים להגדיר לעצמנו איזושהי פונקציה שהפונקציה הזאת בוא נאמר button tapped או ask me הפונקציה הזאת תגיב ללחיצה על הכפתור בסדר זה הרעיון איך אנחנו נעשה את זה בואו נראה ביחד אנחנו פשוט נגרור מהכפתור לview controller ברמת המחלקה רואים כאילו שאנחנו רוצים ליצור פונקציה אז פה יוצרים פונקציות ואנחנו נשנה את הטייפ של הקונקשן לאקשן אקשן
זה פעולה בתכנות מומחה עצמית ולכן ופעולות הם פונקציה בתכנון מיוחד סמים ולכן הם קראו לזה אקשן. בואו נקרא לפעולה שלנו ask או ask me לאורקל ובטייפ של הדבר שעליו לחצו אנחנו רוצים לשנות את זה לsender.
any בסוויפט זה בעצם מתייחס ל-any object או כל טייפ ואנחנו לא רוצים כל טייפ אני רוצה לקבל בפעולה הזאת את הכפתור שעליו לחצו את הפקד שעליו לחצו. בואו נסתכל מה הכוונה. יש פה עוד דברים אני מקווה שהם מסובנים אצלכם בדיוק כמו אצלי.
האירוע הוא touch up inside, זאת אומרת לחצו והרימו את האצבע בתוך הכפתור והארגומנטים הם הסנדר, כלומר הכפתור שעליו לחצו. בואו נראה מה זה אומר ביחד.
יש לי פשוט פונקציה, תתעלמו שנייה מה-Ib action הזה, אני תכף אתייחס אליו גם כן, יש לי פשוט פונקציה, קוראים לה פונקציה ask me, הפונקציה הזאת מקבלת סנדר מסוג בטון, זאת אומרת הכפתור שעליו לחצו ויש לנו פה את ה-I don't care שאומר אנחנו לא רוצים להכריח אנשים לתת לנו את השם של הפקד,
פשוט תקראו last me וזהו, אוקיי? עכשיו בואו נתייחס רגע למה שהיה פה קודם עם איי.בי.אקשן, אז אני אוסיף את זה בחזרה. כל מה שאיי.בי.אקשן עושה הוא בעצם עוזר לאקסקוד, יש פה בעצם דקורייטור כזה שעוזר לאקסקוד להבין שיש לנו פה את החיבור, אוקיי?
אז זה פשוט נועד עבור אקסקוד כדי לייצר פה את הכישוריות הזאת, ואין לנו בעצם תוספת רבה בדקורייטור, פשוט גררנו והוספנו וזה מסמל עבורנו גם שמדובר פה באקשן ואנחנו יכולים גם לעמוד פה ולראות למה זה מחובר, יפה. עכשיו יש לי טיפ קטן אליכם בבקשה לא לעשות פה שינוי של השמות אם אני אשנה את
השם של הפונקציה עכשיו אני אגיד אה לא כתבתי עצמי כמו שצריך אני אכתוב את זה אחרת אני בעצם הורס את החיבוריות הזאת בסדר אין קישור יותר הקישור שלי לא יעבוד ויותר חמור מזה זה גם ייתקע לי בזמן ריצה אז בבקשה לא לשנות שמות הזאת אלא אם אתם מאוד רוצים לשנות שמות אפשר לעשות קומנד ולחיצה וכאן לעשות ריניים בסדר הריניים הזה יעבוד מותר לכם לשנות את השם אבל נגיד אסק מי עם אותיות קטנות אוקיי ואז
לעשות ריניים זה בעצם שינוי שהוא מותר מה אסור לי לעשות זה לבוא