Proximity Fotoğraf Paylaşımı IOS Uygulaması: 6 Adım

2024 Yazar: John Day | [email protected]. Son düzenleme: 2024-01-30 13:20

Bu talimatta, cihaz eşleştirmesi gerekmeden yakınınızdaki herkesle fotoğraf paylaşmanıza olanak tanıyan Swift ile bir iOS uygulaması oluşturacağız.

Ses kullanarak veri göndermek için Chirp Connect'i ve görüntüleri bulutta depolamak için Firebase'i kullanacağız.

Sesle veri göndermek, verilerin işitme aralığındaki herkese yayınlanabileceği benzersiz bir deneyim yaratır.

1. Adım: Gereksinimleri Yükleyin

Xcode

App Store'dan yükleyin.

CocoaPod'lar

sudo gem Cocoapod'ları yükle

Chirp Connect iOS SDK'sı

admin.chirp.io'da kaydolun

Adım 2: Kurulum Projesi

1. Bir Xcode projesi oluşturun.

2. Firebase'de oturum açın ve yeni bir proje oluşturun.

Veritabanı bölümüne tıklayıp Cloud Firestore'u seçerek Firestore'u etkinleştirin. Bulut İşlevlerini de etkinleştirmek için İşlevler'e tıklayın.

3. Projeye Genel Bakış sayfasında iOS uygulamanızı kurun

Xcode Proje Ayarlarınızdaki Genel Sekmesinden Paket Tanımlayıcısına ihtiyacınız olacak. Pod dosyası oluşturulduktan sonra, pod kurulumunu çalıştırmadan önce aşağıdaki bağımlılıkları eklemeniz gerekecektir.

# Proje için bölmeler

"Firebase/Core" bölmesi "Firebase/Firestore" bölmesi "Firebase/Depolama"

4. En son Chirp Connect iOS SDK'sını admin.chirp.io/downloads adresinden indirin

5. Chirp Connect'i Xcode'a entegre etmek için geliştiriciler.chirp.io adresindeki adımları izleyin.

Başlarken / iOS'a gidin. Ardından aşağı kaydırın ve Swift kurulum talimatlarını izleyin. Bu, çerçeveyi içe aktarmayı ve bir köprüleme başlığı oluşturmayı içerecektir.

Şimdi kurulum tamamlandı, biraz kod yazmaya başlayabiliriz! Kurulumun her aşamasında proje yapılarınızı kontrol etmek iyi bir fikirdir.

3. Adım: IOS Kodunu Yazın

1. Firebase'i ViewController'ınıza aktarın ve NSData'yı bir hexString uzantısı içerecek şekilde genişletin, böylece Chirp Connect yüklerini onaltılık bir dizeye dönüştürebiliriz. (Chirp Connect, köprüleme başlığı sayesinde küresel olarak mevcut olacaktır).

UIKit'i içe aktar

Firebase'i içe aktar

uzantı Verileri {

var hexString: String { return map { String(format: "%02x", UInt8($0)) }.joined() } }

2. ViewController'ınıza ImagePicker temsilcileri ekleyin ve connect adında bir ChirpConnect değişkeni bildirin.

class ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {

var connect: ChirpConnect? işlevi geçersiz kıl viewDidLoad() { super.viewDidLoad() …

3. super.viewDidLoad'dan sonra Chirp Connect'i başlatın ve alınan geri aramayı ayarlayın. Alınan geri aramada, alınan yükü kullanarak görüntüyü Firebase'den alacağız ve ImageView'i güncelleyeceğiz. APP_KEY ve APP_SECRET'inizi admin.chirp.io'dan alabilirsiniz.

connect = ChirpConnect(appKey: APP_KEY veSecret: APP_SECRET) if let connect = connect { connect.getLicenceString { (licence: String?, error: Error?) in if error == nil { if let lisans = lisans { connect.setLicenceString(lisans) connect.start() connect.receivedBlock = { (veri: Veri?) -> () in if let data = data { print(String(format: "Alınan veri: %@", data.hexString)) let dosyası = Storage.storage().reference().child(data.hexString) file.getData(maxSize: 1 * 1024 * 2048) { imageData, if let hatasında hata = hata { print("Hata: %@", hata.localizedDescription) } else { self.imageView.image = UIImage(data: imageData!) } } } else { print("Kod çözme başarısız"); } } } }

4. Şimdi, kullanıcı arayüzünde seçildikten sonra görüntü verilerini göndermek için kodu ekleyin.

func imagePickerController(_ seçici: UIImagePickerController, didFinishPickingMediaWithInfo bilgisi: [Dize: Herhangi biri])

{ let imageData = info[UIImagePickerControllerOriginalImage] olarak? UIImage veri ver: Veri = 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(" uploads").addDocument(veri: ["anahtar": key.hexString, "timestamp": FieldValue.serverTimestamp()]) { error in if let error = error { print(error.localizedDescription) } } Storage.storage().reference().child(key.hexString).putData(data, metadata: metadata) { (metadata, error) in if let error = error { print(error.localizedDescription) } else { connect.send(key) } } } self.dismiss(animasyonlu: true, tamamlama: nil) }

Not: Kamera, Fotoğraf Kitaplığı ve Mikrofonu kullanma izinlerini vermek için Info.plist'inize Gizlilik - Fotoğraf Kitaplığı Kullanım Açıklaması, Gizlilik - Fotoğraf Kitaplığı Kullanım Açıklaması ve Gizlilik - Mikrofon Kullanım Açıklaması ifadeleri eklemeniz gerekir.

4. Adım: Bir Kullanıcı Arayüzü Oluşturun

Şimdi bir UI oluşturmak için Main.storyboard dosyasına gidin.

1. Sağ alt köşedeki Nesne Kitaplığı panelinden bir ImageView ve iki Düğme boyunca Storyboard'a sürükleyin.

2. Bileşeni seçip Yeni Kısıtlamalar Ekle düğmesini (bir Star Wars berabere dövüşçü gibi görünen) tıklatarak her düğme için yaklaşık 75 piksellik bir yükseklik kısıtlaması ekleyin ve ardından yüksekliği girin ve Enter'a basın.

3. Üç bileşeni de seçin ve Yığına Göm düğmesini tıklatarak bunları yığın görünümüne yerleştirin.

4. Şimdi Yardımcı Düzenleyiciyi açın ve CTRL'ye basın ve her bileşen için Çıkışlar oluşturmak üzere her bileşenden ViewController koduna sürükleyin.

@IBOutlet var imageView: UIImageView!

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

5. Şimdi, kamera/kitaplık kullanıcı arabirimlerini açmak için bir Eylem oluşturmak için CTRL ve her iki düğmeden sürükleyin.

6. Kitaplığı Aç eyleminde aşağıdaki kodu ekleyin

@IBAction işlevi openLibrary(_ gönderen: Herhangi biri) {

let imagePicker = UIImagePickerController() imagePicker.delegate = self; imagePicker.sourceType =.photoLibrary self.present(imagePicker, animasyonlu: true, tamamlama: nil) }

7. Kamerayı Aç eyleminde

@IBAction işlevi openCamera(_ gönderen: Herhangi biri) {

let imagePicker = UIImagePickerController() imagePicker.delegate = self imagePicker.sourceType =.camera; self.present(imagePicker, animasyonlu: doğru, tamamlama: sıfır) }

Adım 5: Bir Bulut İşlevi Yazın

Fotoğrafların sonsuza kadar bulutta saklanması gerekmediğinden, temizleme işlemini gerçekleştirmek için bir Bulut İşlevi yazabiliriz. Bu, cron-job.org gibi bir cron hizmeti tarafından her saat başı bir HTTP işlevi olarak tetiklenebilir.

Öncelikle firebase araçlarını kurmamız gerekiyor.

npm install -g firebase araçları

Ardından projenin kök dizininden çalıştırın

ateş tabanı başlatma

Bulut işlevlerini başlatmak için komut satırından işlevleri seçin. Firestore'u da yapılandırmak istiyorsanız, firestore'u da etkinleştirebilirsiniz.

Ardından function/index.js dosyasını açın ve aşağıdaki kodu ekleyin. değiştirmeyi unutma

Firebase proje kimliğinize.

const function = require('firebase-functions');

const admin = require('firebase-admin'); admin.initializeApp() export.cleanup = function.https.onRequest((istek, yanıt) => { admin.firestore().collection('uploads').where('timestamp', ' { snapshot.forEach(doc = > { admin.storage().bucket('gs://.appspot.com').file(doc.data().key).delete() doc.ref.delete() }) return answer.status(200).send('Tamam') }).catch(hata => yanıt.status(500).send(err)) });

Bulut işlevlerini dağıtmak, bu komutu çalıştırmak kadar basittir.

ateş üssü dağıtmak

Ardından cron-job.org'da bu bitiş noktasını her saat tetiklemek için bir iş oluşturun. Son nokta gibi bir şey olacak

us-central1-project_id.cloudfunctions.net/cleanup

6. Adım: Uygulamayı Çalıştırın

Uygulamayı bir simülatörde veya iOS cihazında çalıştırın ve fotoğrafları paylaşmaya başlayın!