Surface not show everything
elvis-hp opened this issue · comments
feature request?
-- OR --
bug report?
I have some code:
...
import { Surface, GLImage, Negative, Blur} from 'gl-react-native';
...
render() {
return (
<Surface width={200} height={100} backgroundColor={'red'}>
<Blur factor={2}>
<Negative>
https://i.imgur.com/wxqlQkh.jpg
</Negative>
</Blur>
</Surface>
)
}
library version
npm ls gl-react gl-react-dom gl-react-native gl-react-expo # Please run and paste the output of this
├── gl-react@3.15.0
├── gl-react-expo@3.16.3
└── gl-react-native@3.15.0
Expected behavior
It's not show anything.
Actual behavior
Can you help me got it?
Steps to reproduce the behavior
for react-native there is no such width and height on Surface, you should directly use style={{ width, height }}
backgroundColor don't exist neither (this was in gl-react v2)
try
<Surface style={{ width:200, height:100}}>
<Blur factor={2}>
<Negative>
{{ uri: "https://i.imgur.com/wxqlQkh.jpg" }}
</Negative>
</Blur>
</Surface>
Thank you so much, it work for me.
But now, I can not captureFrame
that photo.
I don't like to use react-native-view-shot
I like to use gl-react-native v3.
Code:
import {Surface} from 'gl-react-native';
import GLImage from 'gl-react-image';
When I press to capture button, I have:
this.image.captureFrame().then(base64data => {
console.log("DO SOMETHING WITH", base64data);
});
with:
<Surface ref={ref => (this.image = ref)} backgroundColor={'black'} style={{width: '100%', height: '97%'}}>
<F1977>
<GLImage
style={{alignSelf: 'center', width: crop.width, height: crop.height}}
source={{uri: mainImage}} resizeMode="contain"/>
</F1977>
</Surface>
Can you tell me why it's not work.
undefined is not a function (evaluating 'this.image.captureFrame()')
Thanks!
this feature is currently not possible. Expo implementation have it and as soon as we merge it back we should have it
Thank's, I rollbacked to v2 and it works for me.