עבודה עם custom popover ב-Xcode

תמלול ההרצאה: עבודה עם custom popover ב-Xcode

הטקסט המלא של הדקות הראשונות בהרצאה «עבודה עם custom popover ב-Xcode» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:02

   שלום וברוכים הבאים בשיעורים הקודמים ראינו איך אנחנו יכולים להציג action sheets כ-popovers ו-popovers זה הדיאלוג הזה שמופיע מתחת או לימין או לשמאל לאיזשהו פקד אנחנו רוצים היום להציג popovers יותר customized שאנחנו יצרנו שאנחנו הצבנו כדי לעשות את זה אנחנו נוסיף עוד view controller לסטורי בורד שלנו

2. 00:26

   אז אני אוסיף view controller נוסף לצד ימין פשוט לחצתי פה על העץ של הפקדים והוספתי view-controller גררתי, עכשיו אנחנו נרצה לייצר לו גם קלאס כדי שנוכל לזהות אותו ולעשות איתו דברים נוספים אז אני מייצר פה New Swift File, קליק אם אני New File, אנחנו יכולים קובץ Swift או CocoTouch קלאס

3. 00:56

   שזה עדיף וכאן אנחנו נבחר במקום view-controller נקרא לזה Details view-controller, נגיד אנחנו רוצים ללחוץ על איזשהו פקד ואז להציג פרטים שיוצגו מתחתיו, אז זה הרעיון, הוא סאב קלאס של UIViewController כרגיל ואנחנו רוצים שהוא יהיה בתוך הפרויקט.

4. 01:17

   אנחנו נרצה בסטורי בורד שלנו, כמובן ברגע שמוסיפים ViewController צריך לשייך לו את הקלאס, נכון? אז אנחנו נלך ל-IdentityInspector ונשנה פה את הקלאס לזה שזה עתה יצרנו.

5. 01:30

   יפה. הוספנו ViewController. בואו נוסיף ל-ViewController הזה איזשהו עיצוב שהוא Customized.

6. 01:36

   למשל אני אוסיף פה בקאד שאנחנו עדיין לא מכירים קוראים לו TextView. טקסט-ויו הוא טקסט עם הרבה שורות בעל אפשרות לעריכה שבא אוטומטית עם סקרול-ויו.

7. 01:50

   אני יודע שאמרתי הרבה מילים, אני חושב שתמונה שווה את המילים האלה, ואני אראה לכם את זה פשוט בצורה ויזואלית. אז אני אמתח פה אילוצים עם שוליים של 8 מכל ארבעת הכיוונים.

8. 02:03

   לחצתי פה על Add Constraints ופשוט הוספתי את האילוצים הבאים. עכשיו לגבי הטקסט view הזה אנחנו נעתיק את הטקסט שכתוב ונדביק אותו הרבה פעמים כדי שיהיה לנו טקסט ממש ממש ארוך ומה שיפה בדבר הזה זה שיש פה סקרולינג אוטומטי אוקיי אז זה הרעיון של טקסט view זה פקאנט שבא להציג טקסט ארוך מדי

9. 02:29

   עם אפשרות לעשות סקרולינג דרך אגב יש פה עוד ככה אפשרויות נוספות אבל אנחנו נעזוב את זה לעת עתה אנחנו יש לנו את הטקסט view הזה ואנחנו רוצים עכשיו את כל כל הדבר הערוך להציג כ-popover.

10. 02:48

    כדי לעשות את זה יש האמת היא שתי דרכים, יש הרבה דרכים לכל דבר. אנחנו נשתמש בראשונה. הראשונה אומרת, ואני לא כל כך מעדיף את הדרך הזאת, אבל אני אראה לכם אותה בכל זאת, לגרור סגוויי.

11. 03:02

    הסגוויי לא יהיה show, הוא יהיה במקום הסגוויי המרגילים שאנחנו מכירים, הוא יהיה present as popover. זה הכל.

12. 03:12

    בואו נריץ, נסתכל מה קורה. אנחנו מריצים את זה כרגע עדיין באייפד, אני אלחץ על show, והוא מוצג פה בצורה נחמדה.

13. 03:26

    כלומר, יש עדיין את הקטע הזה של בוא נעשה סקרול וכאלה, בוא נסדר את המיקום, אבל נראה נחמד, נראה יפה. בואו נסדר שנייה את המיקום.

14. 03:37

    איך לסדר עכשיו את המיקום? אין לי את הדברים ביד, אין לי את הפקד ביד. אתם רואים, זה קצת פחות נוח. אבל אני אראה לכם בכל אופן, כי אף על פי שאני לא אוהב את הדרך הזאת, היא קיימת.

15. 03:48

    אתם רואים איזה יופי הציור של הסגוויי כפופ אובר. אז בואו אני אראה לכם את האופציה הזאת. בשיטה הזאת אנחנו הולכים ל-prepare for segue בגלל שזה מה שיש לנו, אני יודע שהצגתי את זה ב-segue אז לפחות אני יכול להתכונן ל-segue ופה אנחנו בודקים שה-destination הוא זה שיצרנו אז guard let dest

16. 04:11

    שווה ל-segue.destination as details view controller אחרת זה החוצה אחרת זה מישהו אחר עשה משהו אחר זה לא הקוד שלי אני בקוד שלי ברגע כרגע ברגע הנוכחי מציג את ה-details view controller יפה עכשיו test זה בעצם ה-details עליו יש לנו את הפופ-אובר פרזנטיישן קונטרולר הזה ממקודם וכאן אנחנו יכולים לשלוט ב-source view וב-source rect נכון?

17. 04:41

    אז ה-source view שלנו בעצם צריך להיות הכפתור אפשר לתת לו פה את המופע של הבטון כדי למצוא את הבטון שלנו בואו נגדיר אותו פשוט ברמת המחלקה אז מה שאנחנו נעשה אנחנו נוציא outlet לכפתור אז אני לוקח את הכפתור מושך ממנו Outlet. לא Action הפעם, Outlet נקרא לו Button.

18. 05:11

    ככה הוא יהיה מוכר ברמת המחלקה, ואז אנחנו נוכל להגיד שווה ל-Button. יפה. אהה.

19. 05:22

    עכשיו, דבר שני, אנחנו רוצים לשחק פה עם העניין של ה-Source Rect וגם עם ה-Arrow. אז לגבי ה-Source Rect, בואו נעשה בדיוק את מה שעשינו קודם, CG Rect ב-X אנחנו רוצים לתת את אמצע הפקד, הx יהיה button.frame.size.width חלקי 2. הheight יהיה ה-bottom.frame.height.

20. 05:56

    לגבי ה-width וה-height אני 0,0 כמו קודם. אני אוריד קצת, אני אשבור קצת את השורות כדי שהן תיראינה קצת יותר סבירות, אבל לא משנה פה את הקוד. וזה דרך אגב, למה אני קצת ממהר? זה בעצם קוד שכבר עשינו ואני לא ממש רוצה לשעמם אתכם.

21. 06:20

    אז Source view ו-source rect אתם זוכרים גם היה לנו את העניין של ה-arrow direction אז בואו נוסיף אותו כמו קודם up אז נקודה permitted directions וכאן המערך אנחנו נגיד נקודה up בואו נריץ עכשיו ונראה את זה אמור לראות יפה בוא נבדוק רק נלחץ על show ועכשיו זה מוצג יפה יש פה עוד איזשהו עניין של הגודל של הדבר

22. 06:53

    הזה ולגבי הגודל של הדבר הזה אז אנחנו גם יכולים להגיד Preferred Content Size ולהגדיר פה איזשהו גודל אחר, בסדר? איזשהו גודל שאנחנו מסכימים אליו, נגיד Width ו-Height כלשהם.

23. 07:10

    אוקיי, נניח אני רוצה 200 על 200, פשוט לשלוט בגודל של ה-Popover. בוא נראה. אז זה לא אמור להגיע עד סוף המסך למטה, זה אמור להגיע 200 על 200 כפי שהגדרתי,