简介

开屏广告是一种在应用启动时且在应用主界面显示之前需要被展示的广告。您需要预先为App设计一张开屏默认Slogan图片,确保在未获得到开屏广告之前展示默认Slogan,提供良好的用户体验。

此codelab将引导您在应用中增加开屏广告的展示。在整个过程中,将介绍添加代码的详细过程以正确展示开屏广告。

您将建立什么

您将在您的应用中通过HUAWEI Ads SDK获取开屏广告、定制开屏广告样式和展示开屏广告。

您将会学到什么

硬件要求

支持EMUI 3.0及以上的华为手机、华为平板。

软件要求

需要的知识点

Android基础开发能力。

在Android Studio中创建项目

  1. 打开Android Studio。
  2. 创建新项目,选择"Empty Activity",命名为"SplashAdExample"。
  3. 点击"完成"。

配置HUAWEI VAST SDK仓库及依赖包

  1. 配置Maven仓地址。

    Android Studio的代码库配置在Gradle 插件7.0以下版本、7.0版本和7.1及以上版本有所不同。请根据您当前的Gradle 插件版本,选择对应的配置过程。

    7.0以下版本

    7.0版本

    7.1及以上版本

    • 7.0以下版本
      i.  打开Android Studio项目级"build.gradle"文件。


      ii.  添加Maven代码库。

      • 在"buildscript > repositories"中配置Maven仓地址。
      • 在"allprojects > repositories"中配置Maven仓地址。
      buildscript { repositories { google() jcenter() // 配置HUAWEI Ads SDK的Maven仓地址 maven {url 'https://developer.huawei.com/repo/'} } } allprojects { repositories { google() jcenter() // 配置HUAWEI Ads SDK的Maven仓地址 maven {url 'https://developer.huawei.com/repo/'} } }
    • 7.0版本
      i.  打开Android Studio项目级"build.gradle"文件。


      ii.  添加Maven代码库。

        在"buildscript > repositories"中配置Maven仓地址。

      buildscript { repositories { google() jcenter() // 配置HUAWEI Ads SDK的Maven仓地址 maven {url 'https://developer.huawei.com/repo/'} } }

      iii.  打开项目级"settings.gradle"文件,配置Maven仓地址。

      dependencyResolutionManagement { ... repositories { google() jcenter() // 配置HUAWEI Ads SDK的Maven仓地址 maven {url 'https://developer.huawei.com/repo/'} } }
    • 7.1及以上版本
      打开项目级"settings.gradle"文件,配置Maven仓地址。

      pluginManagement { repositories { gradlePluginPortal() google() mavenCentral() // 配置HUAWEI Ads SDK的Maven仓地址 maven { url 'https://developer.huawei.com/repo/' } } } dependencyResolutionManagement { ... repositories { google() mavenCentral() // 配置HUAWEI Ads SDK的Maven仓地址 maven { url 'https://developer.huawei.com/repo/' } } }
  2. 在应用级"build.gradle"文件中配置依赖包,需添加下面内容,并将{version}替换为实际的HUAWEI Ads SDK版本号,请参见版本更新说明
    dependencies { ... implementation 'com.huawei.hms:ads-lite:{version}' ... }
  3. 点击"Sync Now"等待同步完成。

配置混淆脚本

您编译APK前需要配置不要混淆HUAWEI Ads SDK,避免功能异常。
打开Android工程应用级根目录下的"app/proguard-rules.pro"混淆配置文件,添加如下两行代码,加入排除HUAWEI Ads SDK的混淆配置。

-keep class com.huawei.openalliance.ad.** { *; } -keep class com.huawei.hms.ads.** { *; }

对于开屏广告,HUAWEI Ads SDK提供了广告视图类SplashView,用于获取和展示开屏广告。
现在,您将使用布局XML文件方式设置开屏广告视图的布局。为了节省时间,您可以使用下面创建好的XML内容。

  1. 在"res/layout/"目录下新增"activity_splash.xml"文件,并在文件中添加以下列出的XML内容。
    <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".SplashActivity"> <RelativeLayout android:id="@+id/logo_area" android:layout_width="match_parent" android:layout_height="100dp" android:layout_alignParentBottom="true" android:background="@android:color/white" android:visibility="visible"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_marginBottom="39dp" android:orientation="vertical"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginBottom="6dp" android:gravity="center" android:orientation="horizontal"> <ImageView android:layout_width="28dp" android:layout_height="28dp" android:background="@mipmap/ic_launcher" /> <View android:layout_width="0.5dp" android:layout_height="18dp" android:layout_marginLeft="12dp" android:layout_marginRight="12dp" android:alpha="0.1" android:background="#000000" /> <!-- 注意:将app_name改为应用程序名称 --> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:alpha="1" android:text="@string/app_name" android:textColor="@android:color/black" android:textSize="16sp" /> </LinearLayout> <!-- 注意:将copyright_info更改为公司的版权信息 --> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:alpha="0.5" android:text="@string/copyright_info" android:textColor="@android:color/black" android:textSize="8sp" /> </LinearLayout> </RelativeLayout> <com.huawei.hms.ads.splash.SplashView android:id="@+id/splash_ad_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@id/logo_area" /> </RelativeLayout>
  2. 在"res/values/strings.xml"中增加下面内容。
    <resources> ... <string name="app_name">SplashAdExample</string> <string name="ad_id_splash">testd7c5cewoj6</string> <string name="ad_id_splash_landscape">testq6zq98hecj</string> <string name="copyright_info">Copyright 2020. X Technologies Co., Ltd</string> <string name="status_load_ad_success">Ad loading state: loaded successfully.</string> <string name="status_load_ad_fail">Ad loading state: failed to be loaded. Error code: </string> <string name="status_ad_dismissed">Ad is dismissed.</string> ... </resources>

创建开屏广告Activity类

您需要创建SplashActivity类,用于实现开屏广告获取和展示。内容如下:

import android.os.Bundle; import android.app.Activity; public class SplashActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_splash); } }

初始化HUAWEI Ads SDK

要借助于HUAWEI Ads SDK获取广告,必须先在您的应用中调用HwAds.init()方法初始化SDK,此过程需要在应用程序启动时完成,在应用后续运行过程中无需重复执行此过程。
在SplashActivity类的onCreate()方法中调用HwAds.init()以执行HUAWEI Ads SDK初始化。

import com.huawei.hms.ads.HwAds; ... public class SplashActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_splash); // 初始化HUAWEI Ads SDK HwAds.init(this); ... } ... }

修改AndroidManifest.xml

您需将默认启动的activity修改为SplashActivity,这样即可在应用主界面加载前展示开屏广告。修改后的内容如下:

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.huawei.splashadexample"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".SplashActivity" android:exported="false" android:screenOrientation="fullSensor" android:configChanges="orientation|screenSize" android:theme="@android:style/Theme.NoTitleBar.Fullscreen"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".MainActivity" android:exported="false"> </activity> </application> </manifest>

您将使用SplashView类的load方法获取开屏广告,在调用时可设置广告位ID、设置屏幕方向、设置广告参数和广告加载状态监听器。还可通过setAdDisplayListener方法设置广告展示状态监听器。完整代码如下。

import android.app.Activity; import android.content.Intent; import android.content.pm.ActivityInfo; import android.content.res.Configuration; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.util.Log; import android.widget.Toast; import androidx.annotation.NonNull; import com.huawei.hms.ads.AdParam; import com.huawei.hms.ads.AudioFocusType; import com.huawei.hms.ads.HwAds; import com.huawei.hms.ads.splash.SplashAdDisplayListener; import com.huawei.hms.ads.splash.SplashView; public class SplashActivity extends Activity{ private static final String TAG = SplashActivity.class.getSimpleName(); // 广告展示超时时间,单位:毫秒 private static final int AD_TIMEOUT = 10000; // 广告展示超时消息标记 private static final int MSG_AD_TIMEOUT = 1001; /** * 暂停标志位。 * 在开屏广告页面展示时: * 按返回键退出应用时需设置为true,以确保应用主界面不被拉起; * 从其他页面回到开屏广告页面时需设置为false,以确保仍然可以正常跳转至应用主界面。 */ private boolean hasPaused = false; // 广告展示超时消息回调handler private Handler timeoutHandler = new Handler(new Handler.Callback() { @Override public boolean handleMessage(@NonNull Message msg) { if (SplashActivity.this.hasWindowFocus()) { jump(); } return false; } }); private SplashView splashView; private SplashView.SplashAdLoadListener splashAdLoadListener = new SplashView.SplashAdLoadListener() { @Override public void onAdLoaded() { // 广告获取成功时调用 Log.i(TAG, "SplashAdLoadListener onAdLoaded."); Toast.makeText(SplashActivity.this, getString(R.string.status_load_ad_success), Toast.LENGTH_SHORT).show(); } @Override public void onAdFailedToLoad(int errorCode) { // 广告获取失败时调用 Log.i(TAG, "SplashAdLoadListener onAdFailedToLoad, errorCode: " + errorCode); Toast.makeText(SplashActivity.this, getString(R.string.status_load_ad_fail) + errorCode, Toast.LENGTH_SHORT).show(); jump(); } @Override public void onAdDismissed() { // 广告展示完毕时调用 Log.i(TAG, "SplashAdLoadListener onAdDismissed."); Toast.makeText(SplashActivity.this, getString(R.string.status_ad_dismissed), Toast.LENGTH_SHORT).show(); jump(); } }; private SplashAdDisplayListener adDisplayListener = new SplashAdDisplayListener() { @Override public void onAdShowed() { // 广告显示时调用 Log.i(TAG, "SplashAdDisplayListener onAdShowed."); } @Override public void onAdClick() { // 广告被点击时调用 Log.i(TAG, "SplashAdDisplayListener onAdClick."); } }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_splash); // 初始化HUAWEI Ads SDK HwAds.init(this); loadAd(); } private void loadAd() { Log.i(TAG, "Start to load ad"); // 锁定设备当前屏幕方向,自适应横竖屏方向 setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LOCKED); int orientation = getScreenOrientation(); AdParam adParam = new AdParam.Builder().build(); splashView = findViewById(R.id.splash_ad_view); splashView.setAdDisplayListener(adDisplayListener); String slotId; // 根据当前屏幕方向设置默认Slogan和设置对应的广告位ID if (orientation == ActivityInfo.SCREEN_ORIENTATION_PORTRAIT) { splashView.setSloganResId(R.drawable.default_slogan); slotId = getString(R.string.ad_id_splash); } else { splashView.setSloganResId(R.drawable.default_slogan_landscape); slotId = getString(R.string.ad_id_splash_landscape); } splashView.setLogo(findViewById(R.id.logo_area)); // 设置logo图片 splashView.setLogoResId(R.mipmap.ic_launcher); // 设置logo描述 splashView.setMediaNameResId(R.string.app_name); // 设置视频类开屏广告的音频焦点类型 splashView.setAudioFocusType(AudioFocusType.NOT_GAIN_AUDIO_FOCUS_WHEN_MUTE); splashView.load(slotId, orientation, adParam, splashAdLoadListener); Log.i(TAG, "End to load ad"); // 移除消息队列中等待的超时消息 timeoutHandler.removeMessages(MSG_AD_TIMEOUT); // 发送延迟消息,用来处理广告展示超时时,能够正常跳转至应用主界面 timeoutHandler.sendEmptyMessageDelayed(MSG_AD_TIMEOUT, AD_TIMEOUT); } private int getScreenOrientation() { Configuration config = getResources().getConfiguration(); if (config.orientation == Configuration.ORIENTATION_LANDSCAPE) { return ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE; } else { return ActivityInfo.SCREEN_ORIENTATION_PORTRAIT; } } /** * 广告展示完毕时,从广告界面跳转至应用主界面 */ private void jump() { Log.i(TAG, "jump hasPaused: " + hasPaused); if (!hasPaused) { hasPaused = true; Log.i(TAG, "jump into application"); startActivity(new Intent(SplashActivity.this, MainActivity.class)); Handler mainHandler = new Handler(); mainHandler.postDelayed(new Runnable() { @Override public void run() { finish(); } }, 1000); } } /** * 按返回键退出应用时需设置为true,以确保应用主界面不被拉起 */ @Override protected void onStop() { Log.i(TAG, "SplashActivity onStop."); // 移除消息队列中等待的超时消息 timeoutHandler.removeMessages(MSG_AD_TIMEOUT); hasPaused = true; super.onStop(); } /** * 从其他页面回到开屏页面时调用,进入应用主界面 */ @Override protected void onRestart() { Log.i(TAG, "SplashActivity onRestart."); super.onRestart(); hasPaused = false; jump(); } @Override protected void onDestroy() { Log.i(TAG, "SplashActivity onDestroy."); super.onDestroy(); if (splashView != null) { splashView.destroyView(); } } @Override protected void onPause() { Log.i(TAG, "SplashActivity onPause."); super.onPause(); if (splashView != null) { splashView.pauseView(); } } @Override protected void onResume() { Log.i(TAG, "SplashActivity onResume."); super.onResume(); if (splashView != null) { splashView.resumeView(); } } }

运行项目后,您将会在应用中看到开屏广告。

祝贺您,您已经成功完成了codelab并学到了:

您可以阅读链接,了解更多相关的信息:开发指南API文档FAQ
您还可以点击源码下载

Code copied