Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

question: possible collab #29

Open
tafelnl opened this issue May 3, 2024 · 3 comments
Open

question: possible collab #29

tafelnl opened this issue May 3, 2024 · 3 comments

Comments

@tafelnl
Copy link

tafelnl commented May 3, 2024

Nice plugin!

I was in need of a plugin that allowed me to use the edge-to-edge functionality on Android just as we're able to use it on iOS. I ended up writing this plugin: https://github.com/capacitor-community/safe-area

Only then I discovered your plugin. The approach is similar, however still a tad bit different. Some differences:

  • I only cared about detecting the native safe area insets on Android, because on iOS they (should) already work out of the box
  • I'm writing the CSS variables to the browser directly from the native side. So it's not needed to set any listeners on web or whatever to keep them in sync
  • I'm using WindowCompat - which supports older Android versions out of the box - preventing the need of if-else-structures and maintaining deprecated code.
  • I'm listening to safe area changes by using setOnApplyWindowInsetsListener
  • I'm taking into account to IME (keyboard) offsets. TBH, I haven't tested your implementation, but by the quick looks of it, that could be a bug in yours.
  • I'm calculating the insets in a way that's a bit different compared to your strategy. Refer to the code in repository for details on that.
  • I'm providing some utility methods for styling the system bars

I'd like to hear your opinion and experience on these things. Hit me up if you want to. We could also start a collaboration if you want

@tafelnl
Copy link
Author

tafelnl commented May 3, 2024

On a different but related note: I'm considering renaming the plugin to edge-to-edge instead of safe-area. Because, in fact, that's what we're trying to achieve and resolve. After all, the safe area insets are of no use when you haven't also enabled edge-to-edge. But not sure if that would be better / more clear to users

@AlwaysLoveme
Copy link
Owner

Nice plugin!

I was in need of a plugin that allowed me to use the edge-to-edge functionality on Android just as we're able to use it on iOS. I ended up writing this plugin: https://github.com/capacitor-community/safe-area

Only then I discovered your plugin. The approach is similar, however still a tad bit different. Some differences:

  • I only cared about detecting the native safe area insets on Android, because on iOS they (should) already work out of the box
  • I'm writing the CSS variables to the browser directly from the native side. So it's not needed to set any listeners on web or whatever to keep them in sync
  • I'm using WindowCompat - which supports older Android versions out of the box - preventing the need of if-else-structures and maintaining deprecated code.
  • I'm listening to safe area changes by using setOnApplyWindowInsetsListener
  • I'm taking into account to IME (keyboard) offsets. TBH, I haven't tested your implementation, but by the quick looks of it, that could be a bug in yours.
  • I'm calculating the insets in a way that's a bit different compared to your strategy. Refer to the code in repository for details on that.
  • I'm providing some utility methods for styling the system bars

I'd like to hear your opinion and experience on these things. Hit me up if you want to. We could also start a collaboration if you want

it is very nice by auto inject safearea CSS variables by native side,and I think it would be better if plugin could support setting CSS variable names

@tafelnl
Copy link
Author

tafelnl commented Sep 6, 2024

Sorry, I somehow completely missed your response.

and I think it would be better if plugin could support setting CSS variable names

Yes, I agree, that would be a nice addition! Playing devil's advocate however, maybe allowing to customize the CSS variable names will result in less consistent implementations across Capacitor developers... Maybe some other people can chime in and give their opinion

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants