English
Log In
You can then view all documents
GroMore/开发测试/GroMore Harmony集成文档/Banner广告
Banner广告
Last updated 2026-03-19 17:03:27

一、简介

banner广告是在内容底部或顶部显示的小条形广告, 暂不支持在列表中使用。不支持开发者对广告样式进行编辑和渲染,可直接调用相关接口进行广告展示。原生横幅广告内容与其他内容区分开,周围应留出空间防止意外点击,不应将横幅广告放置于文本、图片和应用的其他可点击部分,避免误点。

二、配置说明

支持模板渲染和原生广告自渲染。

三、原生自渲染广告

1. 构建请求参数

1.1 使用示例

初始化广告创建器

复制

构建广告请求参数AdSlot

复制

1.2 接口说明

接口

是否必填

类型

含义

setCodeId(codeId:string)

string

您在平台上申请的代码位ID,以9开头9位数字

.setAcceptSize(350, 300)

number

广告UI size,默认单位vp

2. 请求及展示广告

2.1 使用示例

开发者调用loadNativeAd加载广告后,在onNativeAdLoad方法中获取到CSJFeedAd对象后获取广告元素进行自渲染

需要注意的是,如果打开了支持模板样式开关 supportRenderControl(),需要通过设置模板加载成功监听器来确保广告可用,并调用render方法渲染广告;

复制

视频展示:展示广告时需要通过NodeContainer容器承载广告图片|视频UI,其它部分包括标题,描述等需自定义渲染,详细代码见Demo的BannerNativeAdPage文件。

复制

图片展示:展示图片广告时,可以通过getImageList(): ArrayList<CSJImage>|undefine获取图片,并自定义渲染;

注意:自定义图片类型需要通过图片对象本身CSJImage获取宽getWidth()getHeight()

复制

2.2 接口说明

  • CSJNativeAdListene

接口

参数

含义

onNativeAdLoad(ads:ArrayList<CSJNativeAd> )

ads:广告信息列表CSJNativeAd:广告对象

广告基础信息加载完成,此方法是回调后是广告可调用展示的最早时机

onError(code: number, message: string)

code:错误码
message:错误信息

若加载中出错,会回调此方法

3. 注册Banner自渲染广告计费事件

通过registerViewForInteraction方法注册原生自渲染广告计费事件和交互事件,方法说明如下,其中CSJArrayList类为CSJ提供的集合容器继承自ArrayList;该容器主要作用是收集注册点击事件的UI组件Id;注册案例详见demo的BannerNativeAdPage文件。

注意:UI组件id在应用中必须保持唯一(华为鸿蒙官方要求)

registerViewForInteraction中不再提供CSJAdInteractionListener回调监听设置;请通过广告对象的setAdInteractionListener()方法设置。

复制

4. 监听广告交互状态(可选)

在调用展示广告前,创建广告交互监听器,用于实时获取广告展示状态,通过广告对象的setAdInteractionListener()方法设置。

4.1 使用示例

复制

4.2 接口说明

  • CSJAdInteractionListener

接口

参数

含义

onAdShow(ad: CSJNativeAd)

ad:广告对象

广告展示

onAdClicked(ad: CSJNativeAd)

ad:广告对象

广告被用户点击普通区域回调,如标题,描述等

onAdCreativeClick(ad: CSJNativeAd)

ad:广告对象

广告被用户点击创意区域回调,如下载button

  • CSJNativeAd 接口说明

方法名

说明

getTitle()

广告标题

getDescription()

广告描述

getButtonText()

广告创意按钮文案

getAppScore()

广告app评分

getSource()

广告来源

getInteractionType()

原生广告交互类型,返回值为number类型:3跳落地页;4调起或下载。

getImageMode()

原生广告图片模式

getComplianceInfo()

应用下载相关信息

getDislikeDialog():

得到Dislike dialog

getAdComponent()

获取广告UI组件

getMediaExtraInfo()

返回广告额外信息

render(context: UIContext)

渲染模板广告,渲染成功后通过getAdComponent()可获取到渲染成功的广告

destroy()

资源释放

getIcon()

广告图标Image

getAdLogo()

获取穿山甲logo

getAppCommentNum()

广告app评论数

getImageList(): ArrayList<CSJImage>|undefined;

返回图片列表

getFilterWords()

获得Dislike相关信息,即获得负反馈词组

isExpressAd()

判断是否为模板广告

setAdInteractionListener(listener: CSJAdInteractionListener)

设置交互监听

setExpressRenderListener( listener:ExpressRenderListener)

设置模板渲染回调监听

setDislikeCallback(callback: CSJDislikeInteractionCallback)

设置dislike监听

onAdClick(clickType: number, eventClick: ClickEvent)

logo点击;clickType CSJConstant.TYPE_CLICK_LOGO 点穿山甲Logo事件

  • CSJDislikeInteractionCallback

方法名

说明

onShow()

dislike 弹窗show

onSelected: (position: number, value: string, enforce: boolean)

Dislike:条目被选中position:条目的indexvalue:条目的内容enforce:是否强制关闭广告

onCancel()

Dislike 弹窗取消

setCustomDislikeComponent(customDislikeBuilder: WrappedBuilder<[ fwList: Array<FilterWord>, onSelected: (filterPosition: number, filterName: string) => void, onOtherSuggestComment: (suggestionValue: string) => void, onUserSuggestDialogCancel: (commentValue: string) => void]>): void;

自定义Dislike 设置

5. 聚合功能说明

聚合维度暂不支持自渲染Banner广告样式。

6. 资源

CSJ原生自渲染Banner广告请参考demo中的adtype/banner/BannerNativeAdPage.ets接入示例。

四、模板Banner广告

1. 构建请求参数

1.1 使用示例

初始化广告创建器

复制

构建广告请求参数AdSlot

复制

1.2 接口说明

接口

是否必填

类型

含义

setCodeId()

String

您在平台上申请的代码位Id,以9开头9位数字

setAcceptSize(350, 300)

number

广告UI size,默认单位vp

2. 请求及展示广告

2.1 使用示例

开发者调用loadBannerAd加载广告后,在onNativeExpressAdLoad方法中获取到CSJNativeExpressAd对象后展示.

复制

展示广告时需要通过NodeContainer容器承载广告模板UI,详细代码见Demo的FeedExpressAdPage文件,广告加载成功之后并在展示之前,需要调用 ad.render(this.getUIContext())方法渲染广告,渲染成功后方可展示。

复制

2.2 接口说明

  • NativeExpressAdListener

方法

参数

说明

onNativeExpressAdLoad: (ads: ArrayList<CSJNativeExpressAd>)

ads:广告信息列表CSJNativeExpressAd:banner模板广告

广告基础信息加载完成,此方法是回调后是广告可调用展示的最早时机

onError(code: number, message: string)

code:错误码
message:错误信息

若加载中出错,会回调此方法

  • CSJNativeExpressAd

方法

说明

getInteractionType()

原生广告交互类型,返回值为number类型:3跳落地页;4调起或下载。

getImageMode()

原生广告样式模式:大图,组图,视频,三图,小图

getDislikeDialog()

得到Dislike dialog

getAdComponent()

获取广告UI组件

getMediaExtraInfo()

返回广告额外信息

render(context: UIContext)

渲染模板广告,渲染成功后通过getAdComponent()可获取到渲染成功的广告

destroy()

资源释放

getFilterWords()

获得Dislike相关信息,即获得负反馈词组

setExpressInteractionListener(listener: ExpressAdInteractionListener)

设置广告交互监听器

setDislikeCallback(callback: CSJDislikeInteractionCallback)

设置dislike监听

setVideoAdListener(videoAdListener: ExpressVideoAdListener)

设置Video监听

setSlideIntervalTime(intervalTime: number)

Banner广告轮播的间隔时间,允许值在30 * 1000 ~ 120 * 1000之间

3. 监听广告行为(可选)

3.1 使用示例

复制

3.2 接口说明

在调用展示广告前,创建广告交互监听器,用于实时获取广告展示状态。

接口

参数

含义

onAdShow(type: number)

type:广告交互类型

广告展示

onAdClicked(type: number)

type:广告交互类型

广告被用户点击回调

onRenderSuccess: (width: number, height: number)

width & height 广告宽高大小

在调用广告的render方法后,广告渲染成功,会回调该方法,此时表示广告已准备好,待展示

onRenderFail: (code: number, msg: string)

code:渲染错误码,msg:渲染错误信息

模板渲染失败

4. 广告视频监听(可选)

4.1 使用示例

在调用展示广告前,如果是视频类型广告,可以创建广告视频监听器,用于实时获取广告视频的播放状态。

复制

4.2 接口说明

接口

参数

含义

onVideoLoad()

/

视频加载完成

onVideoAdStartPlay()

/

视频开始播放第一帧

onVideoAdPaused()

/

视频暂停播放

onVideoAdContinuePlay()

/

视频继续播放

onProgressUpdate(current: number, duration: number)

current:当前播放进度,
duration:视频总时间长

视频播放进度

onVideoAdComplete()

/

视频播放完成

onVideoError(errorCode: number, errorMsg: string)

errorCode:错误码,
msg:错误信息

视频加载失败

5. 设置banner轮播

复制

6. 聚合功能说明

6.1 使用示例

仅穿山甲支持设置banner轮播,聚合不支持

复制

6.2 接口说明

  • CSJNativeExpressAd说明

获取广告展示基本信息

方法

说明

getMediationAdInfo()

返回聚合相关信息

  • MediationAdEcpmInfo说明

方法

返回值

说明

getAdnName()

string

返回展示广告的adn名称

getAdnRitId()

string

返回展示广告的adn代码位

getEcpm()

number

返回展示广告的价格

getBiddingType()

number

返回展示广告的竞价类型0为普通广告位,1 client竞价广告 2 server竞价广告 100 P层数据

getRitType()

string

返回展示广告的广告类型"Banner" "Splash" "RewardVideo" "FullVideo" "Native" "Draw" "Interstitial" "InterstitialFull"

五、资源

穿山甲模版Banner广告请参考demo中的BannerExpressAdPage.ets接入示例,聚合维度模版Banner广告请参考demo中的mediation_adtype/banner/BannerExpressAdPage.ets接入示例。


Contents
Contact us