f7-Expandable card - swipeToClose issue

I use a f7-expandable card to set the temperature for my thermostat.
By moving up/down the slider, the temperature can be set.
The swipeToClose parameter is enabled, which causes some issue when decreasing the temperature.
In this case, the card size degrease which makes use of the slider less user friendly.

Is it possible to exclude the slider from “swipe to close” feature?

Many thanks :slight_smile:

If I understand what you’re saying then I don’t think there’s any configuration you can set to change this behavior. The swipeToClose and the slider are simply responding to the same event.

There aren’t too many good options here if you really want to keep the swipeToClose feature. You could try to rearrange your card to have a slightly larger area that doesn’t have the slider on it. Other than that I can’t think of anything that doesn’t just cancel out the convenience of having the swipteToClose (such as a button that locks the slider, but why push a button and then swipe when you could just push a button?).

another option would be to use a oh-knob

Hello @JustinG - Happy New Year.
Sorry for not being more clear with my initial question.
As far as I understood your reply, the issue is exactly the opposite.

The issue is with the gesture used to move down the slider.
By moving down the slider, not only the slider value gets decreased, but also the Card size itself gets decreased as in my screenshot.

I was looking for an option to ignore the SwipToClose gesture in the Slider area.

Moving down the slider should not trigger the SwipeToClose function.

Hope this makes it more clear :slight_smile:

@denominator - I used the oh-knob before, but want a controller style similar to Apple Home App. :wink:

The issue is the same either way. The pointer event is not just restricted to the slider, but is shared up and down the document tree. You can see the same thing if you put a button on an expandable f7-card. When you click the button, the card responds (in fact, my example of getting two oh actions out of a single button actually relies on this particular behavior). This isn’t something specific to OH or MainUI, is standard javascript event handling.

There are ways to prevent the event from “bubbling” like this but you don’t have access to them via the widget system; that has to happen as the level of the component’s javascript (in this case, I would think the f7 library, not just the the oh-slider definition).

These are, for the foreseeable future, probably incompatible functions and you’re going to have to choose between the slider and the swipe-to-close.

1 Like

thanks a lot for the explanation - at least I’m not doing something wrong, it works as designed :slight_smile: