Isi kandungan:

Aplikasi IOS Perkongsian Foto Berdekatan: 6 Langkah
Aplikasi IOS Perkongsian Foto Berdekatan: 6 Langkah

Video: Aplikasi IOS Perkongsian Foto Berdekatan: 6 Langkah

Video: Aplikasi IOS Perkongsian Foto Berdekatan: 6 Langkah
Video: Metode Pembayaran bermasalah, Diperlukan verifikasi, Tidak bisa download/update aplikasi App Store 2024, November
Anonim

Dalam arahan ini, kami akan membuat aplikasi iOS dengan Swift yang membolehkan anda berkongsi foto dengan sesiapa sahaja yang berdekatan, tanpa perlu memasangkan peranti.

Kami akan menggunakan Chirp Connect untuk mengirim data menggunakan suara, dan Firebase untuk menyimpan gambar di awan.

Menghantar data dengan suara menghasilkan pengalaman unik di mana data dapat disiarkan kepada sesiapa sahaja dalam jarak pendengaran.

Langkah 1: Pasang Keperluan

Kod X

Pasang dari App Store.

Kod Kakao

permata sudo memasang cocoapods

Chirp Connect iOS SDK

Daftar di admin.chirp.io

Langkah 2: Persediaan Projek

1. Buat projek Xcode.

2. Log masuk ke Firebase dan buat projek baru.

Dayakan Firestore dengan mengklik ke bahagian Pangkalan Data dan memilih Cloud Firestore. Klik ke Fungsi untuk juga mengaktifkan Cloud Functions.

3. Jalankan Menyiapkan aplikasi iOS anda di halaman Gambaran Keseluruhan Projek

Anda memerlukan Pengenal Bundle dari Tab Umum dalam Tetapan Projek Xcode anda. Setelah Podfile dibuat, anda perlu menambahkan kebergantungan berikut, sebelum menjalankan pemasangan pod.

# Pod untuk projek

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

4. Muat turun Chirp Connect iOS SDK terkini dari admin.chirp.io/downloads

5. Ikuti langkah-langkah di developer.chirp.io untuk mengintegrasikan Chirp Connect ke dalam Xcode.

Pergi ke Bermula / iOS. Kemudian tatal ke bawah dan ikuti arahan penyediaan Swift. Ini akan melibatkan pengimportan rangka kerja dan membuat header penyambungan.

Sekarang persediaan selesai, kita boleh mula menulis beberapa kod! Adalah idea yang baik untuk memeriksa pembinaan projek anda pada setiap peringkat dalam penyediaan.

Langkah 3: Tulis Kod IOS

1. Import Firebase ke dalam ViewController anda dan panjangkan NSData untuk memasukkan ekstensi hexString, sehingga kita dapat menukar muatan Chirp Connect ke rentetan heksadesimal. (Chirp Connect akan tersedia di seluruh dunia berkat header penyambung).

mengimport UIKit

import Firebase

Data peluasan {

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

2. Tambahkan perwakilan ImagePicker ke ViewController anda, dan nyatakan pemboleh ubah ChirpConnect yang disebut connect.

kelas ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {

var connect: ChirpConnect? ganti func viewDidLoad () {super.viewDidLoad ()…

3. Selepas super.viewDidLoad, mulakan Chirp Connect, dan sediakan panggilan balik yang diterima. Dalam panggilan balik yang diterima, kami akan mengambil gambar dari Firebase menggunakan muatan yang diterima dan mengemas kini ImageView. Anda boleh mendapatkan APP_KEY dan APP_SECRET anda dari admin.chirp.io.

connect = ChirpConnect (appKey: APP_KEY, andSecret: APP_SECRET) if let connect = connect {connect.getLicenceString {(lesen: String ?, error: Error?) dalam jika error == nil {if let license = license {connect.setLicenceString (lesen) connect.start () connect.receivedBlock = {(data: Data?) -> () in if let data = data {print (String (format: "Data yang diterima:% @", data.hexString)) biarkan fail = Storage.storage (). Rujukan (). Child (data.hexString) file.getData (maxSize: 1 * 1024 * 2048) {imageData, error in if let error = error {print ("Error:% @", ralat.localizedDescription)} lain {self.imageView.image = UIImage (data: imageData!)}}} lain {cetak ("Decode gagal"); }}}}

4. Sekarang tambahkan kod untuk mengirim data gambar setelah terpilih di UI.

func imagePickerController (_ picker: UIImagePickerController, didFinishPickingMediaWithInfo maklumat: [Rentetan: Mana-mana])

{let imageData = info [UIImagePickerControllerOriginalImage] sebagai? UIImage let data: 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 (). koleksi (" muat naik "). addDocument (data: [" key ": 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)} lain {connect.send (key)}} } self.dismiss (animasi: benar, penyelesaian: nihil)}

Catatan: Anda perlu menambahkan Privasi - Penerangan Penggunaan Perpustakaan Foto, Privasi - Keterangan dan Privasi Penggunaan Perpustakaan Foto - Pernyataan Penerangan Penggunaan Mikrofon ke Info.plist anda untuk memberi kebenaran untuk menggunakan Kamera, Perpustakaan Foto dan Mikrofon.

Langkah 4: Buat Antara Muka Pengguna

Buat Antara Muka Pengguna
Buat Antara Muka Pengguna

Sekarang pergi ke fail Main.storyboard untuk membuat UI.

1. Seret melintasi ImageView dan dua Butang ke Papan Cerita dari panel Perpustakaan Objek di sudut kanan bawah.

2. Untuk setiap butang tambahkan batasan ketinggian sekitar 75 piksel dengan memilih komponen dan mengklik butang Tambah Kekangan Baru (yang kelihatan seperti pejuang tali leher Star Wars), dan kemudian masukkan ketinggian dan tekan Enter.

3. Pilih ketiga-tiga komponen dan masukkan ke dalam pandangan timbunan dengan mengklik butang Benamkan Dalam Tumpukan.

4. Sekarang buka Assistant Editor, dan tekan CTRL dan seret dari setiap komponen ke kod ViewController, untuk membuat Outlet untuk setiap komponen.

@IBOutlet var imageView: UIImageView!

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

5. Sekarang CTRL dan seret dari kedua butang untuk membuat Tindakan untuk membuka UI kamera / perpustakaan.

6. Dalam tindakan Open Library, tambahkan kod berikut

@IBAction func openLibrary (_ pengirim: Mana-mana) {

biarkan imagePicker = UIImagePickerController () imagePicker.delegate = diri; imagePicker.sourceType =.photoLibrary self.present (imagePicker, animasi: benar, penyelesaian: nil)}

7. Dalam tindakan Buka Kamera

@IBAction func openCamera (_ pengirim: Mana-mana) {

biarkan imagePicker = UIImagePickerController () imagePicker.delegate = self imagePicker.sourceType =.camera; self.present (imagePicker, animated: true, penyelesaian: nil)}

Langkah 5: Tuliskan Fungsi Awan

Oleh kerana foto tidak perlu disimpan di awan selamanya, kita dapat menulis Fungsi Awan untuk melakukan pembersihan. Ini boleh dicetuskan sebagai fungsi HTTP setiap jam oleh perkhidmatan cron seperti cron-job.org.

Pertama sekali kita perlu memasang alat firebase

npm pasang -g firebase-tools

Kemudian dari direktori root projek jalankan

firebase init

Pilih fungsi dari baris arahan untuk memulakan fungsi awan. Anda juga boleh mengaktifkan firestore jika anda mahu juga mengkonfigurasi Firestore.

Kemudian buka function / index.js dan tambahkan kod berikut. Ingatlah untuk berubah

ke id projek Firebase anda.

const functions = memerlukan ('firebase-functions');

const admin = memerlukan ('firebase-admin'); admin.initializeApp () export.cleanup = functions.https.onRequest ((permintaan, respons) => {admin.firestore ().collection ('uploads)).where (' timestamp ',' {snapshot.forEach (doc = > {admin.storage ().bucket ('gs: //.appspot.com').file (doc.data ().key).delete () doc.ref.delete ()}) balas respons.status (200). Hantar ('OK')}).catch (err => respons.status (500). Hantar (err))});

Menggunakan fungsi awan semudah menjalankan perintah ini.

firebase menyebarkan

Kemudian di cron-job.org buat pekerjaan untuk mencetuskan titik akhir ini setiap jam. Titik akhir akan menjadi seperti

us-central1-project_id.cloudfunctions.net/cleanup

Langkah 6: Jalankan Aplikasi

Jalankan aplikasi pada simulator atau peranti iOS, dan mulalah berkongsi foto!

Disyorkan: