@DevMobile

มาทำ Add Detail , Add Photo แล้วลงไป

เดินเล่นสถานที่ต่าง ๆ กันเถอะ !!!

มาแสดงรายละเอียดของสถานที่ และ Layout ของ Google Map กัน

จากรูปมันจะทำให้ Google Map ของเพื่อน ๆ ดูมีอะไรมากขึ้น

มาเริ่มกันเลย !

อันดับแรกเลยนะครับ ทำการสร้าง Project ของเพื่อน ๆ มา 1 Project ครับ

หลังจากทำการสร้าง Project เสร็จ ต่อไป เปิด Ternimal ขึ้นมาเพื่อจะทำการ Pod file ของ Google map

ขั้นตอนการ Pod file

1. เปิด Ternimal เข้าไปโฟลเดอร์ ที่เก็บ Project ไว้ โดยใช้คำสั่ง CD แล้วตามด้วย LS

2. เมื่อเข้ามาในโฟลเดอร์ของ Project แล้ว ต่อไป ใช้ คำสั่ง $pod init เพื่อทำการสร้างไฟล์ pod

3.เมื่อทำการสร้างไฟล์ Pod แล้ว เปิดไฟล์ Pod ในโฟลเดอร์ Project ขึ้นมา แล้วใส่ คำสั่งตามรูป

4. มา ที่ Terminal แล้วพิมคำสั่ง $pod install ก็เรียบร้อย

เริ่มแรกเข้าไปที่ https://developers.google.com/ เพื่อทำการผูก Project ของเราเข้ากับ Google

เลือก iOS แล้ว กดปุ่ม Get key ทางมุมบนขวา

เลือก Create Project ตั้งชื่อ แล้วกด Create

เมื่อกด Create แล้ว ให้กดไป ที่คำว่า Api console

เลือก iOS app แล้วนำ Bundle ID จาก Project มาใส่ตามรูป แล้วกด Save

เมื่อ กด Save เสร็จ ให้มาที่หน้า Dashboard แล้วกด ปุ่ม Enable API

อะไรที่ต้อง Enable บ้างละ ?

Google Maps API

Google Places API

https://developers.google.com/places/ios-api/start

หลังจาก เสร็จเรียบร้อยแล้วให้ นำ โค้ดตามรูป ไปใส่ ใน Appdelegate

มาเริ่มเขียน Code กันเลย !

เริ่มแรกทำการ

import GoogleMaps

import GooglePlaces

และใน Class ของ ViewController ใส่คำสั่ง CLLocationManagerDelegate และ GMSMapViewDelegate เข้าไป

ประกาศตัวแปร locationmanger ตามรูป

ประกาศตัวแปร 2 ตัว คือ latitude และ longtitude เพื่อเก็บค่า ตำแหน่ง ไปโชว์ ที่Show StreetViewcontroller

ต่อมา ไปที่ Main.storyboard แล้วเรา UIView มาวาง และกำหนด Class เป็น GMSMapView

ส่วน function GooglemapShow เอาไว้ทำการ ระบุตำแหน่ง ตอนที่ แอพพลิเคชั่น ถูก รัน ขึ้นมาและเป็น
โชว์ข้อมูล หรือปุ่มต่าง ๆ ที่อยู่ใน Google Map

2 function นี้ มีหน้าที่ เก็บตำแหน่งปัจจุบันที่มีการใช้ งาน เท่านั้น เพื่อเก็บค่า latitude longitude ไปแสดงผล บนหน้าจอ

ต่อมาทำการ ใส่ Navigation ให้ Viewcontroller และทำการสร้าง Label , ImageView, Bar Item ขึ้นมาตามรูปและเชื่อม กับ Viewcontroller ให้เรียบร้อย

เชื่อม Bar Item แล้ว ใช้คำสั่งดังนี้

function didAutocomplete นี้ จะทำหน้าที่เก็บคำสั่งที่ผู้ใช้ กด ค้นหามาเก็บไว้ในตัวแปรเพื่อ นำไปแสดงผล บน GoogleView และทำการเปลี่ยน จุด Mark ใหม่ เป็นการ Update ข้อมูล

คำสั่งนี้จะทำหน้าที่แสดงผล ข้อมูลที่ไป โชว์ ที่ Imageview และ Label ที่เรากำหนดไว้

2 function นี้เป็นแค่ การเช็คเออเร่อ

2 function นี้ จะเป็นการเรียกรูปจาก Google Places ขึ้นมาโชว์ โดย function แรกจะ ทำการ Save รูปแรก จากสถานที่ ที่เราได้เลือกไว้ มาเก็บในตัวแปรแล้ว สั่งให้ function ที่ 2 แสดงผลออกทาง GoogleView