MediaView is not showing until clicks on the Screen

[mahesh963]

Bug Report

Before opening

• [ ] Did you try the latest release? No
• [ ] Did you look for existing issues? yes

Native Ads

Platforms

*Android Version

Versions

• react-native-fbads:^5.0.1
• react-native:0.56.0

Ads Environment

• Facebook app installed: Installed
• Happens in production : released build
• Facebook review status: approved

Current Behaviour

I Implemented the Native Ad According to my Application. Everything is working Fine. MediaView is not showing until clicks on the Screen(At the View where Media View is placed).

Expected Behaviour Expecting to Show the Media View as Slider (or) Video (or) Image Initially along with the remaining

[Suraj-Tiwari]

Please try latest release first. Also Share your code

[christenpro]

@Suraj-Tiwari also getting blurred image in MediaView.

[Suraj-Tiwari]

Blurred Media Image is known issue, But "Image or other media Not showing" we haven't faced it while testing.

[mahesh963]

Hi, @Suraj-Tiwari thanks for quick response. I Upgraded the react-native-fbads to Latest version but I'm getting the Same Error i.e Initially Media View is not loading.Below is my code

<View style={styles.NativeAds}>
        <View style={{flex:1,flexDirection:'row',marginTop:5}}>
          <View style={{flex:0.16,backgroundColor:'transparent'}}>
            <AdIconView style={{height: windowSize.width/9, width:windowSize.width/9,
               borderRadius:10,backgroundColor:'transparent',alignSelf:'center',marginLeft:scale(6)}} />
          </View>
          <View style={{flex:0.74,backgroundColor:'transparent',flexDirection:'column'}}>
            <TriggerableView style={{flex:0.5,backgroundColor:'transparent',color:'#515365'}}>
              <Text style={[styles.carouselHeadTxt,{marginRight:3}]}>
                  {this.props.nativeAd.advertiserName}
              </Text>
            </TriggerableView>
            <TriggerableView style={{flex:0.5,backgroundColor:'transparent'}}>
              <Text style={{fontSize: scale(11.5),
                  lineHeight: 18,marginRight:scale(3),
                  fontFamily: "GoogleSans-Regular",marginTop:-1}}>
                {this.props.nativeAd.promotedTranslation}
              </Text>
            </TriggerableView>
          </View>
          <View style={{flex:0.1,backgroundColor:'transparent'}}>
            <AdChoicesView
              style={{width:scale(30)}}
              location={"topRight"}
              expandable={true} />
          </View>
        </View>
        <TriggerableView style={{marginHorizontal:scale(10),marginTop: scale(5)}}>
          <Text style={[styles.carouselHeadTxt,{marginRight:scale(3),alignSelf:'flex-start'}]}>
              {this.props.nativeAd.headline}
          </Text>
      </TriggerableView>
      <TriggerableView style={{marginHorizontal:scale(10)}}>
        <Text
          numberOfLines={2}
          style={[styles.messagE, {lineHeight:23,fontFamily:'GoogleSans-Regular', fontSize: 
                       scale(15)}]}>
          {this.props.nativeAd.bodyText}
        </Text>
      </TriggerableView>
      <View style={{flexDirection:'column'}}>
        <View>
        <MediaView style={{ width: windowSize.width, height: scale(180) 
          ,marginHorizontal:0,alignSelf:'center',backgroundColor:'transparent'}} />
          <View>
            <TriggerableView
              style={{
                fontSize: scale(15),
                color: 'white',
                paddingVertical: 10,
                width:windowSize.width/1.06,
                margin: scale(10),
                borderRadius: scale(6),
                alignItems:'center',
                justifyContent:'center',
                backgroundColor:'#896fec',
                textAlign:'center',
                fontFamily:'GoogleSans-Regular'
              }}>
              {this.props.nativeAd.callToActionText}
            </TriggerableView>
          </View>
        </View>
      </View>
      </View>

Along with this Error I'm getting this error after upgrading to new version of react-native-fbads when Scrolling the Records in Listview .please take a look on screenshot.

[mahesh963]

Hi @erandagan, i'm still getting the Fix Double value crash Issue and Media View is not loading Initially

[erandagan]

Did you try the version on master? I deployed the fix to a large scale production app and it seems to work flawlessy.

On Tue, Dec 11, 2018, 06:15 mahesh963 <notifications@github.com wrote:

Hi @erandagan https://github.com/erandagan, i'm still getting the Fix Double value crash Issue and Media View is not loading Initially

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/callstack/react-native-fbads/issues/168#issuecomment-446066527, or mute the thread https://github.com/notifications/unsubscribe-auth/AXm0FayE6u5kLNLgddDB5N7sQ-8dCBFhks5u3zFKgaJpZM4ZAfP4 .

[Trancever]

@erandagan Should we release new minor version?

[erandagan]

@Trancever Yes, that would be great 👍

[Trancever]

v6.0.1 landed on npm.

[christenpro]

@erandagan @Trancever Still Double value crash Issue and Media View is not loading Initially

[Suraj-Tiwari]

@erandagan we should recheck it on different scenario, reason could be android version specific.

i can test on Following Android version (physical devices): 9.0 8.0.1 7.0

[erandagan]

@Trancever Did you remember to transpile to TS before publishing? I just tried installing 6.0.1 and I seem to get the old dist, without the merged bugfix.

@Suraj-Tiwari The code has been tested on >50,000 users in a production app, It's simply not in 6.0.1.

[christenpro]

@Suraj-Tiwari @erandagan @Trancever Please check this scenario https://jsbin.com/qeluraf/edit?output

[Trancever]

@erandagan Didn't do that.. We should have a script that do it before publishing.. Will release 6.0.2 with new dist.

[Trancever]

Check v6.0.2 guys :) @erandagan Could you make an issue for that publish process ?

[christenpro]

@erandagan @Trancever @Suraj-Tiwari Thank you guys... crashing fixed, But still media view doesn't display until click or scroll down/top. I don't want to display blur media view, i want to show only scroll ads and videos. Is it possible, please let me know...

[Suraj-Tiwari]

Blur media view is issue within AudienceSdk I had a talk with fb dev team, they said blurry image is a placeholder to fill remaining space of image to keep original aspect ratio of image, but somehow sdk is detecting image space as placeholder

ps: They aren't fixing it for react naive.

[christenpro]

@Suraj-Tiwari Thank you for quick response.

What about Carousel ads display in Media View?

[Suraj-Tiwari]

Those were working fine video ads too. When i tested it last time

[erandagan]

@christenpro Is there a chance you're displaying the ad component within a scrolling container, such as ScrollView or FlatList? There is a known behaviour issue with scrolling components which is rooted in Facebook's SDK (so we can't fix it for now).

Just wondering if you could test in a non-scrolling container and see what happens - I know this isn't a real solution, but this will help us if this is all part of a bigger problem.

[christenpro]

@erandagan @Trancever @Suraj-Tiwari Still media view doesn't display until click or scroll down/top. Please let me know about Blur Media, I didn't get proper reply for blur view.

[dr-andy]

Same problem. MediaView appears for the first seconds then disappears. It appears if I scroll the MediaView then disappears again after a few seconds. Tested on Android 8.0 device. Other components work as intended.

[paddy57]

Same problem. MediaView appears for the first seconds then disappears. It appears if I scroll the MediaView then disappears again after a few seconds. Tested on Android 8.0 device. Other components work as intended.

Did you solve this ?

[TMaszko]

Please check out v7 available now ! :) if it hasn't been fixed yet then please reopen it.