Change xaml properties with commands

Question

I want to open and close the splitview.pane with commands. This is my sample xaml-code:

<SplitView Name="AppNavigation" DisplayMode="CompactOverlay" IsPaneOpen="False" CompactPaneLength="50" OpenPaneLength="200">
    <SplitView.Pane>
        <Button Name="Hamburger" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" FontSize="24" Width="50" Height="50" Command="{Binding HamburgerExecute}" />
    </SplitView.Pane>
</SplitView>

I use a RelayCommand class and call these two methods:

    private bool HamburgerCanExecute(object obj)
    {
        return true;
    }

    private void HamburgerExecute(object obj)
    {
        AppNavigation.IsPaneOpen = !AppNavigation.IsPaneOpen; // this doesn't work
    }

Can someone explain to me how I use commands to change xaml properties?

Have you tried to debug the code? Is the program entering your command? As you are using binding - have you set the datacontext? — Romasz, Feb 11 '17 at 10:34
Possible duplicate of [How to bind WPF button to a command in ViewModelBase?](http://stackoverflow.com/questions/12422945/how-to-bind-wpf-button-to-a-command-in-viewmodelbase) Not entirely the duplicate but boils down to the same problem. (How to bind commands) — CSharpie, Feb 11 '17 at 10:38
You say you use a `RelayCommand` class which, I assume, implements `ICommand`. Do you bind to this command ? It looks like you bind to a method. — Blacktempel, Feb 11 '17 at 13:21

score 1 · Accepted Answer · answered Feb 12 '17 at 21:42

I forgot to integrate UI namespaces ... damn

So the correct code is:

private void HamburgerExecute(object obj)
{
    SplitView navigation = obj as SplitView;
    navigation.IsPaneOpen = !navigation.IsPaneOpen;
}

And CommandParameter in my xaml file:

<SplitView Name="AppNavigation" DisplayMode="CompactOverlay" IsPaneOpen="False" CompactPaneLength="50" OpenPaneLength="200">
    <SplitView.Pane>
        <Button Name="Hamburger" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" FontSize="24" Width="50" Height="50" Command="{Binding HamburgerCommand}" CommandParameter="{Binding ElementName=AppNavigation}" />
    </SplitView.Pane>
</SplitView>

score 0 · Answer 2 · answered Feb 11 '17 at 13:36

0

It looks like you're directly binding the method to your Button, but you stated that you are using RelayCommand. Please make sure that you're binding the RelayCommand and not the actual method.

Hope it helps!

answered Feb 11 '17 at 13:36

mindOfAi

4,412
2
16
27

Thanks that was still a mistake, but how can I now manipulate IsPaneOpen? AppNavigation is not known in this context. – r01f Feb 11 '17 at 22:53

score 0 · Answer 3 · answered Feb 12 '17 at 12:53

Create a click-event in your button.

<SplitView Name="AppNavigation" DisplayMode="CompactOverlay" IsPaneOpen="False" CompactPaneLength="50" OpenPaneLength="200">
<SplitView.Pane>
    <Button Name="Hamburger" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" FontSize="24" Width="50" Height="50" Click="Hamburger_Click />
</SplitView.Pane>

C#:

private void Hamburger_Click(object sender, RoutedEventArgs e)
    {
        AppNavigation.IsPaneOpen = !AppNavigation.IsPaneOpen;
    }

Thanks for your answer, but I want to use commands and mvvm pattern. A click-event in the code-behind ist therefore not an option for me. — r01f, Feb 12 '17 at 14:06

Change xaml properties with commands

3 Answers3