Your SlideShare is downloading. ×
ใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint pot
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

ใบความรู้ที่ 7 application paint pot

1,411

Published on

Application: PaintPot เป็นแอพลิเคชันที่สามารถวาดภาพด้วยสีต่างๆ ลงบนพื้นที่วางที่กำหนดไว้ได้ ดังรูป

Application: PaintPot เป็นแอพลิเคชันที่สามารถวาดภาพด้วยสีต่างๆ ลงบนพื้นที่วางที่กำหนดไว้ได้ ดังรูป

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,411
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
236
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. ครูณัฐพล บัวอุไร [www.nattapon.com] 1 การสร้างแอพลิเคชันด้วย MIT AppInventor ใบความรู้ที่ 7 เรื่อง Application PaintPot Application: PaintPot เป็นแอพลิเคชันที่สามารถวาดภาพด้วยสีต่างๆ ลงบนพื้นที่วางที่กาหนดไว้ ได้ ดังรูป 1. สร้างโปรเจ็คใหม่  คลิกปุ่ม New Project  ตั้งชื่อโปรแกรม PaintPot  กดปุ่ม OK 2. สร้างหน้าต่างโปรแกรม  เปลี่ยนชื่อ Screen1 เป็น PaintPot ด้วยการคลิกที่พื้นหลังโปรแกรม  ไปตั้งค่าในหน้าต่าง Properties หัวข้อ Title ดังรูป     
  • 2. ครูณัฐพล บัวอุไร [www.nattapon.com] 2 การสร้างแอพลิเคชันด้วย MIT AppInventor  ลากคอมโพเน้นท์ Button มาวางบนหน้าจอ 3 ปุ่ม แล้วปรับแต่งให้มีลักษณะดังรูป (เป็นปุ่ม สาหรับเลือกสีสาหรับวาดรูป)  เปลี่ยนชื่อคอมโพเน้นท์ในหน้าต่าง Components ดังรูป (เปลี่ยนชื่อเพื่อให้รู้ว่าปุ่มไหนคือสีอะไร)  เลือกคอมโพเน้นท์ในกลุ่ม Layout แล้วลากคอมโพเน้นท์ HorizontalArrangement มาวางบน หน้าจอ (เพื่อจัดรูปแบบปุ่มตามแนวนอน)  ลากปุ่มทั้ง 3 ปุ่มไปใส่ในคอมโพเน้นท์ HorizontalArrangement จะได้ผลลัพธ์ดังรูป  
  • 3. ครูณัฐพล บัวอุไร [www.nattapon.com] 3 การสร้างแอพลิเคชันด้วย MIT AppInventor  เลือกคอมโพเน้นท์ในกลุ่ม Drawing and Animation แล้วลากคอมโพเน้นท์ Canvas มาวางบน หน้าจอ  ปรับขนาดของ Canvas ให้ด้านกว้าง (Width) = Fill parent และด้านสูง (Height) = 300 pixels  ลากคอมโพเน้นท์ Button มาวางด้านล่าง Canvas แล้วเปลี่ยนชื่อเป็น Clear (เป็นปุ่มสาหรับ เคลียร์พื้นที่วาดรูปในกรณีที่ต้องการวาดใหม่) และเปลี่ยนชื่อปุ่มในหน้าต่างคอมโพเน้นเป็น ButtonWipe  
  • 4. ครูณัฐพล บัวอุไร [www.nattapon.com] 4 การสร้างแอพลิเคชันด้วย MIT AppInventor 3. การเขียนคาสั่งควบคุมโปรแกรม  คลิกปุ่ม Blocks เพื่อเข้าสู่หน้าต่างเขียนคาสั่งควบคุมโปรแกรม  ลากบล็อกคาสั่งต่างๆ มาใส่ในหน้าต่าง Viewer โดยให้มีบล็อกต่างๆ ดังนี้ บล็อคคาสั่งตั้งต่างปุ่มสีและปุ่มเคลียร์ บล็อกคาสั่งสาหรับวาดเส้นสีบนพื้นที่ Canvas
  • 5. ครูณัฐพล บัวอุไร [www.nattapon.com] 5 การสร้างแอพลิเคชันด้วย MIT AppInventor 4. ทดสอบ Application  คลิกเมนู Connect เลือก Emulator  รอจนกระทั่งโปรแกรมเปิดขึ้นมาสาเร็จ ดังรูป ซึ่งนักเรียนสามารถคลิกปุ่มสีและวาดรูปตาม ต้องการลงบนพื้นที่ Canvas ได้

×