Search code examples
c#wpfstoryboardinvalidoperationexception

WPF storyboard begin - Error


I get the following error at the line sb.Begin(leftMenu); (sb is a storyboard):

System.InvalidOperationException: 'Cannot resolve all property references in the property path 'margin'. Verify that applicable objects support the properties.'

The XAML Code:

<Window x:Class="_10KHours.sliding"
    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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:_10KHours"
    mc:Ignorable="d"
    Title="sliding" Height="500" Width="500">
<Window.Resources>
    <Storyboard x:Key="showMenu">
        <ThicknessAnimation Storyboard.TargetProperty="margin" From="-150,0,0,0" To="0,0,0,0" DecelerationRatio="0.8" Duration="0:0:1"/>
    </Storyboard>
    <Storyboard x:Key="hideMenu">
        <ThicknessAnimation Storyboard.TargetProperty="margin" From="0,0,0,0" To="-150,0,0,0" DecelerationRatio="0.8" Duration="0:0:1"/>
    </Storyboard>
</Window.Resources>
<Grid>
    <StackPanel Panel.ZIndex="2" Name="leftMenu" Orientation="Horizontal" HorizontalAlignment="Left" Margin="-150,0,0,0">
        <Border BorderBrush="AliceBlue" BorderThickness="1" Width="150" Background="AliceBlue">

        </Border>
    </StackPanel>
    <Grid>
        <Button Name="btnHide" Width="50" Click="btnHide_Click" Content="Hide" Visibility="Hidden"/>
        <Button Name="btnShow" Width="50" Click="btnShow_Click" Content="Hide" Visibility="Visible"/>
    </Grid>
</Grid>

The C# Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using System.Windows.Media.Animation;

namespace _10KHours
{
    /// <summary>
    /// Interaction logic for sliding.xaml
    /// </summary>
    public partial class sliding : Window
    {
        public sliding()
        {
            InitializeComponent();
        }

        private void btnHide_Click(object sender, RoutedEventArgs e)
        {
            menuSlide("showMenu",btnHide,btnShow,leftMenu);
        }

        private void menuSlide(string p, Button btnHide, Button btnShow, StackPanel leftMenu)
        {
            //throw new NotImplementedException();
            Storyboard sb = FindResource(p) as Storyboard;
            sb.Begin(leftMenu);
            if(p.Contains("show"))
            {
                btnHide.Visibility = Visibility.Visible;
                btnShow.Visibility = Visibility.Hidden;
            }
            else
            {
                if (p.Contains("hide"))
                {
                    btnHide.Visibility = Visibility.Hidden;
                    btnShow.Visibility = Visibility.Visible;
                }
            }  
        }

        private void btnShow_Click(object sender, RoutedEventArgs e)
        {
            menuSlide("hideMenu", btnHide, btnShow, leftMenu);
        }
    }
}

Solution

  • Error you are getting is because margin is not a Valid property use -> Margin instead

        <Window.Resources>
        <Storyboard x:Key="showMenu">
            <ThicknessAnimation Storyboard.TargetProperty="Margin" From="-150,0,0,0" To="0,0,0,0" DecelerationRatio="0.8" Duration="0:0:10"/>
        </Storyboard>
        <Storyboard x:Key="hideMenu">
            <ThicknessAnimation Storyboard.TargetProperty="Margin" From="0,0,0,0" To="-150,0,0,0" DecelerationRatio="0.8" Duration="0:0:10"/>
        </Storyboard>
    </Window.Resources>
    <Grid>
        <StackPanel Panel.ZIndex="2" Name="leftMenu" Orientation="Horizontal" HorizontalAlignment="Left" Background="Yellow" Margin="-150,0,0,0">
            <Border BorderBrush="AliceBlue" BorderThickness="1" Width="150" Background="AliceBlue">
    
            </Border>
        </StackPanel>
        <Grid>
            <Button Name="btnHide" Width="50" Click="btnHide_Click" Content="Hide" Visibility="Hidden"/>
            <Button Name="btnShow" Width="50" Click="btnShow_Click" Content="Hide" Visibility="Visible"/>
        </Grid>
    </Grid>