Агуулгын хүснэгт:

Ойролцоох зураг хуваалцах IOS програм: 6 алхам
Ойролцоох зураг хуваалцах IOS програм: 6 алхам
Anonim

Энэхүү зааварчилгаанд бид Swift -тэй iOS аппликейшн үүсгэх бөгөөд энэ нь танд төхөөрөмжийг хослуулах шаардлагагүй ойролцоох хүмүүстэй зураг хуваалцах боломжийг олгоно.

Бид Chirp Connect -ийг ашиглан дууг ашиглан өгөгдөл илгээх бөгөөд зургийг үүлэнд хадгалахын тулд Firebase -ийг ашиглах болно.

Өгөгдлийг дуугаар илгээх нь өгөгдлийг сонсголын хүрээний хүн бүрт дамжуулах өвөрмөц туршлагыг бий болгодог.

Алхам 1: Суулгах шаардлага

Xcode

App Store -оос суулгана уу.

CocoaPods

sudo gem cocoapods суулгах

Chirp Connect iOS SDK

Admin.chirp.io дээр бүртгүүлнэ үү

Алхам 2: Төсөл тохируулах

1. Xcode төсөл үүсгэх.

2. Firebase -д нэвтэрч, шинэ төсөл үүсгээрэй.

Өгөгдлийн сангийн хэсэгт дарж Cloud Firestore -ийг сонгон Firestore -ийг идэвхжүүлнэ үү. Cloud функцийг идэвхжүүлэхийн тулд функц дээр дарна уу.

3. Төслийн тойм хуудсан дээр iOS програмаа тохируулах замаар ажиллуулна уу

Танд Xcode төслийн тохиргооны Ерөнхий таб дээрээс Багц танигч хэрэгтэй болно. Podfile -ийг үүсгэсний дараа pod суулгалтыг ажиллуулахын өмнө дараах хамаарлыг нэмэх шаардлагатай болно.

Төслийн # Pods

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

4. Хамгийн сүүлийн үеийн Chirp Connect iOS SDK -ийг admin.chirp.io/downloads дээрээс татаж аваарай

5. Chirp Connect -ийг Xcode -д нэгтгэхийн тулд developers.chirp.io дээрх алхмуудыг дагана уу.

Эхлэх / iOS руу очно уу. Дараа нь доош гүйлгээд Swift -ийг тохируулах зааврыг дагана уу, үүнд хүрээ оруулах, гүүр толгой үүсгэх шаардлагатай болно.

Одоо тохиргоо дууссан, бид код бичиж эхлэх боломжтой! Тохиргооны үе шат бүрт төслийнхөө бүтцийг шалгаж үзэх нь зүйтэй юм.

Алхам 3: IOS код бичих

1. Firebase -ийг ViewController руу оруулж, NSData -г өргөтгөхийн тулд hexString өргөтгөлийг оруулснаар бид Chirp Connect -ийн ачааллыг арван зургаатын мөр болгон хувиргаж чадна. (Chirp Connect нь гүүрний толгойн ачаар дэлхий даяар боломжтой болно).

UIKit импортлох

Firebase импортлох

өргөтгөлийн мэдээлэл {

var hexString: String {буцах газрын зураг {String (формат: "%02x", UInt8 ($ 0))}.joined ()}}

2. ViewController дээрээ ImagePicker -ийн төлөөлөгчдийг нэмж, connect гэж нэрлэгддэг ChirpConnect хувьсагчийг зарлана.

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 licens = license {connect.setLicenceString (лиценз) connect.start () connect.receivedBlock = {(өгөгдөл: Өгөгдөл?) -> () in if let data = data {хэвлэх (String (формат: "Хүлээн авсан өгөгдөл: %@", data.hexString)) файлыг зөвшөөрөх = Storage.storage (). Reference (). Child (data.hexString) file.getData (maxSize: 1 * 1024 * 2048) {imageData, error = error {print ("Error: %@", error).localizedDescription)} өөр {self.imageView.image = UIImage (өгөгдөл: imageData!)}}} өөр {хэвлэх ("Код тайлж чадсангүй"); }}}}

4. Одоо UI -д сонгогдсоны дараа зургийн өгөгдлийг илгээх кодыг нэмнэ үү.

func imagePickerController (_ сонгогч: UIImagePickerController, didFinishPickingMediaWithInfo мэдээлэл: [String: Any])

{let imageData = info [UIImagePickerControllerOriginalImage] гэж? UIImage өгөгдлийг зөвшөөрөх: Data = UIImageJPEGRepreentation (imageData !, 0.1)! self.imageView.image = imageData нь metadata = StorageMetadata () metadata.contentType = "image/jpeg" -ийг холбох = холбох {let key: Data = connect.randomPayload (withLength: 8) Firestore.firestore () цуглуулга (") uploads "). addDocument (өгөгдөл: [" түлхүүр ": key.hexString," timestamp ": FieldValue.serverTimestamp ()]) {алдаа байвал зөвшөөрөх алдаа = алдаа {хэвлэх (error.localizedDescription)}} Хадгалах сан. ().reference (). child (key.hexString).putData (data, metadata: metadata) {(metadata, error) in if error = error {print (error.localizedDescription)} else {connect.send (key)}} } self.dississ (хөдөлгөөнт: үнэн, дууссан: тэг)}

Тэмдэглэл: Камер, Фото номын сан, Микрофон ашиглах зөвшөөрлийг олгохын тулд та өөрийн Info.plist -д Нууцлал - Фото зургийн номын сангийн ашиглалтын тодорхойлолт, Нууцлал - Фото зургийн номын сангийн ашиглалт ба нууцлал - Микрофоны ашиглалтын тайлбарын мэдэгдлийг оруулах шаардлагатай болно.

Алхам 4: Хэрэглэгчийн интерфэйс үүсгэх

Хэрэглэгчийн интерфэйс үүсгэх
Хэрэглэгчийн интерфэйс үүсгэх

UI үүсгэхийн тулд Main.storyboard файл руу очно уу.

1. Баруун доод буланд байгаа Object Library самбараас ImageView болон хоёр товчлуурыг Storyboard руу чирнэ үү.

2. Товчлуур бүрийн хувьд бүрэлдэхүүн хэсгийг сонгоод Add New Contraints (Star Wars -ийн гал хамгаалагч шиг харагддаг) товчийг дарж 75px орчим өндөр хязгаарлалтыг нэмээд өндрийг оруулаад Enter дарна уу.

3. Бүх гурван бүрэлдэхүүн хэсгийг сонгоод Embed In Stack товчийг дарж стекийн харагдацад оруулна уу.

4. Одоо Туслах редакторыг нээж, CTRL товчийг дарж бүрэлдэхүүн хэсэг бүрээс ViewController код руу чирж, бүрэлдэхүүн хэсэг бүрт Outlet үүсгэнэ.

@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, хүүхэлдэйн: үнэн, дууссан: nil)}

7. Нээлттэй камерын үйлдэлд

@IBAction func openCamera (_ илгээгч: Ямар ч) {

imagePicker = UIImagePickerController () imagePicker.delegate = self imagePicker.sourceType =.camera зөвшөөрөх; self.present (imagePicker, хүүхэлдэйн: үнэн, дууссан: тэг)}

Алхам 5: Үүлний функц бичих

Зургийг үүлд үүрд хадгалах шаардлагагүй тул бид цэвэрлэхийн тулд Үүл функцийг бичиж болно. Үүнийг cron-job.org гэх мэт cron үйлчилгээгээр цаг тутамд HTTP функц болгон өдөөж болно.

Юуны өмнө бид галын багаж хэрэгслийг суулгах хэрэгтэй

npm install -g firebase -tools

Дараа нь төслийн үндсэн лавлахаас ажиллуулна уу

firebase init

Үүлний функцийг эхлүүлэхийн тулд командын мөрөөс функцийг сонгоно уу. Та мөн Firestore -ийг тохируулахыг хүсвэл firestore -ийг идэвхжүүлж болно.

Дараа нь functions/index.js -ийг нээгээд дараах кодыг нэмнэ үү. Өөрчлөхөө мартуузай

таны Firebase төслийн id руу.

const функцууд = шаардах ('firebase-functions');

const admin = шаарддаг ('firebase-admin'); admin.initializeApp () export.cleanup = functions.https.onRequest ((хүсэлт, хариулт) => {admin.firestore ().collection ('uploads'). > {admin.storage ().bucket ('gs: //.appspot.com').file (doc.data ().key).delete () doc.ref.delete ()}) хариу урвал. байдал (200).send ('OK')}).catch (err => хариулт. Төлөв (500). Илгээх (алдаа))});

Үүлний функцийг ашиглах нь энэ тушаалыг ажиллуулахтай адил хялбар юм.

галын баазыг байрлуулах

Дараа нь cron-job.org дээр цаг тутамд энэ төгсгөлийн цэгийг ажиллуулах ажлын байр бий болго. Эцсийн цэг нь иймэрхүү зүйл байх болно

us-central1-project_id.cloudfunctions.net/cleanup

Алхам 6: Аппликешныг ажиллуулна уу

Програмыг симулятор эсвэл iOS төхөөрөмж дээр ажиллуулаад зураг хуваалцаж эхлээрэй!

Зөвлөмж болгож буй: