การเริ่มต้นใช้งาน Longdo Map Framework 4.x บน iOS

1. สร้าง Project ใหม่บนโปรแกรม XCode จากเมนูหรือหน้าแรก

   

2. เลือก iOS ที่แท็บด้านบนแล้วเลือก App กดปุ่ม Next

   

3. ตั้งชื่อ Product Name และเลือก Interface เป็น SwiftUI กดปุ่ม Next

   

4. บันทึกโปรเจกต์บนเครื่องคอมพิวเตอร์ในตำแหน่งที่ต้องการ

5. ทำการ Add Packages

   • ไปที่เมนู Files และเลือก Add Packages...

   

   • วางลิงก์ https://github.com/MetamediaTechnology/longdo-map-ios-framework ลงที่ด้านบนขวาของหน้าต่างที่แสดงขึ้นมา
   • Dependency Rules เลือก Up to Next Major Version
   • คลิกปุ่ม Add Package

   

   • คลิกปุ่ม Add Package ที่ Popup อีกครั้ง

   

6. กรณีมีหลาย Target ให้ทำการเลือก Framework เพิ่มเติมในแต่ละ Target (หากมี Framework ปรากฏอยู่แล้วสามารถข้ามขั้นตอนนี้ไป)

   • เลือกชื่อ Project ที่แท็บด้านซ้าย

   

   • ที่ด้านซ้ายของตรงกลาง เลือก TARGETS ที่จะเพิ่ม framework
   • ที่แท็บด้านบนเลือก General

   

   • คลิกปุ่มบวกด้านล่างในส่วนของ Frameworks, Libraries, and Embedded Content
   • เลือก LongdoMapFramework จากหน้าต่างที่แสดงขึ้นมา แล้วคลิกปุ่ม Add

   

7. เลือก ContentView ที่แท็บด้านซ้าย หรือไฟล์ view ที่ต้องการเพิ่มแผนที่

   

   • แก้ไขโค้ดให้มีลักษณะตามด้านล่าง และกำหนด apikey ในบรรทัด map.apiKey = ให้เป็นไปตามรหัสที่ลงทะเบียนไว้

   import SwiftUI
   import LongdoMapFramework
   
   struct ContentView: View {
       let map = LongdoMap()
       var body: some View {
           VStack {
               Map(map: map)
                   .ignoresSafeArea()
           }
       }
   }
   
   #Preview {
       ContentView()
   }
   
   struct Map: UIViewRepresentable {
       var map: LongdoMap
   
       func makeUIView(context: Context) -> LongdoMap {
           map.apiKey = "แทนที่ด้วย API Key ของคุณ"
           map.render()
           return map
       }
   
       func updateUIView(_ uiView: LongdoMap, context: Context) {
       
       }
   }

8. ลองเพิ่มปุ่มแสดงสภาพการจราจรบนแผนที่ โดยแก้ไขโค้ดส่วน struct ContentView ดังนี้ (สามารถข้ามข้อนี้ไปได้)

   struct ContentView: View {
       let map = LongdoMap()
       var body: some View {
           VStack {
               Map(map: map)
                   .ignoresSafeArea()
               Button("Show Traffic", action: showTraffic)
           }
       }
   
       func showTraffic() {
           let _ = map.call(method: "Layers.add", args: [map.ldstatic("Layers", with: "TRAFFIC")])
       }
   }

9. ทดสอบการใช้งานโดยเลือก device ที่ต้องการ ในที่นี้จะเลือก iPhone 16 ซึ่งเป็น simulator และกดปุ่ม run รูปสามเหลี่ยม

   

   • ตัวอย่าง application เมื่อ run สำเร็จ

   

   ดูตัวอย่างโปรแกรมที่เสร็จแล้ว