The WPF Designer offers two different views: the visual representation of the window and the XAML that implements the window. You can make changes to the window and its controls by either editing the XAML or changing elements on the design surface. Either way, the designer keeps both panes in sync.
You can configure the position and layout of the XAML and design panes in the following ways:
The Swap button swaps the positions of the XAML and design panes with one another.
Vertical Split button tiles the panes vertically.