จอภาพ (Screen) | เน้นให้เรียนรู้ด้วยการปฏิบัติ หรือ สอนผ่านการลงมือทำ |
 |
คำอธิบายจอภาพที่ 1
- แนะนำโปรแกรมชื่อ Sharpdevelop ไปค้นใน google แล้ว download
- ในที่นี้มีรุ่น 5 ซึ่งใช้ได้บน win8 ถ้าเป็น win7 ก็ให้ใช้รุ่น 3.2
- เมื่อได้มาแล้วก็ติดตั้งให้เรียบร้อย
|
 |
คำอธิบายจอภาพที่ 2
- หลังติดตั้งก็เปิดโปรแกรม เลือก New solution
- แล้วเลือก C# และ Windows Application
- ในช่อง Name และ Location ระบุชื่อโปรแกรม และห้องที่จะจัดเก็บแฟ้มผลงาน
|
 |
คำอธิบายจอภาพที่ 3
- ในกล่อง Project คลิ๊กที่ MainForm.cs
- เลือก Design แทน Source จะได้ใช้เทคนิคลากวางได้
|
 |
คำอธิบายจอภาพที่ 4
- ด้านซ้ายจะมี Tools ที่ใช้สำหรับออกแบบ Form
- คลิ๊กที่ Button ค้างไว้ แล้วลากมาวางไว้ใน Form
- คลิ๊กที่ TextBox ค้างไว้ แล้วลากมาวางไว้ใน Form
- Properties ของ TextBox สามารถเปลี่ยนขนาดตัวอักษรได้
|
 |
คำอธิบายจอภาพที่ 5
- ลาก Button และ TextBox มาไว้บน Form ดังภาพ
- ภาพที่เห็นจะมีปุ่มต่าง ๆ เตรียมไว้ทำเครื่องคิดเลขอย่างง่าย
|
 |
คำอธิบายจอภาพที่ 6
- เปลี่ยนข้อความบนปุ่มให้เป็นตัวเลข 0 - 9
- และมีเครื่องหมายทางคณิตศาสตร์ บวก ลบ คูณ หาร
- ปรับขนาดให้ได้สัดส่วนสวยงาม
|
 |
คำอธิบายจอภาพที่ 7
- คลิ๊ปไปที่ปุ่ม จะเข้าส่วน Source ของ MainForm.cs
- คลิ๊ปที่ปุ่มเลข 7 ก็จะใส่เหตุการณ์ หรือรายละเอียด Method ของปุ่ม เช่น
void Button4Click(object sender, EventArgs e)
{
textBox1.Text = textBox1.Text + "7"
}
- ถ้าใส่เหตุการณ์ในปุ่มแล้ว เมื่อกดปุ่ม Run กดเลขใด ก็จะไปแสดงใน TextBox
- ถึงตรงนี้ให้ระวังเรื่องอักษรพิมพ์ใหญ่ หรือพิมพ์เล็ก มีความหมาย และทำให้โปรแกรมผิดได้
|
 |
คำอธิบายจอภาพที่ 8
- ใต้ MainForm ประกาศตัวแปร firstnumber, secondnumber, result, sign และ display
- ใส่เหตุการณ์ในปุ่มบวก มีเหตุการณ์ให้กระทำ 3 เหตุการณ์
firstnumber = System.Convert.ToInt32(textBox1.Text);
sign = '+';
textBox1.Text = "";
|
 |
คำอธิบายจอภาพที่ 9
- ใส่เหตุการณ์ในปุ่มเท่ากับ ตัวอย่างนี้รองรับเฉพาะการบวก มี 7 เหตุการณ์
secondnumber = System.Convert.ToInt32(textBox1.Text);
textBox1.Text = "";
if(sign == '+') {
result = firstnumber + secondnumber;
}
display = System.Convert.ToString(result);
textBox1.Text=display;
- กดปุ่ม run แล้วลองทดสอบพิมพ์ 7+8=9+7 ผลที่ได้จะเป็น 166
|
 |
คำอธิบายจอภาพที่ 10
- ถ้าทดสอบ และ Save ทั้งหมด จะมีแฟ้มอยู่ในห้องที่กำหนดไว้แต่แรก
- ห้อง mycal/bin/Debug มีแฟ้ม mycal.exe ที่นำไปใช้งานได้เลย
- ห้อง mycal ก็จะมี 3 folder และอีก 7 แฟ้ม
- แฟ้ม mycal.sln คือแฟ้ม solution ที่ใช้เปิดแฟ้มทั้งหมด หากต้องการแก้ไขงานในภายหลัง
|
 |
คำอธิบายจอภาพที่ 11
- เปิดโปรแกรม Sharpdevelop ขึ้นมาใหม่
- เลือก Open solution แล้วไปเปิด folder ที่เคยเก็บงานไว้
- จะพบแฟ้ม mycal.sln ให้เลือกแฟ้มนี้ เพื่อเปิดงานเดิมมาแก้ไข
|
 |
คำอธิบายจอภาพที่ 12
- ถ้าหากคัดลอกห้อง mycal ไปไว้เครื่องอื่นก็สามารถทำได้
- เมื่อใช้ Open solution เปิด mycal.sln ก็จะแก้ไขและสั่ง run ได้เหมือนครั้งที่เริ่มต้นเขียน
|