Home / Developer  / Newbie  / Beginning  / เขียนแอพ iPhone ด้วย Swift การแสดงผลหน้าเว็บไซต์ด้วย UIWebView

เขียนแอพ iPhone ด้วย Swift การแสดงผลหน้าเว็บไซต์ด้วย UIWebView

วิธีการพัฒนาแอพพลิเคชันด้วยภาษา Swift บน iOS8 ด้วย XCode6 BETA กับการเรียกหน้าเว็บไซต์แบบ MobileWeb มาแสดงผลด้วย UIWebView โดยมีการเขียนแบ่งออกเป็น 2แบบครับ

ขอแนะนำให้ศึกษาบทความก่อนหน้านี่ก่อนเหมือนเดิมเพื่อความเข้าใจ

รอบนี้จะสร้าง Project ขึ้นมาใหม่ 2 แบบ การแสดงผลหน้าเว็บไซต์นั้น โดยใช้ UIWebView จับมาแสดงผลตามขนาดของ Widget และอีกวิธีคือการใช้ View นี่แหละเป็นการควบคุมขนาดของ WebView อีกทีให้แสดงผลพอดีหน้าจอ

แบบใช้ Widget ครับ ให้ New Project ขึ้นมาเป็น Single View Application

Screen Shot 2557-06-11 at 8.02.17 PM

ตั้งชื่อให้เรียบร้อย

Screen Shot 2557-06-27 at 2.54.24 PM

ตั้งชื่อครับ

ต่อจากนั้นให้ ลาก Object หรือ Widget ไปวางที่หน้า ViewController

เลือก WebView

เลือก WebView

วางซะ

วางซะ

คลิกที่ WebView Object กดปุ่ม Ctrl ค้างไว้แล้วลากไปที่ไฟล์ ViewController.swift เพื่อสร้าง IBOutlet ครับ

Screen Shot 2557-06-27 at 2.44.21 PM

ตั้งชื่อว่า SimpleWebView ครับ จะมีการสร้าง code ให้ทันที

ต่อจากนั้นให้ไปเปิดไฟล์ Viewcontroller.swift มาเพิ่ม code ต่อ

กด Run ดูการแสดงผลแอพพลิเคชันของเราครับ

Screen Shot 2557-06-27 at 2.53.52 PM

ต่อมาเป็นอีกแบบครับ ใช้ View เป็นการแสดงผล ให้สร้าง Single View Application ใหม่มาตัวนึงครับ

Screen Shot 2557-06-27 at 2.39.53 PM

ให้ลาก View เลยครับไปวางที่ ViewController.swift ประกาศ IBOutlet ใหม่เลย ตัวอย่างที่ผมตั้งคือ

เพิ่ม Import ส่วนของ Header ลงไปตามนี้ครับ

ต่อมาให้ประกาศตัวแปร SimpleWebView เป็น WKWebView ครับ

เพิ่ม Function ตอนโหลดหน้าแอพพลิเคชันครั้งแรกขึ้นมาคือ

และเพิ่มคำสั่งการโหลดหน้าเว็บ ใน ViewDidLoad() ตามนี้

ภาพรวมของ Code ทั้งหมดจะเป็นแบบนี้

ลอง Run ตัวแอพพลิเคชันของเราอีกครั้งครับ

Screen Shot 2557-06-27 at 2.58.38 PM

แสดงผลเหมือนกัน แต่ Fit Layout มากกว่า

หวังว่าคงจะช่วยได้นะครับ Swift ไม่ยากอย่างที่คิด  Source Code ไม่ต้องมีหรอก Copy ไปก็รันได้แล้ว 😀

 

 

 

 

 

 

Comments

daydevthailand@gmail.com

อาจารย์ประจำสาขาวิชาการออกแบบเชิงโต้ตอบ และการพัฒนาเกม วิทยาลัยครีเอทีฟดีไซน์ & เอ็นเตอร์เทนเมนต์เทคโนโลยี มหาวิทยาลัยธุรกิจบัณฑิตย์ ,ผู้ก่อตั้ง บริษัท Daydev Co., Ltd, (เดย์เดฟ จำกัด)

Review overview
NO COMMENTS

Sorry, the comment form is closed at this time.