Kompakta storlekar på kontroller

WinUI 3-kontroller är utformade med avstånd som är optimerade för beröringsinteraktion. För skrivbordsprogram där användare främst använder en mus eller ett tangentbord kan du använda en kompakt densitetsstil för att minska kontrollernas höjd och utfyllnad. Detta gör mer innehåll synligt på skärmen utan att användaren behöver rulla.

Kompakt storleksändring gäller för vanliga interaktiva kontroller som Button, CheckBox, ComboBox, TextBox, Slideroch andra.

Använd kompakt storlek på en sida

Lägg till resursordboken för kompakt storlek i sidans eller panelens resurser:

<Page.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Page.Resources>

Den här åsidosättningen gäller för alla kontroller på sidan. Du kan begränsa den till en specifik panel genom att placera resursordlistan i panelens Resources i stället för sidans Resources.

Använd kompakt storlek i hela appen

Om du vill använda kompakt storlek på alla sidor i programmet lägger du till resursordlistan i App.xaml:

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
            <ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

Important

Sammanfoga den kompakta ordlistan efterXamlControlsResources så att standardstorleksvärdena åsidosätts korrekt.

Växla storlek vid körning

Du kan växla till eller från kompakt storlek vid körning genom att lägga till eller ta bort resursordlistan från en panels resurser:

// Apply compact sizing
var compactDict = new ResourceDictionary
{
    Source = new Uri("ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml")
};
MyPanel.Resources.MergedDictionaries.Add(compactDict);

// Remove compact sizing (restore default sizing)
MyPanel.Resources.MergedDictionaries.Remove(compactDict);

Välja en densitet

Scenario Recommendation
Produktivitets- eller datainmatningsappar (tabeller, formulär, inställningar) Kompakt storlek
Konsumentappar eller appar som är utformade för pekinmatning Standardstorlek
Blandade appar med en inställningspanel Använd kompakt storlek endast för inställningspanelen

WinUI 3 tillhandahåller endast två densitetsnivåer: standard och kompakt. Det finns inget API för att ange ett godtyckligt densitetsvärde.

Öppna WinUI 3-galleriappen och se kompakt storleksändring i praktiken

WinUI 3-galleriikon WinUI 3-galleriappen innehåller interaktiva exempel på WinUI-kontroller och funktioner. Hämta appen från Microsoft Store eller bläddra i källkoden på GitHub.
  • Last updated on