Shape Drawable
drawable שבתוך res אפשר להגדיר משאבים גרפיים בקובצי XML. ההרצאה מראה את הסוג הראשון, shape, שמגדיר צורה, צבע וגבול לרכיב ויזואלי, ובסוף גם אפקט לחיצה ושימוש בצורה מהקוד.drawable, New, Drawable resource file. שמות קבצים בתיקיות res מורכבים רק מאותיות קטנות, קו תחתון וספרות. אות גדולה או סימן כמו פלוס גורמים לבעיות באנדרואיד.shape_circular_button מחליפים את תגית selector בתגית shape, וקובעים צורה oval. הצבע נקבע ב-solid, והקו העוטף ב-stroke עם צבע ועובי (בדוגמה לבן ו-2dp). התוצאה צורה עגולה אדומה עם גבול לבן.200dp על 70dp, מציבים ב-background את שם הקובץ בלי הסיומת.shape_rectangular_button מגדירים צורה rectangle ו-gradient עם startColor, endColor וזווית. הזווית חייבת להיות כפולה של 45. בדוגמה זווית של 45 ממצב אפור-שחור לכחול. מוסיפים stroke לבן ו-corners עם radius של 20dp לפינות עגולות.ripple שחובה לתת לה color (בדוגמה אדום), ובתוכה item שמכיל את תגית ה-shape שהוגדרה קודם. אחר כך מציבים אותו כ-background.setBackgroundResource עם R.drawable.<שם הקובץ>. כך אפשר להחליט בזמן ריצה איזו צורה תוצג.color, ובהרצאות הבאות רואים עוד סוגי משאבים בתיקיית drawable.פרקי ההרצאה: Shape Drawable
תמלול ההרצאה: Shape Drawable
הטקסט המלא של הדקות הראשונות בהרצאה «Shape Drawable» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
אחת מהתיקיות שנמצאות בתוך תיקיית ה-resources זאת התיקייה drawable. drawable מאפשרת לנו להגדיר סדרה של resources מאוד ספציפיים שאנחנו יכולים לשים בתוכה ואחר כך להשתמש איתם.
ה-resource הראשון שאנחנו הולכים לראות שניתן לשים בתוך drawable זה פשוט מאוד shape. שייפ זה הגדרה של צורה שיש לה צבע ויכול להיות לה גבול מסוים ועוד כל מיני הגדרות שאנחנו יכולים להגדיר ולאחר מכן להשתמש איתה על גבי רכיב ויזואלי.
אז איך עושים את זה? מכה שימני עד תגיעת ה-durable, new, durable resource file. בואו נתחיל קודם כל עם איזשהו קובץ שמאפשר להגדיר צורה עגולה עבור לחצן.
זאת אומרת שאנחנו בעצם רוצים ליצור לחצן עגול. אז אנחנו רוצים קודם כל ליצור איזושהי צורה עגולה. בואו נקרא לקובץ הזה שייפ סירקולר באטן.
שייפ כי אנחנו בונים צורה וסירקולר באטן כי אנחנו רוצים שהצורה הזאת תהיה עבור לחצן עגול. עכשיו חשוב לומר עוד פעם שכל השמות של הקבצים שנמצאים בתוך דקיית הרס חייבים להיות אך ורק באותיות קטנות וקו תחתון ומותר גם ספרות.
אסור שיהיה אות גדולה לדוגמה, אי אפשר שיהיו כל מיני סימנים מיוחדים כמו פלוס וכדומה, רק אותיות קטנות, קו תחתון וספרות. זה בעצם מקור לבאג שמגדירים פתאום קובץ עם אות גדולה כי חושבים שאות גדולה זה בסדר, אנדרואיד לא מתמודד עם זה כמו שצריך.
אז בואו נצרף את הקובץ, במקום התגית סלקטור אנחנו מגדירים תגית שייפ, והדבר הראשון שאנחנו מגדירים בתוך שייפ זה מהי הצורה עצמה.
אז בואו ניקח צורה ראשונה כסרקל, סרקל זה בעצם אובל, צורה אובלית זה סוג של סרקל או אליפסה. עכשיו אנחנו צריכים להגדיר איזשהו צבע לצורה, אנחנו דרך אגב יכולים לראות פה בפריוויו איך הצורה הולכת להיראות, אז בואו נגדיר איזשהו צבע ויש לנו כל מיני אפשרויות, נתחיל עם סוליד,
זה אומר צבע אחיד לכל הצורה. ניתן לה קולור, ניגש ונבחר קודם כל צבע שחור ואז אנחנו יכולים סקאן ולבחור פה איזשהו צבע שאנחנו רוצים עבור הצורה.
הנה בחרנו סוג של אדום כזה. לאחר מכן אנחנו יכולים להגדיר לדוגמה סטרוק, סטרוק זה הקו שעוטף את הצורה. בואו נגדיר גם לו color, הפעם נגדיר לבן וויד, נגדיר לו שני dp.
ובעצם מה שהגדרנו כרגע זה צורה עגולה בצבע אדום עם קו עוטף לבן. עכשיו אנחנו רוצים להשתמש עם הצורה הזאת. אז אנחנו יכולים לגשת ולייצר פה בטון. נגדיר אותו בגודל 200 dp על 70 dp.
ניתן לו מרג'ין, בואו נגדיר כ-10 dp. נגדיר איזשהו טקסט, איזה בטון. נגדיר טקסט סייז 20 sp ובקראונד. עכשיו אנחנו מוצאים לגשת לדרואובל, ויש לנו שם את השם של הקובץ, אנחנו יכולים לראות אותו כאן, הוא נקרא שייפ, איך שאני מתחיל לכתוב כבר אנחנו רואים שהוא מוצא לנו את הקובץ הזה,
בלי לסיום את נקודה xml, והנה אנחנו רואים שכבר יש לנו את הלחצן. בואו נסדר פה טיפה, נריץ את זה, ואנחנו רואים שיש לנו לחצן עגול, אנחנו יכולים ללחוץ עליו והוא כמובן יכול לבצע אירוע on-click.
בואו נבנה קובץ שייפ נוסף, אבל הפעם נראה משהו אחר. הפעם נבנה קובץ שנקרא Shape Rectangular Button. אנחנו רוצים לבנות איזושהי צורה עבור לחצן מלבני רגיל, אבל הפעם נגדיר את הדבר הבא:
יש לנו פה Shape, ניגש ונגדיר שאנחנו רוצים Rectangle, והצבע שאנחנו רוצים הוא Gradient, וזה משהו ממש ממש מגניב שאנחנו יכולים להגדיר.
Gradient זה בעצם דירוג של צבעים. אנחנו יכולים להגדיר מה יהיה ה-start color בואו נגדיר סתם איזה שהוא צבע מסוים סוג של אפור כהה כזה ואנחנו יכולים להגדיר מה יהיה ה-end color בואו כרגע נגדיר שחור וניכנס ונבחר סוג של כחול ואנחנו יכולים להגדיר גם זווית לומר איך בדיוק הדירוג הולך כאשר הקפיצות צריכות להיות ב-45 מעלות אנחנו לא יכולים להגדיר זווית של לדוגמה 50.
זה 45 זה 90 וכדומה והנה יש לנו כאן דירוג אנחנו רואים כאן סוג של שחור כזה שהולך בזווית של 45 מעלות עד סוג של כחול בואו נגדיר גם את הסטרוק שראינו שזה הקו העוטף נגדיר אותו כלבן רוחב שני dp ובואו ניתן עוד הגדרה מעניינת והיא קורנרס קורנרס מאפשר להגדיר הפינות של המלבן זה מתבצע על ידי רדיוס בוא נגדיר שזה 20 dp והנה
אנחנו רואים שיש לנו קצת פינות עגולות כאלה למלבן אחרי שהגדרנו את הצורה המלבנית הזאת אנחנו יכולים לגשת לשכפל את הלחצן הזה ללחצן נוסף ולהגדיר שהפעם אנחנו רוצים את הריקטנגיולר באטן בואו נרפרש והנה יש לנו לחצן מלבני אבל הפעם הלחצן הזה מוגדר על ידי גרדיאנט בואו נבדוק את זה והנה יש לנו סוג של גרדיאנט שמגיע מקצת שחור
עד סוג של כחול וגם זה לחצן. עכשיו כאשר אנחנו לוחצים על הלחצנים האלה אז היוזר לא באמת רואה בצורה ממש נוחה שהייתה פה לחיצה בגלל שדרסנו את החזות הדיפולטית של הלחצנים והגדרנו צורה משלנו אבל יש משהו מגניב באנדרואיד שנקרא ריפל ריפל זה גל קטן בעברית זה נקרא אדווה וזה פשוט מאוד מעין גל כזה שאם לוחצים עליו על הלחצן אז בעצם אפשר לראות שהתבצעה לחיצה.
זאת אומרת אם אני אקח איזשהו לחצן רגיל אני אוריד ממנו את ההגדרה של ה-Background יש לנו פה לחצן רגיל לגמרי בואו רגע נריץ את זה אנחנו יכולים לראות שברגע שאנחנו לוחצים עליו אז פתאום מופיע מעין אפקט כזה של עיגול שמתחיל בנקודה עצמה של הלחיצה.
ואז זה מאפשר ליוזר לראות שבעצם היה איזשהו קליק מסוים על ידי הגל הזה שמתחיל להיות בנקודה של הלחיצה ומתרחב כאילו שזה מעין גל קטן כזה.
כאילו שזורקים למים אבן ויש גלים מסביבה. אז אנחנו יכולים להגדיר בדיוק את אותו הדבר בצורה שאנחנו בונים. איך זה מתבצע? בואו נשכפל כאן איזשהו קובץ, ניקח לדוגמה, נוסיף בעצם קובץ אחד חדש,