dashman
dashman

Reputation: 3028

Nativescript - how to get layout to open on a tap

I've got a StackLayout where one of the entries is a GridLayout of a fixed size. Normally this GridLayout is not visible.

On tapping a button, I'd like the GridLayout be made visible - but I'd like to animate it open - - like a menu open.

Any ideas?

Actually toggling visibility is not too bad - it seems to animate the open - any way to control the speed?

The close operation is maybe too fast for what I'm trying to achieve.

Upvotes: 0

Views: 234

Answers (1)

JoshSommer
JoshSommer

Reputation: 2618

You could animate the opacity of your grid. so when you click on it you would

// View is your gridView, this would hide it completely
view.opacity = 0;

// when you want to show it.
// fade in view.
view.animate({
        opacity: 1,
        duration: 250 
        }).then(() => {
            //Set the visibility to collapsed after the animation is complete 
            //I believe you will want to do this so that the surrounding views adjust accordingly. 
            view.visibility='collapse';
        }, (err) => {});

// when you want to hide it.
// fade out.
view.animate({
        opacity: 0,
        duration: 250 
        }).then(() => {
           view.visibility='visible';
        }, (err) => {});

You also may want to look into translate for you animations so you can move view down, left, up, right any way you want.

Upvotes: 1

Related Questions