winui-3windows-community-toolkitgridsplitter

Cursor Not Changing on GridSplitter - Community Toolkit


Trying out the Community Toolkit GridSplitter, but the cursor does not change when I hover over the splitter bar. Changing the GripperCursor or CursorBehavior properties has no effect. It stays with the default cursor.

It resizes the panes when clicked and dragged, but the mouse cursor does not behave as expected.

I am using packages WindowsAppSDK 1.3.2305,
CommunityToolkit.WinUI.UI 7.1.2 and CommunityToolkit.WinUI.UI.Controls.Layout 7.1.2

<Page
    x:Class="AppPrototypes.Views.GridSplitter"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:AppPrototypes.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:controls="using:CommunityToolkit.WinUI.UI.Controls"
    mc:Ignorable="d"
    >

    <Grid >
        <Grid.RowDefinitions>
            <RowDefinition MinHeight="100"  />
            <RowDefinition Height="Auto"/>
            <RowDefinition MinHeight="100"/>
        </Grid.RowDefinitions>
       
        <Grid Grid.Row="0">
            <TextBlock Margin=" 10 10 0 0" Text="Top Row.    
                       This text to simulate the resizing feature of the Grid" />
        </Grid>
        
        <controls:GridSplitter Grid.Row="1"
            GripperCursor="UniversalNo"
            CursorBehavior="ChangeOnGripperHover"  />

        <Grid Grid.Row="2">
            <TextBlock Text="Bottom Row.     
                       This text to simulate the resizing feature of the Grid" />
        </Grid>
    </Grid>
</Page>

Solution

  • I'm not sure but I guess the cursor of the GridSplitter doesn't work on WinUI 3 apps.

    You should try the GridSplitter from the CommunityToolkit.Labs.WinUI.SizerBase NuGet package. I can confirm that its cursor works.

    1. Add a new NuGet package source.

      Feed URL: https://pkgs.dev.azure.com/dotnet/CommunityToolkit/_packaging/CommunityToolkit-Labs/nuget/v3/index.json

    2. Temporarily, disable other package sources, including nuget.org. I don't know why but I couldn't install the CommunityToolkit.Labs.WinUI.SizerBase with other sources enabled.

    3. Enable Include prerelease.

    4. Add the CommunityToolkit.Labs.WinUI.SizerBase package.

    And use it like this:

    <Page
        x:Class="GridSplitterExample.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:controls="using:CommunityToolkit.Labs.WinUI"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:local="using:GridSplitterExample"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
        mc:Ignorable="d">
    
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition MinHeight="100" />
                <RowDefinition Height="Auto" />
                <RowDefinition MinHeight="100" />
            </Grid.RowDefinitions>
    
            <Grid Grid.Row="0">
                <TextBlock
                    Margin="10,10,0,0"
                    Text="Top Row." />
            </Grid>
    
            <controls:GridSplitter
                Grid.Row="1"
                Cursor="UniversalNo" />
    
            <Grid Grid.Row="2">
                <TextBlock Text="Bottom Row." />
            </Grid>
        </Grid>
    </Page>