Съдържание:

Приложение IOS за споделяне на снимки в близост: 6 стъпки
Приложение IOS за споделяне на снимки в близост: 6 стъпки

Видео: Приложение IOS за споделяне на снимки в близост: 6 стъпки

Видео: Приложение IOS за споделяне на снимки в близост: 6 стъпки
Видео: Полезные функции IPhone / Как настроить камеру и делать фото на Айфоне более удобно? 2024, Юли
Anonim

В тази инструкция ще създадем приложение за iOS със Swift, което ви позволява да споделяте снимки с всеки наблизо, без да е необходимо сдвояване на устройства.

Ще използваме Chirp Connect за изпращане на данни чрез звук и Firebase за съхраняване на изображенията в облака.

Изпращането на данни със звук създава уникално изживяване, при което данните могат да бъдат излъчвани до всеки в обсега на слуха.

Стъпка 1: Изисквания за инсталиране

Xcode

Инсталирайте от App Store.

Какаови бобчета

sudo gem инсталирате cocoapods

Chirp Connect iOS SDK

Регистрирайте се на admin.chirp.io

Стъпка 2: Инсталиране на проект

1. Създайте Xcode проект.

2. Влезте във Firebase и създайте нов проект.

Активирайте Firestore, като щракнете в раздела Database и изберете Cloud Firestore. Щракнете върху Функции, за да активирате и Облачните функции.

3. Изпълнете настройката на приложението за iOS на страницата „Общ преглед на проекта“

Ще ви е необходим идентификаторът на пакета от раздела Общи в настройките на вашия Xcode проект. След като Podfile се създаде, ще трябва да добавите следните зависимости, преди да стартирате pod install.

# Шушулки за проект

под „Firebase/Core“под „Firebase/Firestore“под „Firebase/Storage“

4. Изтеглете най -новия SDK на iOS за Chirp Connect от 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.

клас ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {

var connect: ChirpConnect? заменя функцията 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), ако позволим connect = connect {connect.getLicenceString {(лиценз: String ?, грешка: Грешка?) in if error == nil {if let license = license {connect.setLicenceString (лиценз) connect.start () connect.receivedBlock = {(data: Data?) -> () in if let data = data {print (String (формат: "Получени данни: %@", data.hexString)) let file = Storage.storage (). Reference (). Дъщерно (data.hexString) file.getData (maxSize: 1 * 1024 * 2048) {imageData, грешка в if let error = error {print ("Грешка: %@", грешка.localizedDescription)} else {self.imageView.image = UIImage (данни: imageData!)}}} else {print ("Декодирането е неуспешно"); }}}}

4. Сега добавете кода, за да изпратите данните за изображението, след като бъдат избрани в потребителския интерфейс.

func imagePickerController (_ избор: UIImagePickerController, didFinishPickingMediaWithInfo информация: [Низ: Всяко])

{let imageData = info [UIImagePickerControllerOriginalImage] като? 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 (). collection (" uploads "). addDocument (data: [" key ": key.hexString," timestamp ": FieldValue.serverTimestamp ()]) {error in if let error = error {print (error.localizedDescription)}} Storage.storage ().reference (). child (key.hexString).putData (данни, метаданни: метаданни) {(метаданни, грешка) in if let error = error {print (error.localizedDescription)} else {connect.send (key)}} } self.dismiss (анимирано: вярно, завършване: нула)}

Забележка: Ще трябва да добавите поверителност - описание на използването на библиотеката с снимки, поверителност - описание на използването на библиотеката с снимки и поверителност - описания за използване на микрофон към вашия Info.plist, за да предоставите разрешения за използване на камерата, библиотеката със снимки и микрофона.

Стъпка 4: Създайте потребителски интерфейс

Създайте потребителски интерфейс
Създайте потребителски интерфейс

Сега отидете на файла Main.storyboard, за да създадете потребителски интерфейс.

1. Плъзнете през ImageView и два бутона към Storyboard от панела Object Library в долния десен ъгъл.

2. За всеки бутон добавете ограничение за височина от около 75 пиксела, като изберете компонента и щракнете върху бутона Добавяне на нови ограничения (този, който прилича на боец за вратовръзка Star Wars), след което въведете височината и натиснете Enter.

3. Изберете и трите компонента и ги поставете в изглед на стека, като щракнете върху бутона Вграждане в стека.

4. Сега отворете помощния редактор и натиснете CTRL и плъзнете от всеки компонент до кода на ViewController, за да създадете изходи за всеки компонент.

@IBOutlet var imageView: UIImageView!

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

5. Сега натиснете CTRL и плъзнете от двата бутона, за да създадете действие за отваряне на потребителския интерфейс на камерата/библиотеката.

6. В действието Open Library добавете следния код

@IBAction func openLibrary (_ подател: Всеки) {

нека imagePicker = UIImagePickerController () imagePicker.delegate = себе си; imagePicker.sourceType =.photoLibrary self.present (imagePicker, анимирано: вярно, завършване: нула)}

7. В действието Отваряне на камерата

@IBAction func openCamera (_ подател: Всеки) {

нека imagePicker = UIImagePickerController () imagePicker.delegate = self imagePicker.sourceType =.camera; self.present (imagePicker, анимирано: вярно, завършване: нула)}

Стъпка 5: Напишете облачна функция

Тъй като снимките не трябва да се съхраняват в облака завинаги, можем да напишем Cloud функция, за да извършим почистването. Това може да се задейства като HTTP функция на всеки час от cron услуга като cron-job.org.

На първо място трябва да инсталираме firebase-tools

npm install -g firebase -tools

След това стартирайте от главната директория на проекта

firebase init

Изберете функции от командния ред, за да инициализирате облачните функции. Можете също да активирате firestore, ако искате също да конфигурирате Firestore.

След това отворете functions/index.js и добавете следния код. Не забравяйте да се промените

към вашия идентификатор на проект във Firebase.

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

const admin = require ('firebase-admin'); admin.initializeApp () export.cleanup = functions.https.onRequest ((заявка, отговор) => {admin.firestore ().collection ('uploads').where ('timestamp', '{snapshot.forEach (doc = > {admin.storage ().bucket ('gs: //.appspot.com').file (doc.data ().key).delete () doc.ref.delete ()}) връщане response.status (200).send ('OK')}).catch (err => response.status (500).send (err))});

Разполагането на облачни функции е толкова просто, колкото изпълнението на тази команда.

внедряване на firebase

След това в cron-job.org създайте работа, която да задейства тази крайна точка на всеки час. Крайната точка ще бъде нещо подобно

us-central1-project_id.cloudfunctions.net/cleanup

Стъпка 6: Стартирайте приложението

Стартирайте приложението на симулатор или iOS устройство и започнете да споделяте снимки!

Препоръчано: