
הטקסט המלא של הדקות הראשונות בהרצאה «מבוא ל-StackViews» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
בשיעורים הקודמים ראינו איך להצייף מסך לוגין. היום אנחנו נרצה לקחת את הדבר הזה צעד קדימה ולהסתכל איך נניח להצייף דבר כזה כמו רג'יסטר.
אנחנו בעצם יכולים ללכת באותה גישה כמו קודם ואז לא להוסיף חומר ואני מציע שתעצרו רגע את הסרטון ותנסו לעשות את התרגיל הבא מאוד מאוד חשוב לתרגל וללמוד זה דבר אחד ולתרגל זה דבר שני אז אני מציע שתייצבו לעצמכם באמת מסך לוגין לאפליקציה ומסך רג'יסטריישן לאפליקציה מציע שתפתחו אפליקציות אחרות, תראו איך הם עשו את המסך לוגין ורג'יסטר, תעצרו פה,
תעצבו לעצמכם מספר מסכים כאלה ואז תמשיכו הלאה. בואו נדגים איזה צורך עולה פה בעיצוב הזה של המסך רג'יסטריישן ונלמד איך לתפעל פה איזשהו כלי נהדר שנקרא StackView בהמשך.
אז קודם כל ננסה לפתור את התרגיל בדרך הרגילה. כדי לפתור אותו בדרך הרגילה אנחנו נרצה להוסיף לייבל עבור המילה רג'יסטריישן ואנחנו רוצים הרבה טקסט פילדים הפך, נכון?
קודם כל לגבי הרג'יסטריישן אז אילוצים בואו נמרכז את זה אני אשים את זה בחלק התחתון פה אפס מהקו הדמיוני שדיברנו עליו כבר ואני רוצה למרכז את זה אז אני הולך לאליינמנט ואוריזונטלי אין קונטיינר, נכון?
אז הלייבל שלי פה ממוקם יפה ממוקם היטב אפשר לשנות את הסוג של הפונט שפונט יפה יותר וגם את הצבע בסדר נבחר פה איזשהו צבע אחר ואני אשנה את הפונט לפונט יפה יותר אני אלך לקסטום ובוא נראה סוג הפונט בוא נלך על אבניר נקסט בסדר בוא נראה את הפונט הזה הנה הוא פה אני יכול להגדיל גם את הגודל של הפונט שזה ייראה יותר נחמד לגבי הטקסט פילד יש פה איזשהו אילוץ נוסף שאנחנו רוצים ללמוד
לגביו אז אני אשים פה טקסט פילד, את האילוצים האלה אנחנו כבר מכירים, אז איזה אילוצים עשינו בשיעור שעבר? נניח שוליים של 16 או 32 כמו המסך הקודם שלנו, מהצדדים, ומלמעלה אנחנו רוצים להתרחק, נניח 16 פיקסלים, וכשאני אומר מלמעלה אני
מתכוון מה-registration-bottom. פנטסטי. עכשיו, מה שיש לי פה להוסיף זה את ה-placeholder, נכון? את זה אנחנו גם כן אמורים לזכור.
אז במסך הזה אנחנו רוצים First Name, Last Name, E-Mail ו-Password, אוקיי, אז זה מתחיל להיראות נחמד, זה מתחיל להיראות ככה כמו שרצינו, אפשר היה להוסיף את ה-Background כמו שראינו בשיעור שעבר, אבל אני לא רוצה לחזור על עצמי.
אז מה שעשיתי היה פשוט לקחת את זה, להעתיק, קופי, קומנד C או שאפשר לעשות קליק ימני, אי אפשר לעשות קליק ימני, מצוין, אז לסמן, קומנד C כדי להעתיק והדבק על ידי קומנד V, בסדר?
עכשיו, אם אני רוצה לשים את הפקד הזה מתחת אז אני יכול להוסיף עוד פעם אילוצים 32 32 וכמה אני רוצה להתרחק מלמעלה נניח 16 הבעיה פה והיא התחילה כבר זה שאני מתחיל לחזור על עצמי ובתכנות אנחנו אף פעם לא אוהבים לחזור על עצמנו כי מה אני צריך לעשות עכשיו אם אני רוצה את הטקסט פילד הבא
קופי פייסט ועוד פעם לחזור על האילוצים אותו דבר 32 32 16 אתם מתחילים להרגיש את הבעיה ואם הייתי צריך עכשיו 10 כאלה זה היה ממש ממש נורא להעתיק להדביק תמיד כשאני עושה קובי פייסט אני מרגיש לא נכון ואני חושב איך יכולתי לפתור את זה אחרת בסדר אז אני כאן גיליתי שאני בעצם חוזר על עצמי
רואים עכשיו אל תתרגשו יש מלא מפתחים שהיו הולכים בדרך הזאת וזו דרך מצוינת זו דרך שעובדת הנה סיימתי וואלה עשיתי קובי פייסט אבל סיימתי מה שאנחנו רוצים ללמוד אבל זה ככה ההשערה איך בכל זאת אפשר בצורה יותר אלגנטית לקחת ארבע פקדים ולמקם אותם אחד מעל השני בלי לעשות את כל האילוצים עוד פעם ועוד פעם אוקיי זאת
אומרת זאת גישה אחת והיא עובדת מצוין אז בואו אני אשאיר אותה לרגע תשלימו את הפרויקט למצב שלי ואחר כך אני אדגים גישה אלטרנטיבית בסדר אני עוצר כאן כדי שתוכלו להגיע למצב שלי ואחר כך נמשיך אז אחרי שראינו איך עושים את הגישה הראשונה, שהיא גישה טובה, היא עובדת, היא עובדת נפלא, אנחנו רוצים ללמוד איך לעשות בדיוק את אותה קונסטלציה עם פחות
אילוצים ועם פחות copy-paste. כדי לעשות את זה אני אסמן את ארבע התיבות האלה. איך אני מסמן? אני מחזיק את כפתור השיפט לחוץ ואז בוחר ומסמן את הדברים האלה עם העכבר, בסדר?
שיפט, מחזיק אותו לחוץ ומסמן עם העכבר את כל הפקדים. אפשר גם בצורה הזאת לראות מאוד מאוד יפה את כל האילוצים ולראות כמה שהם אותו דבר ואז אני אלך לכפתור של resolve auto layout issues אלחץ עליו ואבחר לבטל את האילוצים עבור הפקדים הנבחרים רואים selected views יפה אז ביטלתי את האילוצים
רק עבורם