Developer Tools

AlignmentGrid XAML-kontroll

AlignmentGrid Control kan användas för att visa ett rutnät som hjälper till att justera kontroller.

Du kan styra rutnätets steg med HorizontalStep och VerticalStep egenskaper. Linjefärg kan definieras med LineBrush egenskapen .

<!--  Licensed to the .NET Foundation under one or more agreements. The .NET Foundation licenses this file to you under the MIT license. See the LICENSE file in the project root for more information.  -->
<Page x:Class="DeveloperToolsExperiment.Samples.AlignmentGridSample"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:developerTools="using:CommunityToolkit.WinUI.DeveloperTools"
      xmlns:local="using:DeveloperToolsExperiment.Samples"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d">

    <Grid>
        <developerTools:AlignmentGrid HorizontalStep="{x:Bind HorizontalStep, Mode=OneWay}"
                                      Opacity="{x:Bind OpacitySetting, Mode=OneWay}"
                                      VerticalStep="{x:Bind VerticalStep, Mode=OneWay}" />
    </Grid>
</Page>

// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.

using CommunityToolkit.WinUI.DeveloperTools;

namespace DeveloperToolsExperiment.Samples;

[ToolkitSampleNumericOption("OpacitySetting", 0.2, 0.1, 1.0, 0.1, false, Title = "Opacity")]
[ToolkitSampleNumericOption("HorizontalStep", 20, 5, 100, 1, false, Title = "HorizontalStep")]
[ToolkitSampleNumericOption("VerticalStep", 20, 5, 100, 1, false, Title = "VerticalStep")]

[ToolkitSample(id: nameof(AlignmentGridSample), "AlignmentGrid", description: $"A sample for showing how to create and use a {nameof(AlignmentGrid)}.")]
public sealed partial class AlignmentGridSample : Page
{
    public AlignmentGridSample()
    {
        this.InitializeComponent();
    }
}

FocusTracker

FocusTracker Control Kan användas för att visa information om det aktuella fokuserade XAML-elementet (om det finns några).

FocusTracker visar följande information (när det är tillgängligt) om det aktuella fokuserade XAML-elementet:

• Name
• Type
• AutomationProperties.Name
• Namnet på det första överliggande objektet i hierarkin som har ett namn

<!--  Licensed to the .NET Foundation under one or more agreements. The .NET Foundation licenses this file to you under the MIT license. See the LICENSE file in the project root for more information.  -->
<Page x:Class="DeveloperToolsExperiment.Samples.FocusTrackerSample"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:developerTools="using:CommunityToolkit.WinUI.DeveloperTools"
      xmlns:local="using:DeveloperToolsExperiment.Samples"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d">

    <StackPanel Spacing="12">
        <TextBlock Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                   Style="{StaticResource CaptionTextBlockStyle}"
                   Text="Use the TAB key or mouse to set the focus on a UI element, and see the result in the Focus tracker below" />
        <developerTools:FocusTracker IsActive="{x:Bind IsActive, Mode=OneWay}" />
    </StackPanel>
</Page>

// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.

using CommunityToolkit.WinUI.DeveloperTools;

namespace DeveloperToolsExperiment.Samples;

[ToolkitSampleBoolOption("IsActive", true, Title = "IsActive")]

[ToolkitSample(id: nameof(FocusTrackerSample), "FocusTracker", description: $"A sample for showing how to create and use a {nameof(FocusTracker)}.")]
public sealed partial class FocusTrackerSample : Page
{
    public FocusTrackerSample()
    {
        this.InitializeComponent();
    }
}