Question

I need a MenuBar on the left side of my screen that can slide in and out. As this app is crossplattform it should be on the left side and not like the usual ApplicationBar on the Bottom or NavigationBar on Top.

What I have so far is:

private bool isTapped = false;
        private void TEST_TAP(object sender, TappedRoutedEventArgs e)
        {
            System.Diagnostics.Debug.WriteLine("TAP");

            Storyboard s = new Storyboard();

            DoubleAnimation doubleAni = new DoubleAnimation();

            doubleAni.To = -30;
            if (isTapped) doubleAni.To = 0;

            doubleAni.Duration = new Duration(TimeSpan.FromMilliseconds(500));

            Storyboard.SetTarget(doubleAni, LOGO);
            Storyboard.SetTargetProperty(doubleAni, "(UIElement.RenderTransform).(TranslateTransform.XProperty)");

            s.Children.Add(doubleAni);
            s.Begin();
        }

The bar I want to move is a Grid or should be something similar. But this even fails to move a single Image. I googled a bit and replaced "(UIElement.RenderTransform).(TranslateTransform.XProperty)" with "(Canvas.Left)". This doesn't crash but also doesn't move anything else. Any ideas or solutions?

EDIT: Well I played around a lot and now I know (and tested it) that "(Canvas.Left)" only works inside of a Canvas. Yay. My App looks like this: Scrollview (horizontal) and inside is a Grid with columns to display different stuff. The left-most Column contains another Grid that I want to move out of the screen and back in again. But how do I move a grid with Storyboard-animation?

If anybody thinks of a different way to do this, I'm totally happy if it works in any way.

EDIT2: It seems to be THE way to use Storyboard.SetTargetProperty(doubleAni, "(UIElement.RenderTransform).(CompositeTransform.TranslateX)"); but it keeps crashing =/

Was it helpful?

Solution

Before using this transform you need to add it:

Storyboard s = new Storyboard();

DoubleAnimation doubleAni = new DoubleAnimation();

doubleAni.To = to;
doubleAni.From = from;
doubleAni.Duration = new Duration(TimeSpan.FromMilliseconds(250));

// THIS LINE IS NEW
NaviBar.RenderTransform = new CompositeTransform();

Storyboard.SetTarget(doubleAni, NaviBar);
Storyboard.SetTargetProperty(doubleAni, "(UIElement.RenderTransform).(CompositeTransform.TranslateX)");

s.Children.Add(doubleAni);
s.Begin();

This does the trick. It's still not the functionality that I wanted but the hardest part - the animation - works now.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top