spiegelp / MaterialDesignExtensions

Material Design Extensions is based on Material Design in XAML Toolkit to provide additional controls and features for WPF apps
https://spiegelp.github.io/MaterialDesignExtensions/
MIT License
754 stars 122 forks source link

ToggleButtons don't work in MaterialWindow.TitleTemplate #111

Closed thargy closed 4 years ago

thargy commented 4 years ago

I have spent all day trying to place the Hamburger menu toggle in the TitleTemplate to no avail. Eventually, I discovered even placing a dumb ToggleButton in the tile template results in a togglebutton that doesn't toggle, e.g. this is the code I can't get to work, even though placing the ToggleButton anywhere else does work.

   <mde:MaterialWindow.TitleTemplate>
        <DataTemplate>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100*" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <StackPanel
                    Grid.Column="0"
                    VerticalAlignment="Stretch"
                    Orientation="Horizontal">
                    <ToggleButton
                        VerticalAlignment="Center"
                        AutomationProperties.Name="HamburgerToggleButton"
                        IsChecked="{Binding Path=DataContext.ShowNavigation, RelativeSource={RelativeSource AncestorType={x:Type mde:MaterialWindow}}}"
                        Style="{StaticResource MaterialDesignHamburgerToggleButton}" />
                    <TextBlock
                        Margin="8,0,0,0"
                        VerticalAlignment="Center"
                        Style="{StaticResource WindowTitleTextBlockStyle}"
                        Text="{Binding Path=Title, RelativeSource={RelativeSource AncestorType={x:Type mde:MaterialWindow}}}" />
                </StackPanel>
                <StackPanel
                    Grid.Column="1"
                    VerticalAlignment="Stretch"
                    Orientation="Horizontal">
                    <Button x:Name="Settings" Style="{StaticResource WindowButtonStyle}">
                        <md:PackIcon
                            Kind="Settings"
                            Style="{StaticResource WindowButtonIconStyle}"
                            ToolTip="Open Settings" />
                    </Button>
                    <Button x:Name="Help" Style="{StaticResource WindowButtonStyle}">
                        <md:PackIcon
                            Kind="HelpCircle"
                            Style="{StaticResource WindowButtonIconStyle}"
                            ToolTip="Help" />
                    </Button>
                    <Border
                        Width="1"
                        Margin="0,4,8,4"
                        VerticalAlignment="Stretch"
                        Background="{Binding Path=BorderForegroundBrush, RelativeSource={RelativeSource AncestorType={x:Type mde:MaterialWindow}}}"
                        SnapsToDevicePixels="True" />
                </StackPanel>
            </Grid>
        </DataTemplate>
    </mde:MaterialWindow.TitleTemplate>

Even changing this to a simple toggle button

csharp
   <mde:MaterialWindow.TitleTemplate>
        ...
                    <ToggleButton /> <!-- Simple toggle -->

Results in a toggle button being displayed, but it does not respond to clicks, and doesn't actually toggle.

Any ideas?

spiegelp commented 4 years ago

@thargy Please add WindowChrome.IsHitTestVisibleInChrome="True" to your ToggleButton for receiving the mouse events. Otherwise the window frame will receive them.