Added Jetpack Compose Banner Sample.

PiperOrigin-RevId: 668083400

Author: Nicholas Ventimiglia

kotlin/advanced/JetpackComposeDemo/app/build.gradle.kts

@@ -36,18 +36,18 @@ android {
 dependencies {
   implementation("androidx.activity:activity")
   implementation("androidx.activity:activity-ktx")
-  implementation("androidx.activity:activity-compose:1.9.0")
+  implementation("androidx.activity:activity-compose:1.9.1")
   implementation("androidx.core:core-ktx:1.13.1")
-  implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.8.3")
+  implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.8.4")
   implementation(platform("androidx.compose:compose-bom:2024.06.00"))
   implementation("androidx.compose.ui:ui")
   implementation("androidx.compose.ui:ui-graphics")
   implementation("androidx.compose.material3:material3")
   implementation("androidx.compose.foundation:foundation")
   implementation("androidx.navigation:navigation-compose:2.7.7")
+  implementation("androidx.navigation:navigation-runtime-ktx:2.7.7")
   implementation("com.google.android.gms:play-services-ads:23.3.0")
   implementation("com.google.android.ump:user-messaging-platform:3.0.0")
   implementation(project(":compose-util"))
-  implementation("androidx.navigation:navigation-runtime-ktx:2.7.7")
   debugImplementation("androidx.compose.ui:ui-tooling")
 }

kotlin/advanced/JetpackComposeDemo/app/src/main/java/com/google/android/gms/example/jetpackcomposedemo/BannerScreen.kt

@@ -0,0 +1,118 @@
+/*
+ * Copyright 2024 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package com.google.android.gms.example.jetpackcomposedemo
+
+import android.content.Context
+import android.util.Log
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalInspectionMode
+import androidx.compose.ui.tooling.preview.Preview
+import com.google.android.gms.ads.AdListener
+import com.google.android.gms.ads.AdRequest
+import com.google.android.gms.ads.AdSize
+import com.google.android.gms.ads.AdView
+import com.google.android.gms.ads.LoadAdError
+import com.google.android.gms.compose_util.BannerAd
+import com.google.android.gms.example.jetpackcomposedemo.GoogleMobileAdsApplication.Companion.BANNER_ADUNIT_ID
+import com.google.android.gms.example.jetpackcomposedemo.GoogleMobileAdsApplication.Companion.TAG
+import com.google.android.gms.example.jetpackcomposedemo.ui.theme.JetpackComposeDemoTheme
+
+@Composable
+fun BannerScreen(modifier: Modifier = Modifier) {
+  val context = LocalContext.current
+  val isPreviewMode = LocalInspectionMode.current
+  val deviceWidth = LocalConfiguration.current.screenWidthDp
+  var adView by remember { mutableStateOf<AdView?>(null) }
+
+  LaunchedEffect(context, deviceWidth) {
+    // Create a new AdView when size changes.
+    adView?.destroy()
+    adView = loadAdaptiveBannerAd(context, deviceWidth, isPreviewMode)
+  }
+
+  Column(modifier = modifier.fillMaxSize(), verticalArrangement = Arrangement.Bottom) {
+    adView?.let { adView ->
+      Box(modifier = Modifier.fillMaxWidth()) {
+        BannerAd(adView, Modifier.align(Alignment.BottomCenter))
+      }
+    }
+  }
+
+  // Clean up the AdView after use.
+  DisposableEffect(Unit) { onDispose { adView?.destroy() } }
+}
+
+private fun loadAdaptiveBannerAd(context: Context, width: Int, isPreviewMode: Boolean): AdView {
+  val adView = AdView(context)
+
+  // Do not load the AdView in preview mode.
+  if (isPreviewMode) {
+    return adView
+  }
+
+  adView.adUnitId = BANNER_ADUNIT_ID
+  val adSize = AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(context, width)
+  adView.setAdSize(adSize)
+
+  adView.adListener =
+    object : AdListener() {
+      override fun onAdLoaded() {
+        Log.d(TAG, "Banner ad was loaded.")
+      }
+
+      override fun onAdFailedToLoad(error: LoadAdError) {
+        Log.e(TAG, "Banner ad failed to load.")
+      }
+
+      override fun onAdImpression() {
+        Log.d(TAG, "Banner ad had an impression.")
+      }
+
+      override fun onAdClicked() {
+        Log.d(TAG, "Banner ad was clicked.")
+      }
+    }
+
+  val adRequest = AdRequest.Builder().build()
+  adView.loadAd(adRequest)
+  return adView
+}
+
+@Preview
+@Composable
+private fun BannerScreenPreview() {
+  JetpackComposeDemoTheme {
+    Surface(color = MaterialTheme.colorScheme.background) { BannerScreen() }
+  }
+}

kotlin/advanced/JetpackComposeDemo/app/src/main/java/com/google/android/gms/example/jetpackcomposedemo/GoogleMobileAdsApplication.kt

@@ -21,5 +21,7 @@ import android.app.Application
 class GoogleMobileAdsApplication : Application() {
   companion object {
     const val TAG = "GoogleMobileAdsSample"
+
+    const val BANNER_ADUNIT_ID = "ca-app-pub-3940256099942544/9214589741"
   }
 }

kotlin/advanced/JetpackComposeDemo/app/src/main/java/com/google/android/gms/example/jetpackcomposedemo/HomeScreen.kt

@@ -0,0 +1,43 @@
+package com.google.android.gms.example.jetpackcomposedemo
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material3.Button
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.navigation.NavHostController
+import androidx.navigation.compose.rememberNavController
+import com.example.jetpackcomposedemo.R
+import com.google.android.gms.example.jetpackcomposedemo.ui.theme.JetpackComposeDemoTheme
+
+@Composable
+fun HomeScreen(
+  uiState: MainUiState,
+  navController: NavHostController,
+  modifier: Modifier = Modifier,
+) {
+  Column {
+    Button(
+      onClick = { navController.navigate(NavDestinations.Banner.name) },
+      enabled = uiState.canRequestAds,
+      modifier = modifier.fillMaxWidth(),
+    ) {
+      Text(LocalContext.current.getString(R.string.nav_banner))
+    }
+  }
+}
+
+@Preview
+@Composable
+private fun HomeScreenPreview() {
+  JetpackComposeDemoTheme {
+    Surface(color = MaterialTheme.colorScheme.background) {
+      HomeScreen(MainUiState(), rememberNavController())
+    }
+  }
+}

kotlin/advanced/JetpackComposeDemo/app/src/main/java/com/google/android/gms/example/jetpackcomposedemo/MainActivity.kt

@@ -22,7 +22,6 @@ import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
 import androidx.lifecycle.lifecycleScope
-import com.example.jetpackcomposedemo.R
 import com.google.android.gms.ads.MobileAds
 import kotlinx.coroutines.launch
 
@@ -38,7 +37,7 @@ class MainActivity : ComponentActivity() {
     // Log the Mobile Ads SDK version.
     Log.d(
       GoogleMobileAdsApplication.TAG,
-      getString(R.string.version_format, MobileAds.getVersion()),
+      "Google Mobile Ads SDK Version: ${MobileAds.getVersion()}",
     )
 
     // Initialize the view model. This will gather consent and initialize Google Mobile Ads.

kotlin/advanced/JetpackComposeDemo/app/src/main/java/com/google/android/gms/example/jetpackcomposedemo/MainScreen.kt

@@ -3,6 +3,7 @@ package com.google.android.gms.example.jetpackcomposedemo
 import android.content.Context
 import android.content.ContextWrapper
 import androidx.activity.ComponentActivity
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
@@ -72,11 +73,12 @@ fun MainScreen(googleMobileAdsViewModel: MainViewModel, modifier: Modifier = Mod
       )
     },
     contentWindowInsets =
-      WindowInsets.systemBars.only(WindowInsetsSides.Top + WindowInsetsSides.Horizontal),
+      WindowInsets.systemBars.only(WindowInsetsSides.Vertical + WindowInsetsSides.Horizontal),
   ) { innerPadding ->
     Column(Modifier.padding(innerPadding)) {
       NavHost(navController = navController, startDestination = NavDestinations.Home.name) {
-        composable(NavDestinations.Home.name) {}
+        composable(NavDestinations.Home.name) { HomeScreen(uiState, navController) }
+        composable(NavDestinations.Banner.name) { BannerScreen() }
       }
       Spacer(Modifier.windowInsetsBottomHeight(WindowInsets.systemBars))
     }

kotlin/advanced/JetpackComposeDemo/app/src/main/java/com/google/android/gms/example/jetpackcomposedemo/NavDestinations.kt

@@ -1,5 +1,6 @@
 package com.google.android.gms.example.jetpackcomposedemo
 
 enum class NavDestinations {
-  Home
+  Home,
+  Banner,
 }

kotlin/advanced/JetpackComposeDemo/app/src/main/res/values/strings.xml

@@ -1,8 +1,9 @@
 <resources>
   <string name="app_name">Google Mobile Ads Jetpack Compose Demo</string>
-  <string name="adinspector_open_button">Ad inspector</string>
+  <string name="adinspector_open_button">Ad Inspector</string>
   <string name="main_title">Jetpack Compose Demo</string>
   <string name="nav_home">Home</string>
+  <string name="nav_banner">Banner</string>
   <string name="privacy_options_open_button">Show Privacy Options Form</string>
-  <string name="version_format">Google Mobile Ads SDK Version: %s </string>
+  <string name="text_reload">Reload Ad</string>
 </resources>

kotlin/advanced/JetpackComposeDemo/compose-util/build.gradle.kts

@@ -30,12 +30,13 @@ android {
 
 dependencies {
   implementation("androidx.core:core-ktx:1.13.1")
-  implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.8.3")
+  implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.8.4")
   implementation(platform("androidx.compose:compose-bom:2024.06.00"))
   implementation("androidx.compose.ui:ui")
   implementation("androidx.compose.ui:ui-graphics")
   implementation("androidx.compose.material3:material3")
   implementation("androidx.compose.foundation:foundation")
   implementation("com.google.android.gms:play-services-ads:23.2.0")
+  implementation("androidx.lifecycle:lifecycle-runtime-compose:2.8.4")
   debugImplementation("androidx.compose.ui:ui-tooling")
 }

kotlin/advanced/JetpackComposeDemo/compose-util/src/main/java/com/google/android/gms/compose_util/BannerAd.kt

@@ -0,0 +1,76 @@
+package com.google.android.gms.compose_util
+
+/*
+ * Copyright 2024 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import android.view.ViewGroup
+import android.widget.FrameLayout
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalInspectionMode
+import androidx.compose.ui.viewinterop.AndroidView
+import androidx.lifecycle.compose.LifecycleResumeEffect
+import com.google.android.gms.ads.AdView
+
+/**
+ * A composable function to display a banner advertisement.
+ *
+ * @param adView The banner [AdView].
+ * @param modifier The modifier to apply to the banner ad.
+ */
+@Composable
+fun BannerAd(adView: AdView, modifier: Modifier = Modifier) {
+  var parent by remember { mutableStateOf<FrameLayout?>(null) }
+  // Ad load does not work in preview mode because it requires a network connection.
+  if (LocalInspectionMode.current) {
+    Box { Text(text = "Google Mobile Ads preview banner.", modifier.align(Alignment.Center)) }
+    return
+  }
+
+  AndroidView(
+    modifier = modifier.wrapContentSize(),
+    factory = { context -> FrameLayout(context).also { parent = it } },
+    update = { layout ->
+      disposeLayout(adView, layout)
+      layout.addView(adView)
+    },
+  )
+
+  // Pause and resume the AdView when the lifecycle is paused and resumed.
+  LifecycleResumeEffect(adView) {
+    adView.resume()
+    onPauseOrDispose { adView.pause() }
+  }
+
+  // Clean up the AdView after use.
+  DisposableEffect(Unit) { onDispose { disposeLayout(adView, parent) } }
+}
+
+/** Clean up the AdView after use. */
+private fun disposeLayout(adView: AdView, layout: FrameLayout?) {
+  // Ensure AdViews and Composable references are up to date.
+  (adView.parent as? ViewGroup)?.removeView(adView)
+  layout?.removeAllViews()
+}