iOS Câmera — Parte 1

Adicionando Overlay

Nesse tutorial será explicado como customizar uma sessão da câmera para colocar overlays sobre fotos. Utilizaremos para isso o AVFoundation em Swift 3, com Xcode 8.3.3.

Criando uma sessão de câmera:

Crie um novo projeto no Xcode e selecione Single View Application. Na sua Main.storyboard adicione dois Buttons e uma View. Os botões serão futuramente utilizados para tirar a foto e o outro para virar a câmera. Já a View adicionada será onde a sessão da câmera será mostrada.

Depois disso, crie em sua ViewController.swift um outlet para cada item adicionado. Para isso, selecione do lado direito o Assistant editor. Com a sua Main.storyboard e a ViewController.swift em primeiro plano, segure o control e arraste da storyboard para a ViewController.swift.

Após feitas as ligações seu código deve ficar igual a este:

Em seguida adicione a biblioteca AVFoundation e crie as variáveis abaixo:

Adicione na viewDidLoad() a chamada da função setDevice() e crie a mesma conforme o código a seguir.

A função setDevice tem por objetivo selecionar a câmera e guarda-la no atributo captureDevice que será usado mais a frente para obter a imagem em tempo real. A cameraflag será somente usada para mudar a posição da câmera mais posteriormente. Agora, vamos criar a função para iniciar a sessão de captura, a beginSession().

Nessa função iniciamos a sessão adicionando o nosso captureDevice a ela e criamos a previewLayer que conterá a a sessão de vídeo obtida na câmera. Depois disso adiciona-se essa prévia na previewView. Por último devemos adicionar no Info.plist a solicitação para o uso da câmera (Privacy — Camera Usage Description) conforme pode ser visto a seguir:

E na função viewDidLayoutSubviews(), é necessário dar um override para podermos modificar as views adicionadas na view controller:

Execute o aplicativo, porém é importante lembrar que o simulador não dispõe de câmera, logo é necessário rodar em um aparelho real. Ao executar você deverá ver a imagem da câmera e os dois botões, porém ainda sem função implementada.

Primeiramente, vamos adicionar função ao botão de virar a câmera. Adicione uma IBAction ao botão e uma função chamada endSession().

Rode novamente o programa e teste o botão de virar a câmera.
Agora vamos ao botão de tirar foto.

Adicione o delegate AVCapturePhotoDelegate ao lado da UIViewController no início do arquivo e uma nova IBAction ao botão de tirar foto e a função capture :

Rode novamente o programa e teste o botão de tirar foto. Ele deve imprimir no console o tamanho da imagem obtida. Vamos agora então tratar de adicionar o overlay na sessão.

Adicionando o overlay

Adicione o overlay desejado na pasta dos assets e depois adicione-o como variável global na ViewContoller.swift, não esquecendo que a imagem deve ser .png:

var img:UIImage = #imageLiteral(resourceName: “filtro”)

Atualize sua função viewDidLayoutSubviews() para:

Isso irá adicionar a imagem na sessão de câmera, porém não salvará a imagem sobreposta na sessão da câmera.

O salvamento da imagem customizada será mostrado no tutorial “iOS Câmera: Salvando e Compartilhando Suas Fotos Customizadas” .

Código final

Se houver alguma dúvida, segue código completo


One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.