3

I have a box 100m x 100m to act as a floor in a reactVR test I am working on, I'd like to add a texture to it but the tile texture just stretches over the entire surface rather than tile, as desired. Here is my component code, nothing special:

    <Box
      dimWidth={100}
      dimDepth={100}
      dimHeight={0.5}
      texture={asset('check_floor_tile.jpg')}
      style={{
        color:'#333333',
        transform: [{translate: [0, -1, 0]}]
      }}
      lit
    />

I've had a look for examples without success, any help would be appreciated. Thanks.

Anthony Cregan
  • 960
  • 11
  • 25
  • 1
    It's not possible to change the way textures are wrapped, at the moment it's hardcoded to `THREE.ClampToEdgeWrapping` with no way to change it to `THREE.RepeatWrapping` for ex. See [this issue](https://github.com/facebook/react-vr/issues/55) on Github. – Valentin Jul 02 '17 at 13:43
  • Thanks for the update Valentin, its appreciated. I'll keep an eye on release notes to see how it matures. – Anthony Cregan Jul 05 '17 at 11:48

1 Answers1

2

You can now tile a texture across a surface by using specifying repeat on the texture property of any component that extends BasicMesh (Box, Plane, Sphere, Cylinder, Model).

The functionality has been added to Reach VR via this PR.

<Plane
  texture={{
    ...asset('texture.jpg'),
    repeat: [4, 4],
  }}
/>
Valentin
  • 2,772
  • 1
  • 27
  • 40