Xamarin.Forms árvore visual dinâmica

  • Artigo

Você pode receber uma exibição em tempo real do código XAML em execução com a Árvore Visual Dinâmica. Ele mostra uma exibição de árvore dos elementos da interface do usuário do aplicativo em execução Xamarin.Forms .

Requisitos

  • Use Xamarin.Forms 5.0 ou mais recente.
  • Ter alterações apenas Recarga Dinâmica habilitadas (ela está habilitada por padrão).

Uso

Com os requisitos atendidos, depurar seu aplicativo e a janela Árvore Visual Dinâmica mostrará a hierarquia de interface do usuário do runtime do seu aplicativo.

  • Windows: por padrão, ele aparece à esquerda do IDE. Se você não o vir, use Depurar > a Árvore Visual do Windows > Live para mostrá-la.
  • Mac: por padrão, ele aparece à direita do IDE. Se você não o vir, use Exibir > Depurar Árvore Visual do Windows > Live para mostrá-la.

Use o modo de exibição de árvore para inspecionar a hierarquia de interface do usuário do runtime para seu aplicativo, expandindo/recolhendo nós para se concentrar em partes específicas da interface do usuário.

Barra de ferramentas da árvore visual dinâmica

A exibição de elementos XAML é simplificada por padrão usando o recurso Just My XAML . Alterne o botão Mostrar Apenas Meu XAML , na barra de ferramentas Árvore Visual Dinâmica, para mostrar todos os elementos da interface do usuário. Se você quiser, poderá desabilitar essa configuração em opções para sempre mostrar todos os elementos XAML.

Observação

Visual Studio para Mac atualmente não dá suporte ao recurso Just My XAML.

A estrutura do XAML tem muitos elementos em que você provavelmente não está diretamente interessado e, se você não conhece bem o código, pode ter dificuldade em navegar na árvore para encontrar o que está procurando. Portanto, a Árvore Visual Dinâmica tem várias abordagens que permitem que você use a interface do usuário do aplicativo para ajudá-lo a encontrar o elemento que deseja examinar.

Selecione o elemento no aplicativo em execução (atualmente com suporte apenas para aplicativos UWP). Você pode habilitar esse modo ao selecionar o botão à esquerda na barra de ferramentas Árvore Visual Dinâmica. Com esse modo ativado, você pode selecionar um elemento de interface do usuário no aplicativo e a Árvore Visual Dinâmica é atualizada automaticamente para mostrar o nó na árvore correspondente a esse elemento e suas propriedades.

Exibe adornos de layout no aplicativo em execução (atualmente com suporte apenas para aplicativos UWP). Você pode habilitar esse modo ao selecionar o botão imediatamente à direita do botão Habilitar seleção. Quando Exibir adornos de layout estiver ativado, a janela do aplicativo mostrará linhas horizontais e verticais ao longo dos limites do objeto selecionado para que você possa ver a que ele se alinha, bem como retângulos mostrando as margens.

Visualizar Seleção. Você pode habilitar esse modo selecionando o terceiro botão à esquerda na barra de ferramentas Árvore Visual Dinâmica. Esse modo mostra o XAML em que o elemento foi declarado, se você tiver acesso ao código-fonte do aplicativo.