สวัสดีครับเพื่อนๆวันนี้เราจะมาสอนทุกคนทำ กินไรดี Application กันครับเป็นแอพพลิเคชั่นที่มีการใช้ Gesture ต่างๆ ไม่ว่าจะเป็นการ Shake , Zoom in และ Zoom out
โดยแอพพลิเคชั่นของเรามีหลักการทำงาน คือ เขย่าแอพพลิเคชั่นเพื่อ Random เมนูอาหารต่างๆ และเมื่อได้อาหารที่Randomมาแล้วจะแสดงรูปภาพและชื่อของอาหารซึ่งรูปภาพอาหารสามารถซูมเข้าซูมออกได้
ก่อนอื่นเรามา Create new project ขึ้นมาเลยครับ
 |
| Create New Project |
 |
| ตั้งชื่อ Project ให้เรียบร้อย |
จากนั้นเปิด Main.storyboard แล้วทำการลาก Scroll View ลงบน View และจัด Layout ให้สวยงามตามที่เราต้องการ
ขั้นตอนถัดมา นำ UIImageView มาใส่ใน Scroll View และจัด Layout ให้สวยงามตามที่เราต้องการ
หลังจากที่เราวาง UIImageView แล้วปรับ Content Mode เป็น Aspect Fit
อย่าลืม!!! ทำการ delegate ระหว่าง Scroll View กับ ViewController ด้วยนะครับ
เมื่อเราทำส่วนของรูปภาพเสร็จแล้ว ต่อไปเราจะนำ Label มาวางเพื่อบอกชื่ออาหาร
ทำการกดลูกศรสีแดงๆ และ Add Missing Constraints ให้หมดครับ
Project ของเรายังขาดรูปภาพ เอารูปภาพมาใส่ให้ Project กันหน่อยดีกว่า
 |
| อย่าลืมเลือก Copy items if needed ด้วยนะครับ |
พอเราวางส่วนประกอบสำคัญต่างๆเสร็จเรียบร้อยแล้ว ต่อไปเราก็ไปเขียน Code กันครับ
แต่ก่อนที่จะเขียน Code อย่าลืมประกาศ Outlet ต่างๆกันก่อนนะครับ
 |
| ประกาศ outlet ให้กับ ScrollView |
 |
| ประกาศ outlet ให้กับ ImageView |
 |
| ประกาศ outlet ให้กับ Label |
Code ในส่วนของ ViewController
แค่นี้ Application ของเราก็จะสามารถทำงานได้แล้ว นอกนั้นเราก็ตกแต่ง App ของเราตามความชอบได้เลยครับ
 |
| Zoom In Gesture |
 |
| Zoom Out Gesture |
หากเพื่อนๆยังไม่เข้าใจสามารถดูวีดีโอการสอนได้ที่นี่ครับ
Comments
Post a Comment