chick3n0x07CC
chick3n0x07CC

Reputation: 798

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/

Upvotes: 2

Views: 1790

Answers (1)

giovannipds
giovannipds

Reputation: 3459

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.

Upvotes: 3

Related Questions