Transições de janela de rastreamento usando o Winscope

O Winscope é uma ferramenta da Web que permite aos usuários gravar, reproduzir e analisar os estados de vários serviços do sistema durante e após animações e transições. O Winscope registra todos os estados de serviço do sistema pertinentes em um arquivo de rastreamento. Usando a interface do Winscope com o arquivo de rastreamento, é possível inspecionar o estado desses serviços para cada frame de animação, com ou sem uma gravação de tela, reproduzindo, passo a passo e destravando as transições.

Os serviços do sistema que produzem rastros que podem ser carregados no Winscope são os seguintes:

  • SurfaceFlinger
  • WindowManager
  • WMShell
  • IME
  • Tela de início

Executar o visualizador de rastros do Winscope

O rastreamento do Winscope faz parte dos serviços da plataforma. Esta seção descreve as etapas necessárias para fazer o download, criar e executar o visualizador de rastros do Winscope.

Siga estas etapas para configurar o PC para executar o rastreador do Winscope:

  1. Faça o download da origem do Android.
  2. Navegue até a pasta do Winscope:

    cd development/tools/winscope
    
  3. Instale as dependências usando:

    npm install
    

    Para conferir uma lista dos comandos disponíveis, execute: npm run

  4. Crie todos os destinos de produção e teste usando:

    npm run build:prod
    
  5. Execute o Winscope usando:

    npm run start
    

Capturar rastros

É possível capturar rastros no dispositivo usando o Winscope ou os comandos do Android Debug Bridge (adb).

Capturar rastros no dispositivo

Capture rastros no dispositivo para coletar dados ao registrar bugs para problemas de animação. Todos os traces de interface são gravados com esse método, porque a configuração não pode ser personalizada.

No dispositivo Android:

  1. Ative as Opções do desenvolvedor.
  2. Selecione Rastreamento do sistema em "Opções do desenvolvedor".
  3. Ative a opção Coletar rastros do Winscope.
  4. Em Diversos:
    1. Ative Anexar gravações a relatórios de bugs.
    2. Ative a opção Mostrar bloco de Configurações rápidas.
  5. Navegue até o local onde você precisa reproduzir o bug.
  6. Para iniciar a captura, abra as Configurações rápidas e selecione Gravar rastreamento:

    Quick_setting_winscope

    Figura 1. Menu de configurações rápidas com o recurso "Record Trace".

  7. Execute apenas as etapas necessárias para reproduzir o bug.

  8. Para interromper a captura, abra as Configurações rápidas e selecione Parar rastreamento.

  9. Compartilhe o registro capturado usando uma das opções listadas, como Gmail, Drive ou BetterBug.

Capturar rastros pelo Winscope

Você pode capturar rastros usando o Winscope para desenvolvimento e depuração locais. O Winscope usa o adb, que oferece suporte à conexão do dispositivo por USB ou Wi-Fi.

No Winscope:

  1. Na tela Collect Traces, clique em ADB Proxy:

    capture_traces_winscope

    Figura 2. Capture rastros no Winscope.

  2. Inicie o proxy do Winscope ADB Connect para capturar rastros diretamente do navegador.

  3. Execute o comando:

    python3 $ANDROID_BUILD_TOP/development/tools/winscope/src/adb/winscope_proxy.py
    
  4. Para iniciar a captura, na tela Collect Traces, selecione os destinos e a configuração e clique em Start trace:

    collect_traces_winscope

    Figura 3. Coletar rastros no Winscope.

  5. Para interromper a captura, clique em End trace:

    end_trace_winscope

    Figura 4. Finalizar rastreamento no Winscope.

À medida que a ferramenta carrega os rastros na IU do Winscope, as mensagens Buscando e Análise de arquivos Proto são exibidas na tela.

Gerar o despejo de estado usando o Winscope

Para fazer um despejo de estado usando o Winscope, na tela Collect Traces, selecione a guia Dump e clique em Dump state:

dump-winscope

Figura 5. Estado de despejo no Winscope.

Capturar rastros usando comandos adb

Execute adb root antes de executar os comandos adb shell para cada um dos seguintes rastros. No final do rastreamento, os arquivos de rastreamento ficam disponíveis em /data/misc/wmtrace. Para copiar um arquivo ou diretório e os subdiretórios dele de um dispositivo, consulte Copiar arquivos de e para um dispositivo. Consulte adb para mais informações.

Rastros do WindowManager

Para capturar traces da WindowManager:

  • Ativar rastreamento:

    adb shell wm tracing start
    
  • Desativar o rastreamento:

    adb shell wm tracing stop
    
  • Salve os dados de registro em um arquivo durante a execução de uma captura de rastro:

    adb shell wm tracing save-for-bugreport
    
  • Registrar rastreamento uma vez por frame:

    adb shell wm tracing frame
    
  • Registre cada transação:

    adb shell wm tracing transaction
    
  • Defina o tamanho máximo do registro (em KB):

    adb shell wm tracing size
    
  • Status do rastro de impressão:

    adb shell wm tracing status
    
  • Defina o nível de registro como critical (somente janelas visíveis com informações reduzidas), trim (todas as janelas com informações reduzidas) ou all (todas as janelas e informações):

    adb shell wm tracing level
    

ProtoLog

Os comandos a seguir são usados para o sistema ProtoLog.

No processo system_server:

  • Inicie o ProtoLog:

    adb shell cmd window logging start
    
  • Pare o ProtoLog:

    adb shell cmd window logging stop
    
  • Ative o ProtoLog para determinados grupos de registros:

    adb shell cmd window logging enable [group...]
    
  • Desative o ProtoLog para determinados grupos de registro:

    adb shell cmd window logging disable [group...]
    
  • Ative a geração de registros do Logcat para determinados grupos de registros:

    adb shell cmd window logging enable-text [group...]
    
  • Desative a geração de registros do Logcat para determinados grupos de registros:

    adb shell cmd window logging disable-text [group...]
    

No WMShell:

  • Inicie o ProtoLog:

    adb shell dumpsys activity service SystemUIService WMShell
    

Rastreamento de transição

Os comandos a seguir são usados para o rastreamento de transição:

No processo system_server:

  • Inicie um trace:

    adb shell cmd window shell tracing start
    
  • Interromper um rastro:

    adb shell cmd window shell tracing stop
    
  • Inicie um rastro no WMShell:

    adb shell dumpsys activity service SystemUIService WMShell transitions tracing start
    
  • Interromper um rastro no WMShell:

    adb shell dumpsys activity service SystemUIService WMShell transitions tracing stop
    

Editor de método de entrada

Os comandos a seguir são usados para o rastreamento do editor de método de entrada (IME):

  • Inicie o rastreamento do IME para clientes de Método de entrada (IM, na sigla em inglês), Serviço de método de entrada (IMS, na sigla em inglês) e Serviço de Gerenciamento de método de entrada (IMMS, na sigla em inglês):

    adb shell ime tracing start
    
  • Comece a rastrear clientes IME, IMS e IMMS:

    adb shell ime tracing stop
    

Camadas do SurfaceFlinger

O rastreamento de camadas do SurfaceFlinger usa o rastro do Perfetto para captura. Para informações de configuração, consulte Configuração do trace.

Confira o exemplo a seguir de uma configuração para o rastreamento de camadas do SurfaceFlinger:

unique_session_name: "surfaceflinger_layers_active"
buffers: {
    size_kb: 63488
    fill_policy: RING_BUFFER
}
data_sources: {
    config {
        name: "android.surfaceflinger.layers"
        surfaceflinger_layers_config: {
            mode: MODE_ACTIVE
            trace_flags: TRACE_FLAG_INPUT
            trace_flags: TRACE_FLAG_COMPOSITION
            trace_flags: TRACE_FLAG_HWC
            trace_flags: TRACE_FLAG_BUFFERS
            trace_flags: TRACE_FLAG_VIRTUAL_DISPLAYS
        }
    }
}

Confira o comando de exemplo a seguir para gerar o rastreamento de camadas do SurfaceFlinger:

adb shell -t perfetto \
    -c - --txt \
    -o /data/misc/perfetto-traces/trace \

Transações do SurfaceFlinger

O rastreamento de transações do SurfaceFlinger usa o rastro do Perfetto para captura. Consulte Configuração de rastreamento para informações de configuração.

Consulte o exemplo abaixo de uma configuração do Perfetto para o rastreamento ativo do SurfaceFlinger:

unique_session_name: "surfaceflinger_transactions_active"
buffers: {
    size_kb: 1024
    fill_policy: RING_BUFFER
}
data_sources: {
    config {
        name: "android.surfaceflinger.transactions"
        surfaceflinger_transactions_config: {
            mode: MODE_ACTIVE
        }
    }
}
write_into_file: true
file_write_period_ms: 100

Confira o exemplo a seguir de uma configuração do Perfetto para o rastreamento contínuo do SurfaceFlinger:

unique_session_name: "surfaceflinger_transactions_continuous"
buffers: {
    size_kb: 1024
    fill_policy: RING_BUFFER
}
data_sources: {
    config {
        name: "android.surfaceflinger.transactions"
        surfaceflinger_transactions_config: {
            mode: MODE_CONTINUOUS
        }
    }
}

Consulte o comando de exemplo abaixo para gerar o rastreamento de transações do SurfaceFlinger:

    adb shell perfetto \
    -c - --txt \
    -o /data/misc/perfetto-traces/trace \

Gerar despejo de estado usando o adb

O Winscope lê um snapshot dos estados da WindowManager e do SurfaceFlinger de relatórios de bugs. Os relatórios de bugs armazenam os estados como arquivos proto separados na pasta proto. Para gerar os despejos de estado usando o adb, execute os seguintes comandos.

Para WindowManager:

adb exec-out dumpsys window --proto > window_dump.winscope

Para SurfaceFlinger:

adb exec-out dumpsys SurfaceFlinger --proto > sf_dump.winscope

Analisar rastros

Para depurar estados transitórios e inválidos que causam problemas de animação, o Winscope agrega diferentes arquivos de rastreamento, oferece pesquisa e visualização em frames e linhas do tempo e apresenta mensagens protobuf de maneira coerente. A análise de rastros no Winscope ajuda a identificar a camada, o frame e o estado exatos da ocorrência do bug.

Usar o Winscope

Depois de capturar rastros, analise-os no Winscope:

  1. Faça upload dos rastros salvos usando o painel à direita. Você pode remover ou fazer upload de mais rastros.

    upload_traces_winscope

    Figura 6. Faça upload de rastros no Winscope.

  2. Clique em Visualizar traces para visualizar os traces enviados. Guias para cada trace aparecem no painel superior da janela. Se o arquivo enviado tiver os traces relevantes, uma visualização flutuante do rastro de gravação de tela será sobreposta na tela.

    view_traces_winscope

    Figura 7. Visualize rastros no Winscope.

    Use a interface no painel superior da janela para renomear edit_name e fazer o download do trace download_trace enviado ou para enviar um novo.

  3. Navegue pelos rastros ao longo do tempo usando a ferramenta de controle deslizante no painel inferior da janela. Para aumentar a navegação, use os seguintes recursos, conforme mostrado na Figura 8:

    • Para navegar até um momento ou ocorrência específico, use o cursor (controle deslizante de tempo), as setas arrow_left_time para a esquerda e seta_para_direita_tempo para a direita na caixa de exibição de horário (canto inferior esquerdo) ou as setas para a esquerda e direita do teclado.
    • Para mostrar traços codificados por cores selecionados na linha do tempo, use o menu suspenso (à esquerda do controle deslizante de tempo). Por padrão, os três últimos traces visualizados usando as guias de trace são exibidos na linha do tempo.
    • Para ter uma visualização granular de todos os traces enviados, use a ferramenta de aumentar zoom_in_time ou diminuir o zoom zoom_out_time (no controle deslizante de tempo) ou role no teclado. Use o botão de redefinição para redefinir o nível de zoom.
    • Para uma visualização expandida da distribuição de traces ao longo do tempo, clique na seta para cima arrow_up_time [tempo_de_seta_para cima] (canto inferior direito).

    time_nav_winscope

    Figura 8. Navegação por tempo no Winscope.

    Na visualização expandida (Figura 9), selecione e aumente o zoom em períodos específicos para melhorar a inspeção:

    expand_time_winscope

    Figura 9. Linha do tempo expandida no Winscope.

  4. Para examinar os rastros, você pode conferir o estado do dispositivo com a gravação de tela. Para examinar um trace específico, clique na guia do trace relevante no painel superior da ferramenta.

    • Para o rastro Surface Flinger, três painéis mostram visualizações diferentes do rastro em um determinado período, conforme mostrado na Figura 10: sf_trace

      Figura 10. Rastro do Surface Flinger no Winscope.

      • Visualização de camadas: uma visualização em 3D das camadas em sobreposições retangulares. Os elementos da interface abaixo ajustam os retângulos para renderizar os elementos gráficos em termos de posição, tamanho, transformação e ordem z:

        • O controle deslizante Rotation (canto superior esquerdo da visualização "Layers") gira os retângulos em camadas para visualizá-los nos ângulos escolhidos.
        • O controle deslizante Espaçamento (no canto superior direito da visualização em camadas) ajusta o espaçamento entre as camadas para criar a visualização composta selecionada.
        • As ferramentas de zoom (canto superior direito da visualização em camadas) aumentam o zoom tempo_de_zoom e diminuem o zoom zoom_out_time nas camadas para uma melhor inspeção.
        • O botão de redefinição reset_sf (no canto superior direito da visualização em camadas) restaura as configurações da câmera para a visualização original.
        • Arraste os retângulos para facilitar o zoom.
      • Visualização de hierarquia: é a hierarquia completa das camadas.

        • Only visible (canto superior direito da visualização de hierarquia), quando selecionado, oculta camadas invisíveis da hierarquia para ajudar a visualizar os elementos na tela.
        • Plana (canto superior direito da visualização "Hierarquia"), quando selecionada, mostra a hierarquia como uma lista simplificada de camadas.
        • Mostrar diferença (canto superior esquerdo da visualização de hierarquia) é selecionada somente quando há uma transição de estado. Quando selecionada, a ferramenta compara o estado atual com o anterior. Um elemento novo é destacado em verde, um elemento excluído é destacado em vermelho e um elemento modificado é destacado em azul.
      • Visualização Propriedades: as propriedades da camada selecionada. O painel superior da visualização Properties contém informações somente sobre as propriedades principais, como Visibility, Geometry e Buffer. O painel inferior da visualização Properties contém um Proto Dump de todas as propriedades.

        • A caixa de seleção Mostrar diferenças (canto superior esquerdo da visualização "Propriedades") se comporta como na visualização Hierarquia.
        • Mostrar padrões (canto superior esquerdo da visualização "Propriedades"), quando selecionado, mostra os valores .proto padrão no Proto Dump. Por padrão, esses valores não são listados no Proto Dump. Os valores de proto padrão são retirados da definição do campo proto. Se um campo proto não tiver um valor padrão não nulo definido, os valores padrão de proto mostrados serão:
          • Strings: null
          • Números: 0
          • Valores booleanos: falso
          • Objetos: nulo

      A seleção entre as três visualizações e a gravação de tela é sincronizada, ou seja, todos os traces são atualizados de forma síncrona quando você navega para um ponto diferente no tempo. Para ver as propriedades de uma camada, selecione-a clicando nela na visualização "Hierarquia" ou no respectivo retângulo na visualização "Propriedades". Um retângulo roxo indica que um rastro de visualização está anexado a essa camada. Ao clicar duas vezes em uma camada roxa, a interface navega para mudar para a guia de visualização de rastro relevante.

    • Para o trace do gerenciador de janelas, três painéis exibem visualizações diferentes do rastreamento em um determinado período, conforme mostrado na Figura 11:

      • Visualização Windows: uma visualização em 3D das camadas.
      • Visualização Hierarquia: uma hierarquia completa das camadas.
      • A visualização Properties contém um Proto Dump de todas as propriedades.

      A seleção entre as três visualizações e a gravação de tela é sincronizada, ou seja, todos os traces são atualizados de forma síncrona quando você navega para um ponto diferente no tempo.

      wm_trace

      Figura 11. Trace do gerenciador de janelas no Winscope.

    • Para traces de Transactions, as transações entre o Surface Flinger e o Window Manager são apresentadas em formato de tabela, que pode ser pesquisado pelos IDs, tipo e texto exibidos, além de uma visualização de propriedades que mostra o despejo de proto. A seleção entre as duas visualizações e a gravação de tela é sincronizada:

      Rastreamento de transação

      Figura 12. Rastreamento de transações no Winscope.

    • Para traces de ProtoLog, as informações são apresentadas em um formato de tabela, que é pesquisável por tags, arquivos de origem e texto:

      protolog_trace

      Figura 13. Rastreamento do ProtoLog no Winscope.

    • Para rastros de Transições, uma lista de transições com o ID, o tipo, o tempo de envio, a duração e o status é mostrada junto com as propriedades da transição selecionada:

      trace_de_transições

      Figura 14. Rastreamento de transições no Winscope.