[CHORE]: Script to render every screen in every theme to PNG

Aberta
#248 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
4/5
Tempo estimado
3-5 dias
Facilidade para iniciantes
66/100
Tipo de issue
Funcionalidade
Clareza
Claramente especificada
Status de atividade
Ativa
Stack de tecnologia
dart, flutter
Domínio
mobile, testing

Direção de pesquisa

Read mobile/test/ui_smoke_test.dart for the provider setup and sample data, then inspect mobile/assets/fonts/Inter/ and the Flutter test APIs for capturing images. Build a test-based script covering the listed screens, themes, and sizes, with PNG output outside the repository; document how to run it in CONTRIBUTING.md. Done when the requested screens can be rendered with the bundled fonts and the instructions work for UI pull requests.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

area: mobile chore difficulty: medium testing

Context

While redesigning the app (#224) it was very useful to render every screen, in every theme, to PNG files with sample data and the real Inter font, and look at them side by side. That made layout problems obvious without a phone (one of them became #240). The script that did this wasn't committed.

What to do

  • Add a test-based script (e.g. mobile/tool/screenshots_test.dart, not run by default flutter test) that renders the main screens (sign-in, register, chat list, chat, group chat, contact and group info, new chat, settings pages) with sample data.
  • Load the bundled Inter font and Material Icons, so text renders properly instead of the test font.
  • Choose themes and sizes by environment variables, e.g. THEMES=frost,nebula, and write the PNGs to a folder outside the repo.
  • Document how to run it in CONTRIBUTING.md, for UI pull requests.

Where to look

mobile/test/ui_smoke_test.dart already sets up the providers and sample data; mobile/assets/fonts/Inter/.

Good to know

Capture with a RepaintBoundary around the app and toImage() inside tester.runAsync. Screens with entrance animations need a few seconds of pump first.

Linguagem predominante
Dart
Estrelas
9
Forks
5
Merge médio
49min
PRs com merge (30d)
34

Preparar o ambiente

  • Inclui um Dockerfile ou arquivo Docker Compose
  • Sem modelo de pull request
  • Sem guia de contribuição

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de CommandLineCoding/Elephant

Todas as issues de CommandLineCoding/Elephant

Issues semelhantes

Mais issues de Dart

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.