Native Ads Presentation

File: JVE.Native.pas            Inheritance: TControl ⬅ TJVENativeAd

This component suite provides controls to conveniently present native ads. They can be used to present MobFox or PubNative ads or cross promotions and in-house ads.

native-adThe first control presents the container for the native ad. It manages the ad cycling and clicking behavior (but not the content; see Presenting Ad Content section below). The following properties are exposed by this control:

  • Ads – the list of ads to show. See List of Ads / Cross Promos section above for details (part of the Banners and Interstitials documentation).
  • InitialTimeout – indicates the time (in seconds) to present the first ad (usually an in-house fallback, before the paid ad is downloaded). Zero value stops the timer.
  • AdTimeout – the time (in seconds) each banner is displayed, before the control switches to the next available ad.
  • HasAds – read/only public (not published) property, indicating whether an ad is being presented.

 

The following events are exposed by this control:

  • OnAnimation – called when the new ad is available and is about to be presented; see Animating Ad Switches section below for details.
  • OnHasAdsChanged – called when the ad becomes available after there was none and vice versa. Can be used to reorganize the screen to compensate for the missing ad.
  • OnPresentation – called when a new ad is available; could be used to update the user interface, for example, based on the amount of text in textual fields, etc.

Notice, the OnClick event will only be called if an ad is actually presented; use OnMouseDown to be called regardless of whether the ad is presented.

 

In addition to the above, the following methods are provided by this control:

  • NextAd – attempts to present the next ad immediately, without waiting for the timeout.
  • AdClicked – continues as if the user clicked the ad. See Implementing Parental Gates section for a use case.
  • UpdateVisualControl – this class procedure reapplies the ad to the presentation controls therein. Used to implement custom native ads presentation; see TJVENativeLabel/Image for an implementation example.

 

Several native ad controls can be linked and synchronized to always show the same ad. To achieve this set one of the native ad control’s Ads property to a proper list of ads to show, while in the other control add the first native ad control as the only ads provider.

 

The presentation of the interstitials is generally identical on all platforms and precisely follows your design-time definitions, as can be seen here:

Untitled-6

 

Presenting Ad Content

File: JVE.Native.pas            Inheritance: TImage ⬅ TJVENativeImage

File: JVE.Native.pas            Inheritance: TLabel ⬅ TJVENativeLabel

Two controls are provided to present the ad content (icon, banner and textual fields). If you place these controls anywhere within the TJVENativeAd, they will present the appropriate value from the ad and be updated automatically (do not place them in a standalone fashion: they will perform no action there).

Both controls hide their regular data properties (i.e. Text, Bitmap and MultiResBitmap), but they expose a single new property: Detail. This property indicates which piece of ad content is presented by the control:

Untitled-5

If for your implementation these two controls don’t provide sufficient presentation capabilities (for example, if you want custom stars presentation for Rating), you can create your own controls, which can support automatic ad data updates by implementing the IJVENativeAdDetail interface.

 

Implementing Parental Gates

If you wish to implement a parental gate on native ads, override the OnClick event and perform the following:

  • Disable the ad timer (i.e. AdTimeout:=0).
  • Present the parental gate.
  • If confirmed, call the AdClicked method to simulate the click.
  • Restart the ad time (i.e. AdTimeout:=45).

 

Animating Ad Switches

To animate the switches between ads, the following should be implemented:

  • Add the transition effect you want to the TJVENativeAd. You can disable it for design-time convenience.
  • Add a float animation on the Progress property of the transition effect. Set StartValue to 100, StopValue to 0 and Duration to the transition speed you want.
  • Implement the TJVENativeAd’s OnAnimation event as follows:
begin
  Transition.Enabled := True; // If you have disabled it previously
  Transition.Target.Assign(Source); // We are reversing the animation
  Animation.Start;
end;

This implementation will allow you to use any of the Delphi provided transition effects to perform the switch.