יישום IOS לשיתוף תמונות סמיכות: 6 שלבים

2024 מְחַבֵּר: John Day | [email protected]. שונה לאחרונה: 2024-01-30 09:16

במדריך זה ניצור אפליקציית iOS עם Swift המאפשרת לך לשתף תמונות עם כל מי בקרבת מקום, ללא צורך בהתאמת מכשירים.

אנו נשתמש ב- Chirp Connect לשליחת נתונים באמצעות צליל, ו- Firebase לאחסון התמונות בענן.

שליחת נתונים עם צליל יוצרת חוויה ייחודית שבה ניתן לשדר נתונים לכל אחד בטווח שמיעה.

שלב 1: התקנת דרישות

Xcode

התקן מחנות האפליקציות.

קקאו פודים

sudo gem התקן קוקוס

Chirp Connect iOS SDK

הירשם בכתובת admin.chirp.io

שלב 2: פרויקט התקנה

1. צור פרויקט Xcode.

2. היכנס ל- Firebase וצור פרויקט חדש.

אפשר את Firestore על ידי לחיצה על הקטע מסד נתונים ובחירה בענן Firestore. לחץ על פונקציות כדי לאפשר גם פונקציות ענן.

3. הפעל את הגדר את אפליקציית iOS שלך בדף סקירת הפרויקטים

תזדקק לזהות החבילה מהכרטיסייה כללי בהגדרות פרוייקט ה- Xcode שלך. לאחר יצירת קובץ ה- Podd, יהיה עליך להוסיף את התלות הבאות, לפני שתפעיל התקנת תרמיל.

# תרמילים לפרויקט

pod 'Firebase/Core' pod 'Firebase/Firestore' pod 'Firebase/Storage'

4. הורד את ה- Chirp Connect iOS SDK העדכני ביותר מאת admin.chirp.io/downloads

5. בצע את השלבים ב- developers.chirp.io כדי לשלב את Chirp Connect ב- Xcode.

עבור אל תחילת העבודה / iOS. לאחר מכן גלול מטה ופעל לפי הוראות ההתקנה של Swift. הדבר יכלול ייבוא המסגרת ויצירת כותרת גישור.

עכשיו ההתקנה הושלמה, אנחנו יכולים להתחיל לכתוב קוד! מומלץ לבדוק את בניית הפרויקט שלך בכל שלב בהתקנה.

שלב 3: כתוב קוד IOS

1. ייבא Firebase לתוך ViewController שלך והרחיב את NSData כך שיכלול הרחבה של hexString, על מנת שנוכל להמיר מטענים של Chirp Connect למחרוזת הקסדצימלי. (Chirp Connect יהיה זמין ברחבי העולם הודות לכותרת הגישור).

ייבא UIKit

לייבא Firebase

נתוני הרחבה {

var hexString: String {return map {String (פורמט: "%02x", UInt8 ($ 0))}.joined ()}}

2. הוסף נציגים של ImagePicker ל- ViewController שלך והצהיר על משתנה ChirpConnect שנקרא connect.

class ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {

var connect: ChirpConnect? לעקוף את func viewDidLoad () {super.viewDidLoad () …

3. לאחר super.viewDidLoad, אתחל את Chirp Connect והגדר את השיחה שהתקבלה. בשיחת החזרה שהתקבלה נשלף את התמונה מ- Firebase באמצעות המטען שהתקבל ונעדכן את ImageView. תוכל לקבל את APP_KEY ו- APP_SECRET שלך מאת admin.chirp.io.

connect = ChirpConnect (appKey: APP_KEY, andSecret: APP_SECRET) if let connect = connect {connect.getLicenceString {(license: String ?, error: Error?) in if error == nil {if let license = license {connect.setLicenceString (רישיון) connect.start () connect.receivedBlock = {(data: Data?) -> () in if let data = data {print (String (format: "Data received: %@", data.hexString)) let file = Storage.storage (). Reference (). ילד (data.hexString) file.getData (maxSize: 1 * 1024 * 2048) {imageData, שגיאה ב- if let error = error {print ("Error: %@", error.localizedDescription)} else {self.imageView.image = UIImage (data: imageData!)}}}} else {print ("פענוח נכשל"); }}}}

4. הוסף כעת את הקוד לשליחת נתוני התמונה לאחר שנבחר בממשק המשתמש.

func imagePickerController (_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String: Any])

{let imageData = info [UIImagePickerControllerOriginalImage] כ? UIImage נתנו נתונים: Data = UIImageJPEGRepresentation (imageData !, 0.1)! self.imageView.image = imageData let metadata = StorageMetadata () metadata.contentType = "image/jpeg" if let connect = connect {let key: Data = connect.randomPayload (withLength: 8) Firestore.firestore (). collection (" העלאות "). addDocument (נתונים: [" key ": key.hexString," timestamp ": FieldValue.serverTimestamp ()]) {error in if let error = error {print (error.localizedDescription)}} Storage.storage ().reference (). ילד (key.hexString).putData (נתונים, מטא נתונים: מטא נתונים) {(מטא נתונים, שגיאה) ב- if let error = error {print (error.localizedDescription)} else {connect.send (key)}} } self.dismiss (אנימציה: true, השלמה: אפסית)}

הערה: יהיה עליך להוסיף פרטיות - תיאור השימוש בספריית תמונות, פרטיות - תיאור השימוש בספריית תמונות ופרטיות - הצהרות תיאור השימוש במיקרופון ל- Info.plist שלך כדי להעניק הרשאות לשימוש במצלמה, ספריית התמונות והמיקרופון.

שלב 4: צור ממשק משתמש

כעת עבור לקובץ Main.storyboard ליצירת ממשק משתמש.

1. גרור על פני ImageView ושני לחצנים ללוח ה- Storyboard מהחלונית ספריית אובייקטים בפינה השמאלית התחתונה.

2. עבור כל כפתור הוסף אילוץ גובה של כ -75 פיקסלים על ידי בחירת הרכיב ולחיצה על הלחצן הוסף אילוצים חדשים (זה שנראה כמו לוחם עניבות של מלחמת הכוכבים), ולאחר מכן הזן את הגובה ולחץ על Enter.

3. בחרו את כל שלושת הרכיבים והכניסו אותם לתצוגת הערימה על ידי לחיצה על הלחצן Embed In Stack.

4. כעת פתח את עורך העוזר ולחץ על CTRL וגרור מכל רכיב לקוד ViewController, כדי ליצור שקעים עבור כל רכיב.

@IBOutlet var imageView: UIImageView!

@IBOutlet var openLibraryButton: UIButton! @IBOutlet var openCameraButton: UIButton!

5. כעת CTRL וגרור משני הלחצנים כדי ליצור פעולה לפתיחת ממשקי המשתמש של המצלמה/הספרייה.

6. בפעולה הספרייה הפתוחה, הוסף את הקוד הבא

@IBAction func openLibrary (_ שולח: כל) {

תן imagePicker = UIImagePickerController () imagePicker.delegate = self; imagePicker.sourceType =.photoLibrary self.present (imagePicker, אנימציה: true, השלמה: אפסית)}

7. בפעולה מצלמה פתוחה

@IBAction func openCamera (_ שולח: כל) {

תן imagePicker = UIImagePickerController () imagePicker.delegate = self imagePicker.sourceType =.camera; self.present (imagePicker, אנימציה: true, השלמה: אפסית)}

שלב 5: כתוב פונקציית ענן

מכיוון שהתמונות לא צריכות להיות מאוחסנות בענן לנצח, אנו יכולים לכתוב פונקציית ענן לביצוע הניקוי. שירות זה יכול להפעיל כפונקציית HTTP כל שעה על ידי שירות cron כגון cron-job.org.

קודם כל עלינו להתקין כלי Firebase

npm להתקין -g firebase -tools

לאחר מכן מהפעלת מדריך השורשים של הפרויקט

init bas

בחר פונקציות משורת הפקודה כדי לאתחל פונקציות ענן. תוכל גם להפעיל את חנות האש אם ברצונך גם להגדיר את חנות האש.

לאחר מכן פתח את פונקציות/index.js והוסף את הקוד הבא. זכור לשנות

למזהה הפרויקט שלך ב- Firebase.

פונקציות const = לדרוש ('פונקציות בסיס');

const admin = require ('firebase-admin'); admin.initializeApp () exports.cleanup = functions.https.onRequest ((בקשה, תגובה) => {admin.firestore ().collection ('העלאות').where ('חותמת זמן', '{snapshot.forEach (doc = > {admin.storage ().bucket ('gs: //.appspot.com').file (doc.data ().key).delete () doc.ref.delete ()}) תגובה תגובה.סטטוס (200).send ('OK')}).catch (err => response.status (500).send (err))});

פריסת פונקציות ענן היא פשוטה כמו הפעלת פקודה זו.

פריסת בסיס האש

ואז בכתובת cron-job.org צור עבודה שתפעיל את נקודת הסיום הזו כל שעה. נקודת הסיום תהיה בערך

us-central1-project_id.cloudfunctions.net/cleanup

שלב 6: הפעל את האפליקציה

הפעל את האפליקציה על סימולטור או מכשיר iOS, והתחל לשתף תמונות!