תיכנות כפתורים בסביבת LiveCode - שיעור 3

בואו נתחיל לתכנת בסביבת LiveCode



צרו Stack חדש (זה פרויקט חדש, זוכרים?) ולחצו על Ctrl+N כדי ליצור עוד מסך, בנוסף למסך הראשון שנוצר אוטומטית. מסך נקרא ב-LiveCode "כרטיס", או Card באנגלית.

רגע של היסטוריה למעוניינים:
ה-Cards היו המסכים שנוצרו בתוכנת HyperCard כיוון שהיא היתה סביבה תיכנותית שאיפשרה בניית מסדי נתונים בקלות. כל רשומה בבסיס הנתונים הזה נקראה Card והתיכנות של השדות והכפתורים היה ברקע (קראו לו BackGround). כיום, נפטרו ב-LiveCode מהרקע, אבל הכרטיסים נשארו..

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

כדי להגיע למסך הפתיחה, לחצו על קיצור המקשים Ctrl+1 (שמביא תמיד לכרטיס הראשון).


עכשיו הוסיפו שדה ותנו לו שם פיקטיבי (משהו כמו "My 1st Software").

מתחת שימו Push button והגדילו אותו (באמצעות נקודות שינוי הגודל שבפינות).

לחצו על הכפתור וב-Inspector שנו את שמו ל-Enter.

בראש ה-Inspector שנו ל-Text Formatting והגדילו את הגופן ל-24, שחקו עם שם הגופן לאחד שיפה לכם.

תוכלו גם לבחור את Icons & Border ולהוסיף אייקון לכפתור.

הוסיפו למטה עוד שדה Label: והכניסו אליו (באמצעות Contents ב-Inspector) את הקרדיט שלכם "Made by Nadav Dafni".



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

הקליקו בכפתור הימני של העכבר על הכפתור ובחרו את "Edit Script". תוכלו לראות שבחלון התיכנות כבר מופיע הקוד:

on mouseUp

end mouseUp

אתם רואים שבכפתור מוגדר בדרך כלל, מה יקרה כשהמשתמש מקליק בעכבר ומשחרר את הכפתור שלו (זה נקרא mouseUp).

הכניסו בין פתיחת הקוד לסיומו את השורה Go Next:

on mouseUp

   Go Next

end mouseUp

מה שהגדרתם לכפתור לעשות הוא שבהקלקה עליו יש לעבור למסך הבא.



בואו ננסה את זה.. לחצו בלוח הכלים (Tools) על חץ ה-Run (זה החץ הלבן, השמאלי, שבראש לוח הכלים)

עכשיו, כשתלחצו על הכפתור, הוא יעביר אתכם למסך השני. עברו חזרה למצב תכנות (החץ עם + שקוראים לו Edit) ובמסך השני הזה הוסיפו שדה Label: וכתבו בו Here you are.

תוכלו גם להוסיף תמונה (יש אייקון ל-Image Area בלוח הכלים - גררו אותו ונסו להבין ב-Inspector איך להוסיף תמונה מהמחשב שלכם).

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

בהצלחה!

יסודות LiveCode - שיעור 2

כדי להתחיל את התכנית הראשונה שלנו, בואו נעשה את הצעדים הבאים:

1. מתפריט Object פתחו מסך חדש באמצעות הפקודה New Card (קיצור מקשים Ctrl+N).
2. לניווט בין המסכים אפשר לבחור מתפריט View או Ctrl+1 עד 4 (1 ראשון, 4 אחרון, 2 ו-3 לקודם והבא)
3. במצב Edit (מהפלטה של ה-Tools לבחור את החץ עם הצלב) גררו שדה Label:
4. תנו שם לאובייקט Title (ב-Inspector במצב של Basic Properties רשמו Title בשדה Name)
5. בחרו למעלה את Contents ורשמו בשדה התחתון, במקום Label: את הכותרת של היישום שאתם רוצים לתכנת.
6. לשיפור הגופן של הכותרת וכדי למרכז אותה, בחרו למעלה את לשונית Text Formatting ושנו.

יסודות LiveCode - שיעור 1

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

הצעדים הראשונים בלייבקוד יהיו ליצור פרויקט ראשון. פרויקט של לייבקוד נקרא Stack, מעין "חפיסה של מסכים". הדימוי של הייפרקארד היה ונשאר אוסף של מסכים או קלפים שניתן לעשות בהם דברים:

1. בתפריט File בחרו New MainStack.
2. בלוח הכלים (Tools Palette) בחרו את חץ העריכה (Edit Tool).
3. גררו כמה כפתורים למסך החדש שנוצר.
4. סמנו את כולם (באמצעות Shift תוכלו להוסיפם לבחירה)
5. באינספקטור ייפתח לכם חלון Align Objects (אפשר גם לבחור בתפריט Object את Align selected controls. בעזרתו ניתן ליישר את כולם, למשל לקו העליון (בחרו Top).
   
6. הקליקו בכפתור ימין של העכבר על כפתור כלשהו ובחרו את Property Inspector. הוא ייפתח.
7. נסו לשנות פרמטרים שונים ב-Property Inspector ושימו לב איך הם משפיעים על הכפתור שבחרתם. יש המון אפשרויות בלייבקוד. ככל שתחקרו אותן - תבינו עד כמה ניתן לעשות בה.