Customize error state

There is a way to customize how FuseAdView behaves if the ad fails to load.

You can provide errorBehaviour parameter when creating a new instance of FuseAdView.

Display Placeholder Image

When this option is selected, a provided image is displayed in the middle of the view if an error occurs while loading an ad.

NOTE: If the image is bigger than FuseAdView, it will be adjusted to fit the bounds, if it is smaller - it will be rendered as is.

Android

val image = AppCompatResources.getDrawable(context, <image_resource>)
val adView = FuseAdView(
    context,
    code = "zone_code",
    errorBehaviour = FuseAdViewBehaviour.Background(image),
)

iOS

let image = UIImage(named: "<image_resource>")
let adView = FuseAdView(
    code: "zone_code",
    errorBehaviour: .background(image: image)
)

Flutter

FuseAdView(
    code: "example_fixed_size_banner",
    errorBehaviour: Background(assetPath: 'assets/placeholder.png'),
)

React Native

<FuseAdView
  code="<zone_code>"
  errorBehaviour={{ type: 'background', assetPath: 'placeholder.png' }}
/>

Hide On Error

When this option is selected, a view will be completely hidden if an error occurs while loading an ad.

Android

val adView = FuseAdView(
    context,
    code = "zone_code",
    errorBehaviour = FuseAdViewBehaviour.Hide,
)

iOS

let adView = FuseAdView(
    code: "zone_code",
    errorBehaviour: .hide,
)

Flutter

FuseAdView(
    code: "example_fixed_size_banner",
    errorBehaviour: Hide(),
)

React Native

<FuseAdView
  code="<zone_code>"
  errorBehaviour={{ type: 'hide' }}
/>

Display Custom View

When this option is selected, a provided closure is used to build an arbitrary view which is then placed inside FuseAdView.

Android

val errorBehaviour = FuseAdViewBehaviour.CustomView(
    viewBuilder = { ctx, parent ->
        TextView(ctx).apply {
            text = "Have a nice day!"
            layoutParams = ViewGroup.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT,
            )
        }
    },
)
val adView = FuseAdView(
    context,
    code = "zone_code",
    errorBehaviour = errorBehaviour,
)

// Compose
ComposeFuseAdView(
    code = "zone_code",
    errorBehaviour = errorBehaviour,
)

NOTE: layoutParams will define how custom view will be laid out inside FuseAdView. Irrespective of custom view size, the height of FuseAdView will not change and will remain based on the requested ad sizes, unless the size is dynamic (fluid or native). In this case FuseAdView will adopt the height of the custom view provided.

iOS

private func buildCustomView() -> UIView {
    let label = UILabel()
    label.text = "Have a nice day!"
    label.textAlignment = .center
    return label
}

let adView = FuseAdView(
    code: "zone_code",
    errorBehaviour: .customView(viewBuilder: buildCustomView)
)

// SwiftUI
FuseAdViewRepresentable(
    code: "zone_code",
    errorBehaviour: .customView(viewBuilder: buildCustomView)
)

NOTE: On iOS the custom view is pinned to all the sides of FuseAdView. If the zone uses fixed ad sizes, then FuseAdView will adopt the height of the largest ad size and the custom view will be centred inside it. If the zone uses dynamic ad sizes (fluid or native) then FuseAdView will adopt the height of the custom view provided.

Flutter

FuseAdView(
    code: "example_fixed_size_banner",
    errorBehaviour: CustomView(
        builder: (context) => const Center(
            child: Text('Have a nice day!'),
        ),
    ),
)

React Native

<FuseAdView
  code="<zone_code>"
  errorBehaviour={{
    type: 'customView',
    renderView: () => (
      <Text style={{ textAlign: 'center' }}>Have a nice day!</Text>
    ),
  }}
/>

Global Settings

errorBehaviour parameter is optional. If it is not provided, default value will be taken from the FuseSDK object.

If you want to provide default behaviour which would be applied to all FuseAdViews across the app, set the following value on the FuseSDK object:

Android

FuseSDK.defaultErrorBehaviour = FuseAdViewBehaviour.Hide

iOS

FuseSDK.shared.defaultErrorBehaviour = .hide

The Flutter and React Native SDKs do not support global default error behaviour. Set the errorBehaviour prop on each FuseAdView individually.

If this value is not provided, it will default to do nothing.