Posso separar o painel de design do painel XAML no Visual Studio?


83

É possível separar a janela WPF que estou criando de seu código XAML? Clicar duas vezes em qualquer arquivo XAML irá abri-lo e mostrar o código XAML e a janela WPF em uma janela, dividindo-os horizontalmente ou verticalmente, mas ainda ambos estão em uma janela. Eu tenho 4 monitores e o código XAML que escrevo tem linhas longas, então gostaria de editar o código XAML em um monitor sozinho e visualizar a janela WPF em outro, mas dividi-los em duas janelas diferentes não parece possível.

Algumas soluções alternativas que eu posso fazer, mas não gosto, são:

  1. Desencaixe todo o editor XAML com o designer e redimensione essa janela em dois monitores para que o código XAML fique em um monitor e a janela WPF em outro.
  2. Use "Abrir com ..." para abrir um segundo editor do mesmo documento XAML, mas o realce do código e o realce da janela WPF não são sincronizados.

Então, é possível dividi-los? Ou talvez você tenha uma solução alternativa melhor do que a minha?


2
Esta postagem do blog do msdn (dica 10) parece sugerir que as duas soluções alternativas que você já conhece são a solução oficial. blogs.msdn.com/b/wpfsldesigner/archive/2010/06/30/…
— Chris Petheram

14
É triste que após 4 anos eles ainda não tenham implementado esse recurso. As configurações de vários monitores têm sido comumente usadas há pelo menos 10 anos.
— Plain Coder

2
6 anos agora, eu me pergunto se algo mudou
— Ateik

1
@PlainCoder Mais como 20 anos.
— John Stock

1
2019 aqui estamos e ainda não implementado: D
— Zeta

Respostas:


79

Eu tive esse mesmo problema, então encontrei uma maneira de separá-lo assim,

  • Clique com o botão direito do mouse no arquivo XAML no gerenciador de soluções e selecione Abrir com ;
  • selecione Editor de código-fonte (texto) (em vez do editor XML (texto) ).

Isso cria uma guia separada para o editor de origem XAML, basta desencaixá-la e criar uma nova janela.


6
Você leu minha segunda solução alternativa acima? É exatamente o que você sugere.
— Plain Coder

1
@PlainCoder, só quero confirmar que no VS2015 isso funciona muito bem e conforme o esperado - com realces de sintaxe (mesmo com realces ReSharper 10) e totalmente sincronizado. Parece que agora é seguro aceitar esta resposta.
— Sevenate

Posso confirmar que isso também funciona no VS2013 como @Sevenate descreve.
— Kidiskidvogingogin

1
@Sevenate Meu visual studio 2015 não funciona como esperado e não sincroniza os destaques de sintaxe.
— Steve.NayLinAung

3
é sincronizado no sentido de que você faz uma alteração e a outra janela é atualizada - mas infelizmente você não pode clicar em um item para ver o elemento ou código correspondente na outra janela :-(
— Simon_Weaver

12

Clique no botão de seta dupla que fica do lado direito do código XML.

Clicar em uma dessas opções separará o XAML e o Design em dois painéis separados na mesma janela. A partir daí, os painéis podem ser alternados.

Para restaurar a configuração original, clique no >>botão de seta dupla novamente.

Essas opções são destacadas abaixo:

Opções de alternância XAML / Design


3

O Visual Studio 2017 tem um novo modo 'Editar e continuar' para XAML que é realmente incrível e para mim removeu a necessidade dessa funcionalidade de 'divisão'.

https://blogs.msdn.microsoft.com/visualstudio/2016/04/06/ui-development-made-easier-with-xaml-edit-continue/

Você pode literalmente digitar o XAML e fazer com que o aplicativo em execução seja atualizado instantaneamente - então, coloque isso na tela que desejar.

Minha edição do Visual Studio para XAML tornou-se extremamente lenta e as atualizações agora são instantâneas e ocorrem dentro do aplicativo em execução real - tornarão o desenvolvimento muito mais rápido.


Não é exatamente uma solução completa, já que as pessoas precisam clicar na representação da IU e ir para o XAML.
— j riv

Além disso, editar e continuar para XAML não é capaz de lidar com todas as edições. Por exemplo, incluir um Dicionário em um MergedDictionary ou adicionar DataTemplates nem sempre parece funcionar.
— Mike de Klerk

Além disso, você não pode aumentar o zoom
— Ateik,

0

Use a opção XAML pop-up ao lado de Painéis de design e XAML, que abrirá o editor XAML em uma nova janela, que pode ser movida para outra tela. Os realces do elemento não funcionarão, mas as alterações serão refletidas instantaneamente.


-2

Se você tiver duas telas, divida a janela do designer verticalmente, desencaixe a janela do Visual Studio e redimensione a janela para que a largura se estenda por suas telas duplas.


— Essa
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.