Testando exibições animadas em aplicativos iOS: orientação de especialistas
Publicados: 2023-03-20As animações oferecem transações visuais fluidas entre os vários estados da interface do usuário de um aplicativo. No desenvolvimento de aplicativos iOS, as animações são usadas para reposicionar exibições ou modificar seus tamanhos, bem como para ocultar ou remover exibições de hierarquias. As animações desempenham um papel vital na implementação de efeitos visuais incríveis em um aplicativo. Eles também transmitem feedback visual para as ações dos usuários. O resultado é uma interface de usuário envolvente e dinâmica e um UX elevado para usuários de aplicativos iOS.
Uma exibição animada é uma exibição personalizada que muda sua aparência em resposta a algum contexto. Por exemplo, um layout de carrossel tem vários slides que mudam de tamanho e aparência em resposta à interação do usuário. No entanto, as exibições animadas funcionarão conforme o esperado e fornecerão uma UX incrível somente se forem testadas corretamente. É um desafio testar exibições animadas em aplicativos iOS, pois as animações envolvem modificações baseadas em tempo na interface do usuário.
Esta postagem o guiará pelo processo correto de teste de exibições animadas em aplicativos iOS.
Principais etapas para testar exibições animadas no iOS
Identifique a visualização animada e seus componentes
Uma exibição animada refere-se a uma exibição com um comportamento ou apresentação animada. Envolve diferentes componentes, como imagens, botões, rótulos e outros elementos de uma interface do usuário. Portanto, o primeiro passo antes de começar a testar visualizações animadas no iOS é identificar a visualização animada junto com seus componentes. Você precisa considerar os seguintes fatores.
- Identifique o tipo de animação que você pretende usar no aplicativo, como aumentar/diminuir o zoom, aumentar/diminuir gradualmente e aumentar/diminuir o slide.
- Defina o tempo de duração da animação – o tempo necessário para a conclusão da animação. Decida esse tempo com muito cuidado, pois ele determina o efeito da sua animação.
- Identifique as interações específicas do usuário ou os eventos específicos que acionarão a função da animação. Exemplos de tais gatilhos incluem rolagem e toque de botão.
- Examine com que exatidão e precisão a animação estará funcionando ou se comportando.
- Verifique como a animação está afetando a CPU, o desempenho e o uso de memória do aplicativo.
- Considere o feedback que os usuários do aplicativo darão durante e após a animação – indicadores visuais ou feedback tátil.
A identificação adequada de uma exibição animada e seus componentes é importante durante a realização de testes em projetos de desenvolvimento de software. Ele ajuda a dividir o processo de teste em partes menores e mais gerenciáveis.
Configure o ambiente de teste
Você precisa configurar um ambiente de teste que permita inspecionar as visualizações e manipulá-las durante várias fases da animação. Aqui estão os principais passos para isso.
Primeiro, crie um destino de teste separado e também arquivos separados para cada componente. Dessa forma, você pode verificar o comportamento esperado de cada componente separadamente. Para criar um destino separado para seu ambiente de teste, vá para 'Arquivo', 'Novo' e 'Destino'. Selecione o “iOS Unit Testing Bundle” presente na seção “Test”. Um novo alvo é criado. Você pode usar esse destino para escrever testes para visualização animada. Em seguida, crie uma classe de teste para as exibições animadas. Essa classe deve conter casos de teste que simularão vários estágios do processo de animação e garantirão que as visualizações funcionarão conforme desejado.
Agora, configure um dispositivo de teste que contenha a vista que você testará. Esta etapa inclui dependências essenciais, como fontes de dados e modelos de visualização. Você também precisa configurar objetos fictícios para dependências, como fontes de dados e quaisquer outras exibições. Feito isso, você pode criar os dados de teste necessários.
As etapas mencionadas ajudarão você a configurar um ambiente de teste para animações durante o desenvolvimento de aplicativos iOS. Isso permitirá que você conduza o processo de teste de maneira controlada e repetível.
Escrever testes de unidade para a lógica subjacente do aplicativo iOS
Divida as animações em componentes de tamanho pequeno e teste cada componente individualmente. Essa prática é melhor do que testar toda a animação de uma só vez. Aqui está um exemplo. Há uma visualização personalizada que fica animada quando tocada. Aqui, você precisa verificar se a visualização muda quando você toca nela e se a cor da visualização muda quando você toca nela. Você também deve garantir que a exibição seja animada sem problemas.
Em seguida, identifique os componentes presentes na animação. Escreva casos de teste para cada componente para verificar se os componentes estão funcionando conforme desejado. É recomendável usar a estrutura XCTest fornecida pela Apple para escrever esses testes. Por exemplo, XCTestExpectation permite esperar que uma animação seja concluída antes de fazer qualquer afirmação. Com esta ferramenta, você pode testar o comportamento da visualização em várias fases da animação.
É provável que as animações tenham dependências, como outras exibições ou fontes de dados em outras partes do aplicativo. Por causa disso, você precisa isolar seus testes e melhorar sua confiabilidade. Para isso, você precisa usar objetos fictícios para as dependências. Dessa forma, você poderá testar a lógica de animação do app sem ter que se preocupar com as outras partes do aplicativo iOS.
Depurar usando as ferramentas de depuração incorporadas para animações no Xcode
O Xcode vem com uma ampla variedade de ferramentas de depuração integradas que facilitam as animações de depuração. Essas ferramentas ajudam você a entender como as animações estão funcionando e identificar bugs. Graças a essas ferramentas, você pode executar ações como definir pontos de interrupção em seu código para pausar uma animação em pontos específicos para poder investigar o estado da exibição. Dessa forma, você pode identificar aqueles erros lógicos presentes no código que estão afetando o funcionamento da animação.
A Hierarquia de exibição de depuração da ferramenta ajuda você a inspecionar uma exibição durante a animação. Você poderá ver as propriedades de uma exibição em diferentes fases de uma animação, incluindo as restrições, quadro etc. O Xcode oferece outra ótima ferramenta, o gráfico Debug Memory. Essa ferramenta examina o uso de memória de uma exibição durante a animação e ajuda a identificar problemas de desempenho, como vazamentos de memória. Alguns outros exemplos de ferramentas do Xcode são o inspetor de hierarquia de exibição de animação, o criador de perfil de tempo e o simulador de animações lentas.
Quais são as diferentes metodologias para testar exibições animadas no iOS?
Confira as várias metodologias de teste. Cada uma dessas técnicas de teste desempenha um papel crucial para garantir que as exibições animadas sejam testadas rigorosamente.
Teste assíncrono
As animações envolvem atrasos ou retornos de chamada que ocorrem de forma assíncrona. Por causa disso, você precisa realizar testes assíncronos ao testar exibições animadas. Dê uma olhada nas etapas para testes assíncronos.
Passo 1
Use XCTestExpectation, uma ferramenta integrada disponível na estrutura XCTest no iOS. Com esta ferramenta, você precisa criar uma expectativa para um evento assíncrono. Defina um intervalo de tempo limite para o evento. Depois de criar a expectativa para a conclusão da animação e estabelecer um intervalo de tempo limite, o teste falhará se a expectativa não for atendida. Aqui está um exemplo.
let animationExpectation = XCTestExpectation(descrição: “Animação concluída”)
// Inicia o código da animação aqui
// Após a conclusão da animação, cumpre a expectativa
animationCompletionHandler = {
animationExpectation.fulfill()
}
// Espera até que a expectativa seja cumprida
wait(for: [animationExpectation], timeout: 5)
Passo 2
Várias APIs de animação do iOS contêm manipuladores de conclusão que são chamados após a conclusão da animação. Os testadores usam esses manipuladores de conclusão para realizar testes após a conclusão de uma animação. Veja este exemplo.
// Inicia o código da animação aqui
// Ao final da animação, realiza o teste
animationCompletionHandler = {
// Realiza o teste aqui
}
Etapa 3
Certas animações podem envolver a modificação do estado da IU; isso precisa ser feito no thread principal. Aqui, você tem que usar filas de despacho. Dessa forma, você pode executar o código de teste no thread principal após o término da animação. Dê uma olhada em como isso acontece.
// Inicia o código da animação aqui
// Ao final da animação, realiza o teste na fila principal
animationCompletionHandler = {
DispatchQueue.main.async {
// Realiza o teste aqui
}
}
Teste manual
Certifique-se de conduzir o teste em dispositivos simulados e reais. Você precisa desse processo para verificar se as animações funcionarão conforme desejado em cada tipo de dispositivo e versão do sistema operacional.
O teste manual envolve interagir manualmente com a exibição e observar como a animação está se comportando. É assim que o teste manual é realizado. Os testadores executam o aplicativo iOS em um dispositivo ou no simulador iOS. Em seguida, eles acionam manualmente a animação interagindo com o aplicativo. Desta forma, você pode saber mais sobre problemas de animação, como comportamento inesperado ou qualquer falha no seu funcionamento. Lembre-se de que o comportamento das animações pode ser diferente em vários dispositivos e simuladores, portanto, teste visualizações animadas em diferentes ambientes para obter os melhores resultados.
Também recomendamos que você teste exibições animadas com usuários reais e observe como eles interagem com as animações. Você pode fazer isso executando uma sessão de teste de usabilidade ou um estudo de usuário. Dessa forma, você receberá feedback muito necessário do usuário sobre a animação do seu aplicativo iOS, identificará problemas e os resolverá em tempo hábil.
Teste automatizado
Crie testes automatizados para exibições animadas usando estruturas de teste como EarlGrey, XCUITest ou KIF para simular interações do usuário e verificar se as animações se comportam conforme desejado. O teste automatizado ajuda a detectar problemas nas fases iniciais de um ciclo de desenvolvimento. Essa abordagem de teste também permite que você mantenha sua animação funcional enquanto modifica o código.
Dê uma olhada nas etapas de como testar exibições animadas usando a ferramenta XCUITest.
Passo 1
Identifique a exibição que contém a animação que precisa ser testada. Em seguida, identifique a interação do usuário que aciona a animação.
Passo 2
Escreva um caso de teste que simule a interação do usuário para acionar a animação. Por exemplo, se uma animação for acionada com o pressionamento de um botão, você precisará criar um caso de teste para tocar nesse botão.
Etapa 3
Depois que a animação for acionada, verifique o comportamento da animação usando asserções. Por exemplo, verifique o tamanho, posição e capacidade da visualização enquanto a animação está ocorrendo.
Passo 4
Agora, repita as etapas mencionadas usando vários cenários, como diferentes animações ou diferentes entradas do usuário.
Confira este exemplo. Aqui, o XCUITest é usado para criar um caso de teste para uma animação de “botão”.
func testButtonAnimation() {
let app = XCUIApplication()
app.launch()
let button = app.buttons["myButton"]
botão.tap()
// Verifica a animação
let animationExpectation = Expectation(descrição: “Animação do botão concluída”)
DispatchQueue.main.asyncAfter(deadline: .now() + 1.0) {
XCTAssertTrue(button.frame.origin.x > 0, “O botão deve se mover para a direita durante a animação”)
animationExpectation.fulfill()
}
waitForExpectations(timeout: 2.0, handler: nil)
}
Vistas finais
O teste de exibições animadas pode se tornar complicado às vezes, pois envolve mudanças dinâmicas e visuais. Por isso, você precisa testar visualizações animadas do seu aplicativo iOS seguindo as melhores práticas e estratégias. Você pode buscar assistência técnica de um serviço profissional de desenvolvimento de aplicativos móveis especializado em desenvolvimento de aplicativos iOS. Isso permitirá que você acerte o processo de desenvolvimento e teste do aplicativo.