ridvanaltun / react-native-deepar

Snapchat-like filters, AR lenses, and real-time facial animations.
https://deepar.ai
MIT License
129 stars 17 forks source link

Download models from internet and render in runtime. #26

Open rish6ix opened 1 year ago

rish6ix commented 1 year ago

Hi, Please help me understand how we can download models and render in runtime. Any help will be appreciated. Thanks in advance.

ridvanaltun commented 1 year ago

Hi, Please help me understand how we can download models and render in runtime. Any help will be appreciated. Thanks in advance.

Hey,

I have already show an example in README file: https://github.com/ridvanaltun/react-native-deepar#using-ar-models-over-internet. You can see the usage from example project: https://github.com/ridvanaltun/react-native-deepar/blob/master/example/src/screens/CameraScreen.tsx#L124

shoaibbadshah commented 1 year ago

I need to the preview images of filters. for now I am using uri: require('../../../Assets/Free Filters/Flower Face/preview.png'),

But that is not what we want. I need all the filters to be shown with their preview and when I click on it it should show me it's filter.

` <FlatList style={styles.flatlist} horizontal data={Effects} showsHorizontalScrollIndicator={false} renderItem={({item, index}) => (

      )}
    />`

    this is my filters displayed using Flatlist from react native. and I am passing the data is the static array as below

    `export default [
          {
            name: 'face_painting',
            title: 'Face Painting',
            uri: require('../../../Assets/Free Filters/Flower Face/preview.png'),
            platforms: ['ios', 'android'],
          },]`

          `

const RenderEffectName = ({item, index}) => {

  return (
          <TouchableOpacity onPress={() => changeEffect(index)}>
            <View
              style={{
                width: 70,
                height: 70,
                justifyContent: 'center',
                alignItems: 'center',
                backgroundColor: 'grey',
                margin: 5,
              }}>
              <Image
                source={
                  // item.uri
                  require('../../../Assets/preview.png')
                }
                style={{width: 70, height: 70, resizeMode: 'cover'}}
                resizeMode="contain"
              />
            </View>
          </TouchableOpacity>
        );

`

so I want to use RNfetchBlob to get these things from internet

RNFetchBlob.config({ fileCache: true, }) .fetch( 'GET', 'http://betacoins.magix.net/public/deepar-filters', // 'http://betacoins.magix.net/public/deepar-filters/8bitHearts', ) .then(res => { // setFilter(res.data); // array.push(res.data); console.log('effectfrom internet ', JSON.stringify(res)); deepARRef?.current?.switchEffectWithPath({ path: res.path(), slot: 'effect', });

    can I use this in the flatlist ? or how to get the path of filter where I can pass the index coming from flatlist . based upon the index I need to select the filter
awaisrana12 commented 1 year ago

I wanna know about the same issue as well, @ridvanaltun please any help will be highly appreciated

WalobwaD commented 1 year ago

Hey @awaisrana12 and @shoaibbadshah Did you guys fix the issue? I also need help on that

shoaibbadshah commented 1 year ago

Hey @awaisrana12 and @shoaibbadshah Did you guys fix the issue? I also need help on that

Yes we have worked on it. it's been a year that we are traveling with it but for now we have decided we will remove this package will look for something else in future. We had a very basic experience with this package I don't know may be they have very less documentation and examples for react native or may be they don't have full support for it

shoaibbadshah commented 1 year ago

if you need our code we will share that with you. just lemme know this is my personal Email Shoaib.reactnative@gmail.com

WalobwaD commented 1 year ago

Alright Thanks You can check out Viro They have a pretty strong community.