using calcwidth

[moblizeit]

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]

Use the calcWidth prop instead of the width prop

[moblizeit]

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]

@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]

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

[willb335]

@agam-colaburate

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

[singhagam1]

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