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

using calcwidth #62

Open
moblizeit opened this issue Feb 5, 2021 · 6 comments
Open

using calcwidth #62

moblizeit opened this issue Feb 5, 2021 · 6 comments

Comments

@moblizeit
Copy link

i am using react and it says use calcWidth for responsive board. but how exactly?

what should i replace width={400} with? width={calcWidth} does not work

@willb335
Copy link
Owner

willb335 commented Feb 6, 2021

Use the calcWidth prop instead of the width prop

@moblizeit
Copy link
Author

example to do that? i am using it in a react native app and not sure what should be the value for this property

@jeremywiedemeier
Copy link

@moblizeit

Remove your width propety and use calcWidth. calcWidth is a property like width, but instead of taking in a number, it takes in a function that returns a number (the dynamically-generated width). Here's an example:

calcWidth={(size) =>
            size.screenWidth > maxWidth &&
            size.screenHeight > maxWidth
              ? maxWidth
              : Math.min(size.screenWidth, size.screenHeight)
          }

The input parameter is size (which comes with screenWidth and screenHeight) and the output parameter is the width; in this case, it's the smaller of screenWidth or screenHeight below maxWidth.

@agam-colaburate
Copy link

Hi @willb335 @jeremywiedemeier @moblizeit
Any working react native example for chessboardjsx ?
Is it good to use this library in react native ?

@willb335
Copy link
Owner

willb335 commented Apr 15, 2021

@agam-colaburate

Not sure this can work within a webview for react native. Sorry no mobile examples

@singhagam1
Copy link

I guess Webview wont be a good option because we won't have any control over it, Thanks for replying though !

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

5 participants