Rewarded Ads

Both rewarded and rewarded interstitial ads offer users a reward for engaging with an ad.

In the examples below, a rewarded ad is displayed when the menu item is clicked. This is a use-case for a rewarded ad.

The ad could also be displayed at natural breaks in the app (e.g. between two screens) and automatically reward users for watching without explicit opt-in. This would be an example of a rewarded interstitial ad.

The reward event will be sent each time a user earns a reward. You can use this event to trigger providing the user a reward in your app. For example, after watching a rewarded ad, you might give the user bonus points or unlock a new level.

iOS

The event .reward includes the reward type and amount.

final class RewardedAdManager: NSObject, ObservableObject, FuseFullScreenAdViewDelegate {
    private let ad: FuseFullScreenAdView

    init(code: String) {
        ad = FuseFullScreenAdView(code: code)
        ad.delegate = self
    }

    func showAd() {
        ad.show()
    }

    func onEvent(adView: FuseFullScreenAdView, event: FuseAdViewEvent) {
        switch (event) {
        case .reward(let type, let amount): print("Reward received: \(amount) of \(type)")
        default: print("Ad event: \(event)")
        }
    }
}

struct MyView: View {
    @StateObject private var adManager = RewardedAdManager(code: "<zone_code>")

    var body: some View {
        NavigationStack {
            ScrollView {
                VStack {
                    // ...

                    Button("Show rewarded ad") {
                        adManager.showAd()
                    }

                    // ...
                }
            }
        }
    }
}

For more examples, see the iOS example repository.

Android

The event FuseAdViewEvent.Reward includes the reward type and amount.

class MainActivity : AppCompatActivity() {
    private var rewardedAd = FuseFullScreenAdView(this, "<zone_code>").apply {
        listener = object : FuseFullScreenAdViewListener {
            override fun onEvent(
                adView: FuseFullScreenAdView,
                event: FuseAdViewEvent,
            ) {
                val msg = when (event) {
                    is FuseAdViewEvent.Reward -> "Reward received: ${event.amount} of ${event.type}"
                    else -> "Ad event: $event"
                }
                msg?.let {
                    println(it)
                }
            }
        }
    }

    override fun onOptionsItemSelected(item: MenuItem): Boolean = when (item.itemId) {
        R.id.action_rewarded -> {
            rewardedAd.show(this)
            true
        }

        else -> super.onOptionsItemSelected(item)
    }
}

For more examples, see the Android example repository.

Flutter

Rewarded ads in Flutter follow the same pattern as interstitial ads, with the addition of reward event handling. Create a FuseFullScreenAdView and call show(). Listen for reward events via the onEvent callback. See the Interstitial section for the base implementation.

React Native

The event data for FuseAdViewEvent.Reward includes rewardType and rewardAmount.

import React, { useEffect, useRef } from 'react';
import { Button, View } from 'react-native';
import { FuseFullScreenAdView, FuseAdViewEvent } from '@publift/react-native-fuseapp';

function RewardedAdExample() {
  const adRef = useRef<FuseFullScreenAdView | null>(null);

  useEffect(() => {
    const ad = new FuseFullScreenAdView({
      code: '<zone_code>',
      onEvent: (data) => {
        if (data.event === FuseAdViewEvent.Reward) {
          console.log(`Reward received: ${data.rewardAmount} of ${data.rewardType}`);
        } else {
          console.log('Ad event:', data.event);
        }
      },
    });
    adRef.current = ad;

    return () => {
      ad.dispose();
    };
  }, []);

  const showAd = async () => {
    try {
      await adRef.current?.show();
    } catch (e) {
      console.log('Unable to show ad:', e);
    }
  };

  return (
    <View>
      <Button title="Show rewarded ad" onPress={showAd} />
    </View>
  );
}