Proximity Photo Sharing IOS App: 6 hapa

2024 Autor: John Day | [email protected]. E modifikuara e fundit: 2024-01-30 12:26

Në këtë udhëzues ne do të krijojmë një aplikacion iOS me Swift që ju lejon të ndani fotografi me këdo që është pranë, pa ndonjë çiftim të pajisjeve të nevojshme.

Ne do të përdorim Chirp Connect për të dërguar të dhëna duke përdorur zë, dhe Firebase për të ruajtur imazhet në re.

Dërgimi i të dhënave me zë krijon një përvojë unike ku të dhënat mund të transmetohen për këdo brenda kufirit të dëgjimit.

Hapi 1: Instaloni Kërkesat

Kodi X

Instaloni nga App Store.

Kodra kakao

perde perlë instaloni cocoapods

Chirp Connect iOS SDK

Regjistrohuni në admin.chirp.io

Hapi 2: Projekti i konfigurimit

1. Krijoni një projekt Xcode.

2. Hyni në Firebase dhe krijoni një projekt të ri.

Aktivizo Firestore duke klikuar në seksionin Database dhe duke zgjedhur Cloud Firestore. Klikoni në Funksionet për të aktivizuar gjithashtu Funksionet Cloud.

3. Drejtoni përmes Konfiguroni aplikacionin tuaj iOS në faqen e Vështrimit të Projektit

Ju do të keni nevojë për Identifikuesin e Pakos nga Skeda e Përgjithshme në Cilësimet e Projektit Xcode. Pasi të krijohet Podfile, do t'ju duhet të shtoni varësitë e mëposhtme, para se të ekzekutoni instalimin e pod.

# Pods për projektin

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

4. Shkarkoni SDK -në e fundit Chirp Connect iOS nga admin.chirp.io/downloads

5. Ndiqni hapat në developers.chirp.io për të integruar Chirp Connect në Xcode.

Shkoni te Fillimi / iOS. Pastaj lëvizni poshtë dhe ndiqni udhëzimet e konfigurimit të Swift. Kjo do të përfshijë importimin e kornizës dhe krijimin e një titulli lidhës.

Tani konfigurimi ka përfunduar, mund të fillojmë të shkruajmë disa kod! Ideashtë një ide e mirë të kontrolloni ndërtimet e projektit tuaj në çdo fazë të konfigurimit.

Hapi 3: Shkruani kodin IOS

1. Importoni Firebase në ViewController tuaj dhe zgjeroni NSData për të përfshirë një shtrirje hexString, në mënyrë që të mund të konvertojmë ngarkesat e Chirp Connect në një varg heksadecimal. (Chirp Connect do të jetë i disponueshëm globalisht falë titullit të tejkalimit).

importo UIKit

importoni Firebase

të dhëna shtesë {

var hexString: Vargu {harta e kthimit {String (format: "%02x", UInt8 ($ 0))}.joined ()}}

2. Shtoni delegatë të ImagePicker në ViewController tuaj dhe shpallni një ndryshore ChirpConnect të quajtur connect.

klasa ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {

var connect: ChirpConnect? anashkaloni funksionin viewDidLoad () {super.viewDidLoad ()…

3. Pas super.viewDidLoad, inicializoni Chirp Connect dhe vendosni përgjigjen e thirrjes të marrë. Në kthimin e thirrjeve të marra ne do të marrim imazhin nga Firebase duke përdorur ngarkesën e marrë dhe do të përditësojmë ImageView. Ju mund të merrni APP_KEY dhe APP_SECRET tuaj nga admin.chirp.io.

connect = ChirpConnect (appKey: APP_KEY, dheSecret: APP_SECRET) nëse le të lidhet = lidh {connect.getLicenceString {(licenca: String ?, gabim: Gabim?) në nëse error == zero {nëse licenca = licenca {connect.setLicenceString (licencë) connect.start () connect.receivedBlock = {(të dhënat: Të dhënat?) -> () in nëse le të dhënat = të dhënat {print (String (format: "Të dhënat e marra: %@", data.hexString)) le skedar = Storage.storage (). Referenca (). Fëmija (data.hexString) file.getData (maxSize: 1 * 1024 * 2048) {imageData, gabim nëse gabimi = gabim {print ("Gabim: %@", gabim.localizedDescription)} else {self.imageView.image = UIImage (të dhëna: imageData!)}}} else {print ("Dekodimi dështoi"); }}}}

4. Tani shtoni kodin për të dërguar të dhënat e figurës pasi të jenë zgjedhur në UI.

func imagePickerController (_ zgjedhës: UIImagePickerController, didFinishPickingMediaWithInfo info: [String: Any])

{let imageData = info [UIImagePickerControllerOriginalImage] si? UIImage le të dhënat: Të dhënat = UIImageJPEGPrezantimi (imageData !, 0.1)! self.imageView.image = imageData le meta të dhënave = StorageMetadata () metadata.contentType = "image/jpeg" nëse le të lidh = lidh {letër kyç: Data = connect.randomPayload (meLength: 8) koleksioni i koleksionit Firestore.firestore () () ngarkime "). addDocument (të dhëna: [" kyç ": key.hexString," timestamp ": FieldValue.serverTimestamp ()]) {error in if let error = error {print (error.localizedDescription)}} Storage.storage ().referenca (). fëmija (çelësi.hexString).putData (të dhëna, meta të dhëna: meta të dhëna) {(metadata, gabim) in if let error = error {print (error.localizedDescription)} tjetër {connect.send (kyç)}} } self.dismiss (e animuar: e vërtetë, përfundimi: zero)}

Shënim: Ju do të duhet të shtoni një Konfidencialitet - Përshkrimi i Përdorimit të Bibliotekës së Fotove, Privatësia - Përshkrimi i Përdorimit të Bibliotekës së Fotove dhe Privatësia - Deklaratat e Përshkrimit të Përdorimit të Mikrofonit në Info.plist -in tuaj për të dhënë leje për të përdorur Kamera, Fototekë dhe Mikrofon.

Hapi 4: Krijoni një ndërfaqe të përdoruesit

Tani shkoni te skedari Main.storyboard për të krijuar një UI.

1. Tërhiqeni nëpër një ImageView dhe dy Butona në Storyboard nga paneli i Bibliotekës së Objekteve në këndin e poshtëm të djathtë.

2. Për secilin buton shtoni një kufizim në lartësi prej rreth 75px duke zgjedhur përbërësin dhe duke klikuar butonin Shto kufizime të reja (ai që duket si një luftëtar kravatë i Star Wars), dhe pastaj futni lartësinë dhe shtypni Enter.

3. Zgjidhni të tre komponentët dhe vendosini në një pamje stack duke klikuar butonin Embed In Stack.

4. Tani hapni Asistent Editorin dhe shtypni CTRL dhe tërhiqeni nga secili komponent në kodin ViewController, për të krijuar Outlets për secilin komponent.

@IBOutlet var imageView: UIImageView!

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

5. Tani CTRL dhe tërhiqeni nga të dy butonat për të krijuar një veprim për të hapur ndërfaqen e përdoruesit të kamerës/bibliotekës.

6. Në veprimin Open Library, shtoni kodin e mëposhtëm

@IBAction func openLibrary (_ dërguesi: Çdo) {

le imagePicker = UIImagePickerController () imagePicker.delegate = vetja; imagePicker.sourceType =.photoLibrary Library self.present (imagePicker, i animuar: i vërtetë, përfundimi: zero)}

7. Në veprimin Open Camera

@IBAction func openCamera (_ dërguesi: Çdo) {

le imagePicker = UIImagePickerController () imagePicker.delegate = vetë imagePicker.sourceType =.kamera; self.present (imagePicker, animuar: true, përfundimi: zero)}

Hapi 5: Shkruani një funksion cloud

Meqenëse fotot nuk kanë nevojë të ruhen në cloud përgjithmonë, ne mund të shkruajmë një Funksion Cloud për të kryer pastrimin. Kjo mund të nxitet si një funksion HTTP çdo orë nga një shërbim cron siç është cron-job.org.

Para së gjithash, ne duhet të instalojmë mjete të bazës së zjarrit

npm instaloni -g mjetet e bazës së zjarrit

Pastaj drejtohuni nga drejtoria kryesore e projektit

bazë e zjarrit init

Zgjidhni funksionet nga rreshti i komandës për të inicializuar funksionet cloud. Ju gjithashtu mund të aktivizoni firerestore nëse dëshironi të konfiguroni Firestore.

Pastaj hapni funksionet/index.js dhe shtoni kodin e mëposhtëm. Mos harroni të ndryshoni

në id -in tuaj të projektit Firebase.

funksionet const = kërkojnë ('funksionet e bazës së zjarrit');

const admin = kërkoj ('firebase-admin'); admin.initializeApp () export.cleanup = functions.https.onRequest ((kërkesë, përgjigje) => {admin.firestore ().koleksion ('ngarkime'). ku ('timestamp', '{snapshot.forEach (doc = > {admin.storage ().bucket ('gs: //.appspot.com').file (doc.data ().key).delete () doc.ref.delete ()}) kthejeni përgjigjen.status (200). Dërgoni ('OK')}). Kapni (err => përgjigje.status (500). Dërgoni (gaboj))});

Vendosja e funksioneve cloud është aq e thjeshtë sa ekzekutimi i kësaj komande.

vendosja e bazës së zjarrit

Pastaj në cron-job.org krijoni një punë për të shkaktuar këtë pikë përfundimtare çdo orë. Pika përfundimtare do të jetë diçka e tillë

us-central1-project_id.cloudfunctions.net/cleanup

Hapi 6: Drejtoni aplikacionin

Drejtoni aplikacionin në një imitues ose pajisje iOS dhe filloni të ndani fotografi!