Let’s start to add some controls to the page. Zoom in/out – Hold Ctrl + Two-finger drag on touch pad, or scroll wheel on mouse.Scroll left/right – Hold Shift + Two-finger drag on touch pad, or scroll wheel on mouse.Scroll up/down – Two-finger drag on touch pad, or scroll wheel on mouse.The other way that you can control the positioning of the design area is using the mouse: Expanding the dropdown allows you to select from a number of predefined zoom levels.Īlternatively you can select Fit all, or Fit selection, in order to bring the whole page into view. In the bottom left corner of the design surface there’s a series of icon buttons and a dropdown. Working at this zoom level will be quite hard as each of the elements will be small and hard to manipulate. If you look at the main design surface, you’ll note that the initial position of the MainPage is very small. Again, feel free to reposition them to suit how you work. You can easily switch to Blend by right-clicking on the project or a XAML file in Solution Explorer and selecting Design in Blend.Īs you can see the tool windows are labeled slightly differently in Blend and have a different default position. Blend still retains a number of designer oriented features, such as creating visual states and animations with storyboards, that haven’t been exposed in the Visual Studio designer. It’s worth noting that the designer experience in Visual Studio and Blend is very similar – Microsoft made the decision years ago to build a consistent experience with the majority of functionality now available in both tools. Switching between Visual Studio and Blend also gives me a mental switch to go between designer mode (well at least “layout-oriented work” mode, since I’m clearly not a designer) and developer mode. I prefer to do any designer work in Blend because I prefer to have the tool windows in a different position when doing design work, than when writing code. We’re actually going to switch across to Blend for Visual Studio for the rest of this post. I find this layout works well for working with the designer but you can easily customise the layout of the tool windows to suit how you work. Here you can see that I have the Toolbox on the left of the design surface and the Properties window, above the Solution Explorer, on the right side. If not, find MainPage.xaml in the Solution Explorer tool window and double-click it to open it. Once created, depending on your setup of Visual Studio, you’ll probably have the MainPage.xaml already open. Ok, so let’s start by creating ourselves a new Windows (UWP) project based on the Blank App (Universal Windows) template.Īs usual, give the project a name to get started – you’ll be prompted to pick which target and minimum versions of Windows you want but for the purpose of this post I just went with the defaults. All these platforms are available via the Uno platform – If you’re new to the Uno Platform, head over to and get started with building cross-platform mobile, desktop and Web applications. One of the reasons that the designer experience in Visual Studio and Blend is so relevant is that you can take the design you’ve done for your Windows app and port it across to iOS, Android, MacOS and even the web (using Web Assembly). Note that this isn’t an exhaustive list by any means – would love feedback on what other features you use and what you think is missing in the designer. I figured I would take this opportunity to go through and document some of the features that I use and some of the new features that have appeared in the previews. If you’ve been looking at the release notes for the Visual Studio previews, you’ll have noted that there’s some work being done on the XAML designer that now supports both WPF and UWP.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |