1. शुरू करने से पहले
कोडिंग शुरू करने से पहले, आपको कुछ ज़रूरी शर्तें पूरी करनी होंगी.
Xcode
इस ट्यूटोरियल में, Apple के Xcode टूल के साथ-साथ Objective-C भाषा का इस्तेमाल करके, एक सामान्य iOS ऐप्लिकेशन बनाया गया है. यह ऐप्लिकेशन, एम्युलेटर में चलता है. इसके लिए, आपको किसी डिवाइस की ज़रूरत नहीं है. Xcode को https://developer.apple.com/xcode/ से डाउनलोड किया जा सकता है
CocoaPods
Places SDK for iOS, CocoaPods पॉड के तौर पर उपलब्ध है. CocoaPods, Swift और Objective-C प्रोजेक्ट के लिए, ओपन सोर्स डिपेंडेंसी मैनेजमेंट टूल है. अगर आपके पास यह टूल पहले से नहीं है, तो आपको आगे बढ़ने से पहले इसे इंस्टॉल करना होगा. इसे टर्मिनल से इस तरह इंस्टॉल किया जा सकता है:
sudo gem install cocoapods
CocoaPods के बारे में ज़्यादा जानकारी के लिए, CocoaPods की शुरुआती गाइड देखें.
एसडीके इंस्टॉल करना
एसडीके इंस्टॉल करने के लिए, आपको अपनी प्रोजेक्ट डायरेक्ट्री में एक Podfile बनाना होगा. CocoaPods इसका इस्तेमाल, ज़रूरी डिपेंडेंसी को डाउनलोड और कॉन्फ़िगर करने के लिए करेगा. ऐसा करने का सबसे आसान तरीका यह है कि Xcode में एक नया प्रोजेक्ट बनाया जाए. इसके बाद, उसमें एक Podfile जोड़ा जाए और पॉड इंस्टॉल किए जाएं.
Xcode खोलें. आपको ‘Welcome to Xcode' स्क्रीन दिखेगी. यहां, ‘Create a new Xcode project' को चुनें
अगली स्क्रीन पर, आपसे नए प्रोजेक्ट के लिए टेंप्लेट चुनने के लिए कहा जाएगा. iOS के लिए, ‘सिंगल व्यू ऐप्लिकेशन' चुनें और ‘आगे बढ़ें' पर क्लिक करें
प्रॉडक्ट का नाम पूछे जाने पर, अपनी पसंद का कोई भी नाम चुना जा सकता है. हालांकि, यह पक्का करें कि आपने बंडल आइडेंटिफ़ायर नोट कर लिया हो, जो आपके लिए जनरेट किया गया है. आपको इसकी बाद में ज़रूरत होगी.
'आगे बढ़ें' दबाएं. इसके बाद, आपके लिए प्रोजेक्ट बना दिया जाएगा. उस डायरेक्ट्री का नोट बनाएं जहां इसे बनाया गया है. Xcode बंद करें और टर्मिनल का इस्तेमाल करके, उस डायरेक्ट्री पर जाएं.
टर्मिनल का इस्तेमाल करके, यह कमांड डालें:
pod init
आपके लिए Podfile नाम की एक फ़ाइल बनाई जाएगी. इसमें बदलाव करके, GoogleMaps के लिए पॉड जोड़ें. जैसे:
target '{YOUR APP NAME}' do
pod 'GoogleMaps'
end
इसे सेव करें और Xcode बंद करें. इसे बंद करना न भूलें, क्योंकि अगले चरण में आपको इस प्रोजेक्ट में बदलाव करना है. इसके बाद, आपको कोई दूसरी प्रोजेक्ट फ़ाइल खोलनी होगी. अगर डेवलपर ने Xcode को पहले बंद नहीं किया है, तो उसे यह समझने में मुश्किल हो सकती है कि सब कुछ कहां है! अब टर्मिनल में, अपनी प्रोजेक्ट डायरेक्ट्री पर जाएं और इस तरह ‘pod install' चलाएं:
जब यह प्रोसेस पूरी हो जाएगी, तब पॉड इंस्टॉल हो जाएंगे और एक नई .xcworkspace फ़ाइल बन जाएगी. अब से इस प्रोजेक्ट के लिए इसका इस्तेमाल करें. हालांकि, कोडिंग से पहले आपको एपीआई पासकोड की ज़रूरत होगी.
2. एपीआई पासकोड पाना
इसके बाद, iOS के लिए Maps SDK चालू करें.
Google Maps Platform सेट अप करना
अगर आपके पास Google Cloud Platform खाता और बिलिंग की सुविधा वाला प्रोजेक्ट नहीं है, तो बिलिंग की सुविधा वाला खाता और प्रोजेक्ट बनाएं. ऐसा करने का तरीका जानने के लिए, कृपया Google Maps Platform का इस्तेमाल शुरू करना देखें.
- Cloud Console में, प्रोजेक्ट वाले ड्रॉप-डाउन मेन्यू पर क्लिक करें. इसके बाद, उस प्रोजेक्ट को चुनें जिसे इस कोडलैब के लिए इस्तेमाल करना है.
- इस कोडलैब के लिए ज़रूरी Google Maps Platform API और एसडीके को Google Cloud Marketplace में जाकर चालू करें. ऐसा करने के लिए, इस वीडियो या दस्तावेज़ में बताया गया तरीका अपनाएं.
- Cloud Console के क्रेडेंशियल पेज पर जाकर, एक एपीआई पासकोड जनरेट करें. ऐसा करने के लिए, इस वीडियो या दस्तावेज़ में बताया गया तरीका अपनाएं. Google Maps Platform का इस्तेमाल करने के लिए, एपीआई पासकोड ज़रूरी है.
3. Places API ऐप्लिकेशन बनाना
अब आपने कंसोल प्रोजेक्ट बना लिया है और उस पर Places API चालू कर दिया है. साथ ही, एपीआई पासकोड भी मिल गया है. अब Places API का इस्तेमाल करके अपना पहला ऐप्लिकेशन कोड करने के लिए तैयार हैं.
पहले पॉड फ़ाइलें इंस्टॉल करने पर, आपके लिए एक नई .xcworkspace फ़ाइल बनाई जाती थी. इस पर दो बार क्लिक करके इसे खोलें.
आपको अपने प्रोजेक्ट एक्सप्लोरर में, ‘Pods' नाम का एक नया फ़ोल्डर दिखेगा. अगर यह प्रोसेस सही तरीके से पूरी हो गई है, तो आपको वहां GoogleMaps फ़ोल्डर दिखेगा. इसमें फ़्रेमवर्क शामिल होंगे.
4. Info.plist फ़ाइल में बदलाव करें.
पहली बार ऐप्लिकेशन चलाने पर, iOS आपको एक डायलॉग दिखाएगा. इसमें उपयोगकर्ता से, जगह की जानकारी की सेवाओं को ऐक्सेस करने की अनुमति देने के लिए कहा जाएगा. इस डायलॉग बॉक्स में, आपको एक स्ट्रिंग मिलेगी. इसे आपको Info.plist फ़ाइल में डालना होगा. अगर यह स्ट्रिंग मौजूद नहीं है, तो डायलॉग नहीं दिखेगा और आपका ऐप्लिकेशन काम नहीं करेगा.
आपको प्रोजेक्ट एक्सप्लोरर में Info.plist फ़ाइल यहां मिलेगी:
इसे चुनें. इसके बाद, आपको plist एडिटर दिखेगा.
किसी भी एलिमेंट पर कर्सर घुमाएं. इसके बाद, आपको ‘+' आइकॉन दिखेगा. इसे दबाएं. इसके बाद, आपको एक नई एंट्री दिखेगी. इस बॉक्स में ‘NSLocationAlwaysUsageDescription' वैल्यू डालें.
नई कुंजी जोड़ने के लिए, Enter दबाएं. इसके बाद, इस कुंजी के लिए वैल्यू कॉलम पर दो बार क्लिक करें और एक स्ट्रिंग जोड़ें:
इस स्ट्रिंग के बारे में ज़्यादा जानने के लिए, Apple डेवलपर का दस्तावेज़ यहां देखें.
5. अपने ऐप्लिकेशन डेलिगेट में बदलाव करना
प्रोजेक्ट एक्सप्लोरर में, AppDelegate.m ढूंढें और खोलें. इसका इस्तेमाल, एपीआई पासकोड जोड़ने के लिए किया जाएगा.
फ़ाइल में सबसे ऊपर, #import लाइन के ठीक नीचे यह कोड जोड़ें:
@import GoogleMaps;
इसके बाद, didFinishLaunchingWithOptions: फ़ंक्शन में, ‘return YES' लाइन के ठीक ऊपर यह कोड जोड़ें:
[GMSServices provideAPIKey:@"<Add your API Key>"];
उस एपीआई पासकोड का इस्तेमाल करें जिसे आपने पहले जनरेट किया था.
6. स्टोरीबोर्ड फ़ाइल में बदलाव करना
प्रोजेक्ट एक्सप्लोरर में, Main.storyboard फ़ाइल खोलें. पक्का करें कि सबसे ऊपर दाएं कोने में मौजूद साइडबार बटन दबाकर, साइडबार चालू हो.
इसके बाद, साइडबार में सबसे नीचे, लेबल कंट्रोल ढूंढें. इसके लिए, पक्का करें कि ऑब्जेक्ट लाइब्रेरी चुनी गई हो.
बाईं ओर मौजूद व्यू कंट्रोलर सीन में, पक्का करें कि ‘व्यू' चुना गया हो:
इसके बाद, सात लेबल को व्यू में खींचें और छोड़ें. उन्हें यहां दिखाए गए तरीके से व्यवस्थित करें. उनके साइज़ को खींचकर, दिखाए गए साइज़ से मैच करें. लेबल में मौजूद टेक्स्ट में बदलाव करने के लिए, उस पर दो बार क्लिक करें और ज़रूरी वैल्यू टाइप करें:
सबसे नीचे वाले लेबल (सबसे बड़ा लेबल) के लिए, प्रॉपर्टी एडिटर पर जाएं और पक्का करें कि इसे 0 लाइनों पर सेट किया गया हो (यह डिफ़ॉल्ट रूप से 1 पर सेट होता है). इससे कई लाइनें रेंडर की जा सकेंगी.
7. वैल्यू के लिए आउटलेट बनाना
'वैल्यू' लेबल वाले तीन प्रॉडक्ट के लिए, आपको एक आउटलेट बनाना होगा. इससे आपको कोड का इस्तेमाल करके, उनकी वैल्यू बदलने की अनुमति मिलेगी. इसके लिए, आपको पहले असिस्टेंट एडिटर की सुविधा चालू करनी होगी. इसके लिए, सबसे पहले प्रॉपर्टी के साइडबार को बंद करें. इसके लिए, उसे हटाने वाले बटन पर क्लिक करें. (यह बटन पिछले चरण में दिखाया गया था)
इसके बाद, Assistant बटन चुनें. यह डबल सर्कल वाला बटन है, जो यहाँ दिखाया गया है:
पक्का करें कि यह ViewController.h फ़ाइल को रेंडर कर रहा हो. अगर ऐसा नहीं है, तो असिस्टेंट विंडो में सबसे ऊपर मौजूद एडिटर का इस्तेमाल करके, इसे बदला जा सकता है:
इसके बाद, CONTROL कुंजी को दबाकर रखें. अब हर लेबल को खींचकर, सहायक में ViewController.h फ़ाइल में @interface लाइन के नीचे छोड़ें. एक डायलॉग बॉक्स खुलेगा. इसमें आपसे पूछा जाएगा कि आपको किस तरह का कनेक्शन बनाना है:
पक्का करें कि सेटिंग इस तरह से दिख रही हों (Connection: Outlet; Type: UILabel; Storage: Weak). इसके बाद, हर सेटिंग को कोई नाम दें. इस कोडलैब के लिए, मैंने देशांतर, अक्षांश, और ऊंचाई के लेबल को क्रमशः lblLongitude, lblLatitude, और lblAltidude नाम दिया है. इसके अलावा, बड़े लेबल को नीचे से ऊपर की ओर खींचें और उसे lblPlaces नाम दें.
बदलाव करने के बाद, आपकी ViewController.h फ़ाइल कुछ ऐसी दिखनी चाहिए:
#import <UIKit/UIKit.h>
@import GoogleMaps;
@interface ViewController : UIViewController
@property (weak, nonatomic) IBOutlet UILabel *lblLatitude;
@property (weak, nonatomic) IBOutlet UILabel *lblLongitude;
@property (weak, nonatomic) IBOutlet UILabel *lblAltitude;
@property (weak, nonatomic) IBOutlet UILabel *lblPlaces;
@end
8. जगह की जानकारी और Google Client API के लिए हेडर फ़ाइल में बदलाव करना
फ़ाइनल चरणों से पहले, आपको हेडर फ़ाइल (ViewController.h) में कुछ और वैरिएबल सेट अप करने होंगे. इन चरणों में, आपको Places API का इस्तेमाल करने के लिए ऐप्लिकेशन बनाना होता है. ये मुख्य लोकेशन मैनेजर और मुख्य लोकेशन ऑब्जेक्ट हैं:
@property (strong, nonatomic) CLLocationManager *locationManager;
@property (strong, nonatomic) CLLocation *location;
आपको Google API क्लाइंट की भी ज़रूरत होगी:
@property GMSPlacesClient *placesClient;
आखिर में, आपको हेडर फ़ाइल अपडेट करनी होगी, ताकि क्लास CLLocationManagerDelegate को लागू कर सके:
@interface ViewController : UIViewController<CLLocationManagerDelegate>
सेट अप पूरा करने के बाद, आपकी हेडर फ़ाइल कुछ ऐसी दिखेगी:
#import <UIKit/UIKit.h>
#import <CoreLocation/CoreLocation.h>
#import <GoogleMaps/GoogleMaps.h>
@interface ViewController : UIViewController<CLLocationManagerDelegate>
@property (strong, nonatomic) CLLocationManager *locationManager;
@property (strong, nonatomic) CLLocation *location;
@property (weak, nonatomic) IBOutlet UILabel *lblLongitude;
@property (weak, nonatomic) IBOutlet UILabel *lblLatitude;
@property (weak, nonatomic) IBOutlet UILabel *lblAltitude;
@property (weak, nonatomic) IBOutlet UILabel *lblPlaces;
@property GMSPlacesClient *placesClient;
@end
9. अपने व्यू कंट्रोलर में बदलाव करना
पहला चरण, viewDidLoad फ़ंक्शन में बदलाव करना है. इससे लोकेशन मैनेजर को शुरू किया जा सकेगा. साथ ही, उपयोगकर्ता से जगह की जानकारी को ऐक्सेस करने की अनुमति का अनुरोध किया जा सकेगा. इसके बाद, लोकेशन मैनेजर को शुरू किया जा सकेगा, ताकि वह मौजूदा जगह की जानकारी को ट्रैक कर सके. साथ ही, Google Places API क्लाइंट को भी शुरू किया जाएगा.
- (void)viewDidLoad {
[super viewDidLoad];
self.locationManager = [[CLLocationManager alloc]init];
self.locationManager.desiredAccuracy = kCLLocationAccuracyBest;
if([self.locationManager respondsToSelector:@selector(requestAlwaysAuthorization)]) {
[self.locationManager requestAlwaysAuthorization];
// Or [self.locationManager requestWhenInUseAuthorization];
}
[self.locationManager startUpdatingLocation];
self.locationManager.delegate = self;
self.location = [[CLLocation alloc] init];
self.placesClient = [GMSPlacesClient sharedClient];
}
10. जगह की जानकारी के अपडेट मैनेज करना
जगह की जानकारी को मैनेज करने वाला व्यक्ति, didUpdateLocations फ़ंक्शन को कॉल करके, जगह की जानकारी से जुड़े अपडेट के साथ आपके व्यू कंट्रोलर को वापस कॉल करेगा. आपको इसे ViewController.m में जोड़ना होगा. यह फ़ंक्शन ऐसा दिखता है:
-(void)locationManager:(CLLocationManager *)manager didUpdateLocations:(NSArray<CLLocation *> *)locations{
// Enter code here
}
इस फ़ंक्शन को कई काम करने होंगे.
सबसे पहले, यह जगह की जानकारी को पिछली बार मिली जानकारी के साथ कैश मेमोरी में सेव करेगा:
self.location = locations.lastObject;
इसके बाद, अक्षांश, देशांतर, और ऊंचाई के लिए तीन लेबल अपडेट किए जाने चाहिए:
self.lblLatitude.text = [NSString stringWithFormat:@"%f", self.location.coordinate.latitude];
self.lblLongitude.text = [NSString stringWithFormat:@"%f", self.location.coordinate.longitude];
self.lblAltitude.text = [NSString stringWithFormat:@"%f", self.location.altitude];
इसके बाद, Places API को कॉल करने के लिए, Places Client का इस्तेमाल करें. इसके लिए, कॉलबैक फ़ंक्शन तय करें. इससे आपको जगह की संभावितताओं की सूची मिलेगी. Places API, आपकी जगह की जानकारी के आधार पर यह तय करता है कि आपके किसी जगह पर होने की कितनी संभावना है. यह फ़ंक्शन, उन जगहों के नाम दिखाता है जहां आपके होने की संभावना है. साथ ही, 0 से 1 के बीच की वैल्यू दिखाता है, जिससे यह पता चलता है कि आपके उस जगह पर होने की कितनी संभावना है.
[self.placesClient currentPlaceWithCallback:^(GMSPlaceLikelihoodList *likelihoodList, NSError *error) {
इसके बाद, कॉलबैक लागू किया जा सकता है. यह संभावनाओं की सूची में शामिल होगा. साथ ही, उन जगहों और उनकी संभावनाओं को जोड़ेगा.
[self.placesClient currentPlaceWithCallback:^(GMSPlaceLikelihoodList *likelihoodList, NSError *error) {
if (error != nil) {
NSLog(@"Current Place error %@", [error localizedDescription]);
return;
}
NSMutableString *strPlaces = [NSMutableString stringWithString:@""];
for (GMSPlaceLikelihood *likelihood in likelihoodList.likelihoods) {
GMSPlace* place = likelihood.place;
NSLog(@"Current Place name %@ at likelihood %g", place.name,
likelihood.likelihood);
NSLog(@"Current Place address %@", place.formattedAddress);
NSLog(@"Current Place attributions %@", place.attributions);
NSLog(@"Current PlaceID %@", place.placeID);
[strPlaces appendString:place.name];
[strPlaces appendString:@" "];
[strPlaces appendFormat:@"%g",likelihood.likelihood];
[strPlaces appendString:@"\n"];
}
self.lblPlaces.text = strPlaces;
}];
बदलाव करने के बाद, आपका didUpdateLocations फ़ंक्शन कुछ ऐसा दिखना चाहिए:
-(void)locationManager:(CLLocationManager *)manager didUpdateLocations:(NSArray<CLLocation *> *)locations{
self.location = locations.lastObject;
self.lblLatitude.text = [NSString stringWithFormat:@"%f", self.location.coordinate.latitude];
self.lblLongitude.text = [NSString stringWithFormat:@"%f", self.location.coordinate.longitude];
self.lblAltitude.text = [NSString stringWithFormat:@"%f", self.location.altitude];
NSLog(@"%@", self.location.description);
[self.placesClient currentPlaceWithCallback:^(GMSPlaceLikelihoodList *likelihoodList, NSError *error) {
if (error != nil) {
NSLog(@"Current Place error %@", [error localizedDescription]);
return;
}
NSMutableString *strPlaces = [NSMutableString stringWithString:@""];
for (GMSPlaceLikelihood *likelihood in likelihoodList.likelihoods)
{
GMSPlace* place = likelihood.place;
NSLog(@"Current Place name %@ at likelihood %g", place.name, likelihood.likelihood);
NSLog(@"Current Place address %@", place.formattedAddress);
NSLog(@"Current Place attributions %@", place.attributions);
NSLog(@"Current PlaceID %@", place.placeID);
[strPlaces appendString:place.name];
[strPlaces appendString:@" "];
[strPlaces appendFormat:@"%g",likelihood.likelihood];
[strPlaces appendString:@"\n"];
}
self.lblPlaces.text = strPlaces;
}];
}
अब आपका ऐप्लिकेशन चलने के लिए तैयार है. इसे टेस्ट किया जा सकता है!
11. एम्युलेटर में ऐप्लिकेशन चलाना
टाइटल बार में मौजूद 'चलाएं' बटन का इस्तेमाल करके, ऐप्लिकेशन को चलाया जाता है. इससे रन टाइप भी चुना जा सकता है. जैसा कि यहां देखा जा सकता है, मैं iPhone 6 पर एम्युलेटर का इस्तेमाल करके टेस्ट कर रहा हूं.
'चलाएं' बटन दबाने पर, ऐप्लिकेशन बन जाएगा और लॉन्च हो जाएगा. आपको ऐप्लिकेशन को जगह की जानकारी ऐक्सेस करने की अनुमति देने का अनुरोध दिखेगा. इसमें वह कस्टम स्ट्रिंग भी शामिल होगी जिसे आपने पहले तय किया था.
ऐसा करने के बाद, आपको अपने अक्षांश और देशांतर की जानकारी अपडेट होती हुई दिखेगी. जगह बदलने के लिए, Debug मेन्यू चुनें और कोई जगह चुनें. उदाहरण के लिए, ‘फ़्रीवे ड्राइव' को चुना जा सकता है
ऐसा करने पर, आपको जगह की जानकारी के साथ-साथ, आस-पास की जगहों की जानकारी अपडेट होती हुई दिखेगी. इससे आपको फ़्रीवे पर ड्राइव करने का अनुभव मिलेगा.
यह बहुत आसान है! आपने iOS पर Google Places API का इस्तेमाल करके, मौजूदा जगह की जानकारी को ऐक्सेस कर लिया है.