• 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**Atomic service API**: This API can be used in atomic services since API version 12.
21
22**System capability**: SystemCapability.Advertising.Ads
23
24**Parameters**
25
26| Name                     | Type                                                                             | Mandatory| Description                                                                                             |
27|-----------------------------|-----------------------------------------------------------------------------------|-----|-------------------------------------------------------------------------------------------------|
28| 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.               |
29| 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.               |
30| 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.           |
31| adRenderer<sup>12+</sup>    | () => void                                                                        | No  | Ad self-rendering.                                                                              |
32| 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. If this parameter is left empty, the default value is **2**.|
33
34**Example**
35
36```ts
37import { AdComponent, advertising } from '@kit.AdsKit';
38import { hilog } from '@kit.PerformanceAnalysisKit';
39
40@Entry
41@Component
42struct Index {
43  // Requested ad content.
44  private ads: advertising.Advertisement[] = [];
45  // Ad display parameters.
46  private adDisplayOptions: advertising.AdDisplayOptions = {
47    // Whether to mute the ad. By default, the ad is not muted.
48    mute: false
49  };
50
51  build() {
52    Column() {
53      // The AdComponent is used to show a non-full-screen ad.
54      AdComponent({
55        ads: this.ads,
56        displayOptions: this.adDisplayOptions,
57        interactionListener: {
58          // Ad status change callback.
59          onStatusChanged: (status: string, ad: advertising.Advertisement, data: string) => {
60            switch (status) {
61              case 'onAdOpen':
62                hilog.info(0x0000, 'testTag', 'onAdOpen');
63                break;
64              case 'onAdClick':
65                hilog.info(0x0000, 'testTag', 'onAdClick');
66                break;
67              case 'onAdClose':
68                hilog.info(0x0000, 'testTag', 'onAdClose');
69                break;
70            }
71          }
72        }
73      })
74        .width('100%')
75        .height('100%')
76    }
77    .width('100%')
78    .height('100%')
79  }
80}
81```
82
83## build
84
85build(): void
86
87A constructor used to create an **AdComponent** object.
88
89**Atomic service API**: This API can be used in atomic services since API version 12.
90
91**System capability**: SystemCapability.Advertising.Ads
92