You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/designers/creating-a-ui-by-using-xaml-designer-in-visual-studio.md
+7-4Lines changed: 7 additions & 4 deletions
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
---
2
-
title: Creating a UI by using XAML Designer in Visual Studio
3
-
ms.date: 07/17/2017
2
+
title: Creating a UI with XAML Designer
3
+
ms.date: 11/05/2018
4
4
ms.prod: visual-studio-dev15
5
5
ms.technology: vs-ide-designers
6
6
ms.topic: conceptual
@@ -16,7 +16,7 @@ manager: douge
16
16
ms.workload:
17
17
- "uwp"
18
18
---
19
-
# Creating a UI by using XAML Designer in Visual Studio
19
+
# Create a UI by using XAML Designer in Visual Studio
20
20
21
21
The XAML Designer in Visual Studio provides a visual interface to help you design XAML-based Windows and Web apps. You can create user interfaces for your apps by dragging controls from the **Toolbox** and setting properties in the **Properties** window. You can also edit XAML directly in XAML view.
22
22
@@ -102,6 +102,9 @@ Markup zoom enables you to size **XAML** view. You can zoom from 20% to 400%.
102
102
103
103
## Device window
104
104
105
+
> [!NOTE]
106
+
> If the target platform version (`TargetPlatformVersion`) of a UWP application is 10.0.16299.0 or higher, **Device Window** is not available.
107
+
105
108
The **Device** window in XAML Designer enables you to simulate at design-time various views, displays, and display options for your project. The **Device** window is available on the **Design** menu when you are working in the XAML Designer. Here's what it looks like:
There are various options at the top of the **Properties** window. You can change the name of the currently selected element by using the **Name** box. In the upper-left corner, there's an icon that represents the currently selected element. To arrange the properties by category or alphabetically, click **Category**, **Name**, or **Source** in the **Arrange by** list. To see the list of events for a control, click the **Events** button, which displays a lightning bolt symbol. To search for a property, start to type the name of the property in the **Search Properties** box. The **Properties** window displays the properties that match your search as you type. Some properties allow you to set advanced properties by selecting a down arrow button. For more information on using properties and handling events, see [Quickstart: Adding controls and handling events](http://go.microsoft.com/fwlink/?LinkID=247983)
190
+
There are various options at the top of the **Properties** window. You can change the name of the currently selected element by using the **Name** box. In the upper-left corner, there's an icon that represents the currently selected element. To arrange the properties by category or alphabetically, click **Category**, **Name**, or **Source** in the **Arrange by** list. To see the list of events for a control, click the **Events** button, which displays a lightning bolt symbol. To search for a property, start to type the name of the property in the **Search Properties** box. The **Properties** window displays the properties that match your search as you type. Some properties allow you to set advanced properties by selecting a down arrow button. For more information on using properties and handling events, see [Intro to controls and patterns](/windows/uwp/design/controls-and-patterns/controls-and-events-intro)
188
191
189
192
To the right of each property value is a *property marker* that appears as a box symbol. The appearance of the property marker indicates whether there's a data binding or a resource applied to the property. For example, a white box symbol indicates a default value, a black box symbol typically indicates that a local resource has been applied, and an orange box typically indicates a data binding has been applied. When you click the property marker, you can navigate to the definition of a style, open the data binding builder, or open the resource picker.
0 commit comments