• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# @ohos.advertising.AdComponent (Non-Full-Screen Ad Component)
2
3The AdComponent module provides the capability of displaying non-full-screen ads.
4
5> **NOTE**
6> The initial APIs of this module are supported since API version 11. Newly added APIs will be marked with a superscript to indicate their earliest API version.
7
8## Modules to Import
9
10```ts
11import { AdComponent } from '@kit.AdsKit';
12```
13
14## AdComponent
15
16AdComponent(ads: advertising.Advertisement[], displayOptions: advertising.AdDisplayOptions, interactionListener: advertising.AdInteractionListener, @BuilderParam adRenderer?: () => void, @Prop rollPlayState?: number): void
17
18Component that displays a non-full-screen ad.
19
20**System capability**: SystemCapability.Advertising.Ads
21
22**Parameters**
23
24| Name                        | Type                                                                               | Mandatory| Description                                                      |
25|-----------------------------|-----------------------------------------------------------------------------------|----|----------------------------------------------------------|
26| ads                         | advertising.[Advertisement](js-apis-advertising.md#advertisement)[]               | Yes | Array of ad objects.<br>**Atomic service API**: This API can be used in atomic services since API version 12.  |
27| displayOptions              | advertising.[AdDisplayOptions](js-apis-advertising.md#addisplayoptions)           | Yes | Ad display parameters.<br>**Atomic service API**: This API can be used in atomic services since API version 12.  |
28| interactionListener         | advertising.[AdInteractionListener](js-apis-advertising.md#adinteractionlistener) | Yes | Ad status change callback.<br>**Atomic service API**: This API can be used in atomic services since API version 12.|
29| adRenderer<sup>12+</sup>    | () => void                                                                        | No | Ad self-rendering.                                              |
30| rollPlayState<sup>15+</sup> | number                                                                            | No | Roll ad state. The value **1** means that the roll ad is played, and the value **2** means that the roll ad is paused. Other values are invalid and the previous playback state is not changed.          |
31
32**Example**
33
34```ts
35import { AdComponent, advertising } from '@kit.AdsKit';
36import { hilog } from '@kit.PerformanceAnalysisKit';
37
38@Entry
39@Component
40struct Index {
41  // Requested ad content.
42  private ads: advertising.Advertisement[] = [];
43  // Ad display parameters.
44  private adDisplayOptions: advertising.AdDisplayOptions = {
45    // Whether to mute the ad. By default, the ad is not muted.
46    mute: false
47  };
48
49  build() {
50    Column() {
51      // The AdComponent is used to show a non-full-screen ad.
52      AdComponent({
53        ads: this.ads,
54        displayOptions: this.adDisplayOptions,
55        interactionListener: {
56          // Ad status change callback.
57          onStatusChanged: (status: string, ad: advertising.Advertisement, data: string) => {
58            switch (status) {
59              case 'onAdOpen':
60                hilog.info(0x0000, 'testTag', 'onAdOpen');
61                break;
62              case 'onAdClick':
63                hilog.info(0x0000, 'testTag', 'onAdClick');
64                break;
65              case 'onAdClose':
66                hilog.info(0x0000, 'testTag', 'onAdClose');
67                break;
68            }
69          }
70        }
71      })
72        .width('100%')
73        .height('100%')
74    }
75    .width('100%')
76    .height('100%')
77  }
78}
79```
80