2

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/

chick3n0x07CC
  • 678
  • 2
  • 10
  • 30

1 Answers1

3

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.

giovannipds
  • 2,860
  • 2
  • 31
  • 39