ionic-native-transitions icon indicating copy to clipboard operation
ionic-native-transitions copied to clipboard

+1 Allow to set fixedPixelsBottom, fixedPixelsTop onfly

Open Sangd8 opened this issue 10 years ago • 8 comments

Can you make the options (fixedPixelsBottom, fixedPixelsTop) be changed dynamically onfly? Because there some screens has tab in the top, i dont want the transition include the tab too. Is it able to do this? Something like:

$ionicNativeTransitions.nextViewOptions({
   fixedPixelsBottom: 50,
   fixedPixelsTop: 100
});
$ionicNativeTransitions.stateGo('yourState', {}, {
    "type": "slide",
    "direction": "up", // 'left|right|up|down', default 'left' (which is like 'next')
    "duration": 1500, // in milliseconds (ms), default 400
});

But this adjustment only happen for the next transition like the $ionicHistory.nextViewOptions http://ionicframework.com/docs/api/service/$ionicHistory/

Sangd8 avatar Jan 20 '16 04:01 Sangd8

Have you tried using states?

.state('home', {
    url: '/home',
    nativeTransitions: {
        "type": "flip",
        "direction": "up",
        "fixedPixelsBottom": 50,
        "fixedPixelsTop": 100
    }
    templateUrl: "templates/home.html"
})

shprink avatar Jan 20 '16 04:01 shprink

It not working @shprink

Sangd8 avatar Jan 20 '16 06:01 Sangd8

it should, will try that tomorrow.

shprink avatar Jan 20 '16 06:01 shprink

@shprink It's working. But There 's a problem. I create an app. I set default fixedPixelsTop and fixedPixelsBottom default is 50 Then i create page A, and page B I set fixedPixelsTop page B is 100 in route configuration When i change page from page A to page B, the header will take 100 px and you will see the content of page A before the transition complete

Sangd8 avatar Jan 20 '16 07:01 Sangd8

Hi @shprink . I have add nextViewOptions method, please take a look on this PR, Merge it if you interesting. https://github.com/shprink/ionic-native-transitions/pull/62

daominhsangvn avatar Jan 22 '16 03:01 daominhsangvn

I definitely like the idea @daominhsangvn :)

Will check that later but your code looks great, good job.

shprink avatar Jan 22 '16 04:01 shprink

@shprink actually after much testing doesn't work, the setDefaultOptions fixedPixelsBottom always overrides everything else.

In default options I have fixedPixelsBottom: 0, and in states code:

.state('home', {
    url: '/home',
    nativeTransitions: {
        "type": "flip",
        "direction": "up",
        "fixedPixelsBottom": 50,
        "fixedPixelsTop": 100
    }
    templateUrl: "templates/home.html"
})

The bottom is always 0

tskweres avatar May 26 '16 01:05 tskweres

Correction, if you use native-ui-sref in the HTML, this overrides the app.js settings, and you must specify all of your settings there.

For example if I have fixedPixelsBottom specified in app.js, but not in native-ui-sref, the fixedPixelsBottom will not change.

tskweres avatar May 26 '16 01:05 tskweres