<br />

![Picture-in-picture](https://developers.google.com/static/admob/images/format-picture-in-picture.svg)

Picture-in-picture (PiP) ads display in a floating window that stays on top of
content on the screen, such as articles, feeds, or gameplay. This format lets
users interact with your app while the ad remains visible. To display ads that
don't take over the entire screen, choose this format.

Learn more [about picture-in-picture
ads](https://support.google.com/admob/answer/17155813).


This guide covers requesting and displaying picture-in-picture ads in your app
using GMA Next-Gen SDK.

## Before you begin

Before you continue, do the following:

- [Set up GMA Next-Gen SDK](https://developers.google.com/admob/android/next-gen/quick-start.md.txt).

- Install GMA Next-Gen SDK version `1.4.0` or later.

<!-- -->

- [Enable test ads](https://developers.google.com/admob/android/next-gen/test-ads.md.txt) and use the following test ad unit ID:

      ca-app-pub-3940256099942544/9657123429

## Load an ad

To load a
[`PictureInPictureAd`](https://developers.google.com/admob/android/next-gen/reference/com/google/android/libraries/ads/mobile/sdk/pip/PictureInPictureAd.md.txt)
object, create an ad request and call the `load` method:


### Kotlin

```kotlin
private fun loadPictureInPictureAd() {
  val request = PictureInPictureAdRequest.Builder(AD_UNIT_ID).build()

  PictureInPictureAd.load(
    request,
    object : AdLoadCallback<PictureInPictureAd> {
      override fun onAdFailedToLoad(adError: LoadAdError) {
        Log.w(TAG, "Picture-in-Picture ad failed to load: $adError")
      }

      override fun onAdLoaded(ad: PictureInPictureAd) {
        Log.d(TAG, "Picture-in-Picture ad loaded.")

        // Capture the PictureInPictureAd reference for later use.
        pipAd = ad
        setAdEventCallback(ad)
      }
    },
  )
}
```

### Java

```java
private void loadPictureInPictureAd() {
  PictureInPictureAdRequest request = new PictureInPictureAdRequest.Builder(AD_UNIT_ID).build();

  PictureInPictureAd.load(
      request,
      new AdLoadCallback<PictureInPictureAd>() {
        @Override
        public void onAdFailedToLoad(@NonNull LoadAdError adError) {
          Log.w(TAG, "Picture-in-Picture ad failed to load: " + adError);
        }

        @Override
        public void onAdLoaded(@NonNull PictureInPictureAd ad) {
          Log.d(TAG, "Picture-in-Picture ad loaded.");

          // Capture the PictureInPictureAd reference for later use.
          pipAd = ad;
          setAdEventCallback(ad);
        }
      });
}
```

<br />

Replace <var translate="no">AD_UNIT_ID</var> with your ad unit ID.

## Show the ad

To display the picture-in-picture ad on screen, call the `show` method. The
following example displays the ad in the default position and sets the presentation scope to the screen:


### Kotlin

```kotlin
private fun showPictureInPictureAd(activity: Activity) {
  // Capture the ad reference saved from the onAdLoaded callback.
  val ad = pipAd
  if (ad != null) {
    val options =
      PictureInPictureAdOptions.Builder()
        // Uses the Google Mobile Ads SDK's default screen position.
        .setPosition(PictureInPictureAdPosition.DEFAULT)
        // Binds the ad lifecycle to the host screen.
        .setPresentationScope(PictureInPictureAdPresentationScope.SCREEN)
        .build()
    ad.show(activity, options)
  } else {
    Log.d(TAG, "No ad to show.")
  }
}
```

### Java

```java
private void showPictureInPictureAd(@NonNull Activity activity) {
  // Use the ad reference saved from the onAdLoaded callback.
  if (pipAd != null) {
    PictureInPictureAdOptions options =
        new PictureInPictureAdOptions.Builder()
            // Uses the Google Mobile Ads SDK's default screen position.
            .setPosition(PictureInPictureAdPosition.DEFAULT)
            // Binds the ad lifecycle to the host screen.
            .setPresentationScope(PictureInPictureAdPresentationScope.SCREEN)
            .build();
    pipAd.show(activity, options);
  } else {
    Log.d(TAG, "No ad to show.");
  }
}
```

<br />

### Set the position

By default, GMA Next-Gen SDK displays a picture-in-picture ad in the bottom-right
corner of the screen when first shown, or at the last known position if
previously shown. To customize where the ad appears, specify a position when
showing the ad. The following example sets the position on top of content in the
top-left corner of the screen:


### Kotlin

```kotlin
private fun createTopLeftPositionOptions(): PictureInPictureAdOptions {
  return PictureInPictureAdOptions.Builder()
    // Sets the ad position to the top-left corner of the screen.
    .setPosition(PictureInPictureAdPosition.TOP_LEFT)
    .build()
}
```

### Java

```java
private PictureInPictureAdOptions createTopLeftPositionOptions() {
  return new PictureInPictureAdOptions.Builder()
      // Sets the ad position to the top-left corner of the screen.
      .setPosition(PictureInPictureAdPosition.TOP_LEFT)
      .build();
}
```

<br />

For all available positions, see
[`PictureInPictureAdPosition`](https://developers.google.com/admob/android/next-gen/reference/com/google/android/libraries/ads/mobile/sdk/pip/PictureInPictureAdPosition.md.txt).


### Set the presentation scope

By default, GMA Next-Gen SDK binds a picture-in-picture ad to the current host
screen. GMA Next-Gen SDK dismisses the ad when the host screen's view hierarchy is
no longer in memory. To keep the ad visible after the host screen is removed
from memory, set the presentation scope to the application:


### Kotlin

```kotlin
private fun createApplicationScopedOptions(): PictureInPictureAdOptions {
  return PictureInPictureAdOptions.Builder()
    // Keeps the ad visible beyond the host screen's lifecycle.
    .setPresentationScope(PictureInPictureAdPresentationScope.APPLICATION)
    .build()
}
```

### Java

```java
private PictureInPictureAdOptions createApplicationScopedOptions() {
  return new PictureInPictureAdOptions.Builder()
      // Keeps the ad visible beyond the host screen's lifecycle.
      .setPresentationScope(PictureInPictureAdPresentationScope.APPLICATION)
      .build();
}
```

<br />

For more information, see [Keep the ad visible across
screens](https://developers.google.com/admob/android/next-gen/picture-in-picture#keep_visible_across_screens).


## Listen to ad events

To handle picture-in-picture ad lifecycle events, register for ad events before
displaying your ad. These events report ad interactions, such as clicks and
impressions. These events also report picture-in-picture-specific events, such
as when the ad shows or hides:


### Kotlin

```kotlin
private fun setAdEventCallback(pipAd: PictureInPictureAd) {
  pipAd.adEventCallback =
    object : PictureInPictureAdEventCallback {
      override fun onAdShown() {
        Log.d(TAG, "Picture-in-Picture ad shown.")
      }

      override fun onAdHidden() {
        Log.d(TAG, "Picture-in-Picture ad hidden.")
      }

      override fun onAdImpression() {
        Log.d(TAG, "Picture-in-Picture ad recorded an impression.")
      }

      override fun onAdClicked() {
        Log.d(TAG, "Picture-in-Picture ad recorded a click.")
      }

      override fun onAdShowedFullScreenContent() {
        Log.d(TAG, "Picture-in-Picture ad showed full screen content.")
      }

      override fun onAdDismissedFullScreenContent() {
        Log.d(TAG, "Picture-in-Picture ad dismissed full screen content.")
      }

      override fun onAdFailedToShowFullScreenContent(
        fullScreenContentError: FullScreenContentError
      ) {
        Log.w(
          TAG,
          "Picture-in-Picture ad failed to show full screen content: $fullScreenContentError",
        )
      }

      override fun onAdPaid(value: AdValue) {
        Log.d(TAG, "Picture-in-Picture ad paid: ${value.valueMicros} ${value.currencyCode}")
      }
    }
}
```

### Java

```java
private void setAdEventCallback(@NonNull PictureInPictureAd pipAd) {
  pipAd.setAdEventCallback(
      new PictureInPictureAdEventCallback() {
        @Override
        public void onAdShown() {
          Log.d(TAG, "Picture-in-Picture ad shown.");
        }

        @Override
        public void onAdHidden() {
          Log.d(TAG, "Picture-in-Picture ad hidden.");
        }

        @Override
        public void onAdImpression() {
          Log.d(TAG, "Picture-in-Picture ad recorded an impression.");
        }

        @Override
        public void onAdClicked() {
          Log.d(TAG, "Picture-in-Picture ad recorded a click.");
        }

        @Override
        public void onAdShowedFullScreenContent() {
          Log.d(TAG, "Picture-in-Picture ad showed full screen content.");
        }

        @Override
        public void onAdDismissedFullScreenContent() {
          Log.d(TAG, "Picture-in-Picture ad dismissed full screen content.");
        }

        @Override
        public void onAdFailedToShowFullScreenContent(
            @NonNull FullScreenContentError fullScreenContentError) {
          Log.w(
              TAG,
              "Picture-in-Picture ad failed to show full screen content: "
                  + fullScreenContentError);
        }

        @Override
        public void onAdPaid(@NonNull AdValue value) {
          Log.d(
              TAG,
              "Picture-in-Picture ad paid: "
                  + value.getValueMicros()
                  + " "
                  + value.getCurrencyCode());
        }
      });
}
```

<br />

## Hide the ad

To remove the floating ad from the screen, call the `hide` method. This method
invokes the ad hidden event:


### Kotlin

```kotlin
private fun hidePictureInPictureAd() {
  // Capture the ad reference saved from the onAdLoaded callback.
  val ad = pipAd
  if (ad != null) {
    ad.hide()
  } else {
    Log.d(TAG, "No ad to hide.")
  }
}
```

### Java

```java
private void hidePictureInPictureAd() {
  // Use the ad reference saved from the onAdLoaded callback.
  if (pipAd != null) {
    pipAd.hide();
  } else {
    Log.d(TAG, "No ad to hide.");
  }
}
```

<br />

## Clean up ad resources

To avoid memory leaks, drop your reference to the ad object when your app
finishes using the ad. For example, when your app no longer displays or
interacts with the ad again. For screen-scoped ads, drop the reference
when your app removes the host screen from memory. For app-scoped ads, retain
the ad reference while the user navigates across screens, and drop the reference
when the user dismisses the ad:


### Kotlin

```kotlin
private fun cleanUpPictureInPictureAd() {
  pipAd?.destroy()
  pipAd = null
}
```

### Java

```java
private void cleanUpPictureInPictureAd() {
  // Use the ad reference saved from the onAdLoaded callback.
  if (pipAd != null) {
    pipAd.destroy();
    pipAd = null;
  }
}
```

<br />

## Keep the ad visible across screens

When you set the presentation scope to the application, the picture-in-picture
ad remains visible even when your app removes the hosting screen from memory. To
interact with or dismiss the ad when the user navigates away from the host
screen, your app must retain access to the picture-in-picture ad. We recommend
holding the ad in an app-level singleton or shared state manager rather than in
a single screen's instance variable.

For examples on how to keep an ad visible across screens, see the following
sample apps:

- [Kotlin](https://github.com/googleads/gma-next-gen-sdk-android-examples/tree/main/kotlin/NextGenExample/app/src/main/java/com/example/nextgenexample/pictureinpicture/PictureInPictureAdManager.kt)
- [Java](https://github.com/googleads/gma-next-gen-sdk-android-examples/tree/main/java/NextGenExample/app/src/main/java/com/example/nextgenexample/pictureinpicture/PictureInPictureAdManager.java)

<br />