[SOLVED] How to know if Ionic split pane is opened or closed?

How to know if Ionic split pane is opened or closed?

I'm trying to adjust some CSS properties depending on the state of the split pane, I mean, if it is opened or closed. I can detect when its state changes using ionChange event on the view, but I can't know if it was opened or closed. Is there a way to do this?

Split Pane documentation: https://ionicframework.com/docs/api/components/split-pane/SplitPane/

Solution

I was looking for the same behavior and found this. Here's an example:

<ion-split-pane (ionChange)="onSplitPaneChange($event)">
    ...
</ion-split-pane>

And in your component:

onSplitPaneChange(e) {
    if (e._visible) {
        // desktop
    } else {
        // mobile
    }
}

This was tested for Ionic 3.

According to Redwolf, on Ionic 4 you'll have to read e.detail.visible instead of e._visible (I didn't try it myself yet - comment if you did). The rest may remain and works the same way though.