• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2024-2025 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16let __decorate = (this && this.__decorate) || function (t1, target, key, desc) {
17  let c = arguments.length;
18  let r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc;
19  let d;
20  if (typeof Reflect === 'object' && typeof Reflect.v1 === 'function') {
21    r = Reflect.v1(t1, target, key, desc);
22  } else {
23    for (let u1 = t1.length - 1; u1 >= 0; u1--) {
24      (d = t1[u1]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
25    }
26  }
27  return c > 3 && r && Object.defineProperty(target, key, r), r;
28};
29if (!('finalizeConstruction' in ViewPU.prototype)) {
30  Reflect.set(ViewPU.prototype, 'finalizeConstruction', () => { });
31}
32const LengthMetrics = requireNapi('arkui.node').LengthMetrics;
33const LengthUnit = requireNapi('arkui.node').LengthUnit;
34const ColorMetrics = requireNapi('arkui.node').ColorMetrics;
35const DividerModifier = requireNapi('arkui.modifier').DividerModifier;
36const hilog = requireNapi('hilog');
37const promptAction = requireNapi('promptAction');
38
39export let ToolBarV2ItemState;
40(function (ToolBarV2ItemState) {
41  ToolBarV2ItemState[ToolBarV2ItemState.ENABLE = 1] = 'ENABLE';
42  ToolBarV2ItemState[ToolBarV2ItemState.DISABLE = 2] = 'DISABLE';
43  ToolBarV2ItemState[ToolBarV2ItemState.ACTIVATE = 3] = 'ACTIVATE';
44})(ToolBarV2ItemState || (ToolBarV2ItemState = {}));
45const j = {
46  'id': -1, 'type': 40000,
47  params: ['sys.symbol.dot_grid_2x2'],
48  'bundleName': '__harDefaultBundleName__',
49  'moduleName': '__harDefaultModuleName__' };
50const m = '24vp';
51const o = 56;
52const t = 5;
53const u = 3.2;
54const a1 = '64vp';
55const b1 = '256vp';
56const c1 = '216vp';
57const d1 = '18.3fp';
58const e1 = 640;
59const f1 = 6;
60const g1 = 1;
61const h1 = -2;
62const i1 = 2;
63const j1 = 40000;
64class Util {
65  static b2(v1) {
66    if (!Util.c2(v1)) {
67      return false;
68    }
69    let resource = v1;
70    return resource.type === j1;
71  }
72  static c2(resource) {
73    if (!resource) {
74      return false;
75    }
76    if (typeof resource === 'string' || typeof resource === 'undefined') {
77      return false;
78    }
79    return true;
80  }
81}
82let ToolBarV2SymbolGlyph = class ToolBarV2SymbolGlyph {
83  constructor(options) {
84    this.normal = options.normal;
85    this.activated = options.activated;
86  }
87};
88__decorate([
89  Trace
90], ToolBarV2SymbolGlyph.prototype, 'normal', void 0);
91__decorate([
92  Trace
93], ToolBarV2SymbolGlyph.prototype, 'activated', void 0);
94ToolBarV2SymbolGlyph = __decorate([
95  ObservedV2
96], ToolBarV2SymbolGlyph);
97export { ToolBarV2SymbolGlyph };
98class ButtonGestureModifier {
99  constructor() {
100    this.d2 = undefined;
101  }
102  applyGesture(event) {
103    this.d2?.(event);
104  }
105}
106ButtonGestureModifier.e2 = 500;
107ButtonGestureModifier.minFontSize = 1.75;
108let ToolBarV2ItemText = class ToolBarV2ItemText {
109  constructor(options) {
110    this.color = ColorMetrics.resourceColor({
111      'id': -1,
112      'type': 10001,
113      params: ['sys.color.font_primary'],
114      'bundleName': '__harDefaultBundleName__',
115      'moduleName': '__harDefaultModuleName__' });
116    this.activatedColor = ColorMetrics.resourceColor({
117      'id': -1,
118      'type': 10001,
119      params: ['sys.color.font_emphasize'],
120      'bundleName': '__harDefaultBundleName__',
121      'moduleName': '__harDefaultModuleName__' });
122    this.text = options.text;
123    this.color = options.color;
124    this.activatedColor = options.activatedColor;
125  }
126};
127__decorate([
128  Trace
129], ToolBarV2ItemText.prototype, 'text', void 0);
130__decorate([
131  Trace
132], ToolBarV2ItemText.prototype, 'color', void 0);
133__decorate([
134  Trace
135], ToolBarV2ItemText.prototype, 'activatedColor', void 0);
136ToolBarV2ItemText = __decorate([
137  ObservedV2
138], ToolBarV2ItemText);
139export { ToolBarV2ItemText };
140let ToolBarV2ItemImage = class ToolBarV2ItemImage {
141  constructor(options) {
142    this.color = undefined;
143    this.activatedColor = undefined;
144    this.src = options.src;
145    this.color = options.color;
146    this.activatedColor = options.activatedColor;
147  }
148};
149__decorate([
150  Trace
151], ToolBarV2ItemImage.prototype, 'src', void 0);
152__decorate([
153  Trace
154], ToolBarV2ItemImage.prototype, 'color', void 0);
155__decorate([
156  Trace
157], ToolBarV2ItemImage.prototype, 'activatedColor', void 0);
158ToolBarV2ItemImage = __decorate([
159  ObservedV2
160], ToolBarV2ItemImage);
161export { ToolBarV2ItemImage };
162let ToolBarV2Item = class ToolBarV2Item {
163  constructor(options) {
164    this.content = new ToolBarV2ItemText({ text: '' });
165    this.action = undefined;
166    this.icon = undefined;
167    this.state = 1;
168    this.accessibilityText = '';
169    this.accessibilityDescription = '';
170    this.accessibilityLevel = 'auto';
171    this.backgroundColor = Color.Transparent;
172    this.content = options.content;
173    this.action = options.action;
174    this.icon = options.icon;
175    this.state = options.state;
176    this.accessibilityText = options.accessibilityText;
177    this.accessibilityDescription = options.accessibilityDescription;
178    this.accessibilityLevel = options.accessibilityLevel;
179  }
180  get symbol() {
181    if (this.icon instanceof ToolBarV2SymbolGlyph) {
182      return this.icon;
183    }
184    return undefined;
185  }
186  get image() {
187    if (!(this.icon instanceof ToolBarV2SymbolGlyph)) {
188      return this.icon;
189    }
190    return undefined;
191  }
192};
193__decorate([
194  Trace
195], ToolBarV2Item.prototype, 'content', void 0);
196__decorate([
197  Trace
198], ToolBarV2Item.prototype, 'action', void 0);
199__decorate([
200  Trace
201], ToolBarV2Item.prototype, 'icon', void 0);
202__decorate([
203  Trace
204], ToolBarV2Item.prototype, 'state', void 0);
205__decorate([
206  Trace
207], ToolBarV2Item.prototype, 'accessibilityText', void 0);
208__decorate([
209  Trace
210], ToolBarV2Item.prototype, 'accessibilityDescription', void 0);
211__decorate([
212  Trace
213], ToolBarV2Item.prototype, 'accessibilityLevel', void 0);
214__decorate([
215  Trace
216], ToolBarV2Item.prototype, 'backgroundColor', void 0);
217__decorate([
218  Computed
219], ToolBarV2Item.prototype, 'symbol', null);
220__decorate([
221  Computed
222], ToolBarV2Item.prototype, 'image', null);
223ToolBarV2Item = __decorate([
224  ObservedV2
225], ToolBarV2Item);
226export { ToolBarV2Item };
227let ToolBarV2Modifier = class ToolBarV2Modifier {
228  constructor() {
229    this.f2 = {
230      'id': -1,
231      'type': 10001,
232      params: ['sys.color.ohos_id_color_toolbar_bg'],
233      'bundleName': '__harDefaultBundleName__',
234      'moduleName': '__harDefaultModuleName__' };
235    this.g2 = LengthMetrics.vp(o);
236    this.h2 = true;
237    this.paddingValue = LengthMetrics.resource({
238      'id': -1,
239      'type': 10002,
240      params: ['sys.float.padding_level12'],
241      'bundleName': '__harDefaultBundleName__',
242      'moduleName': '__harDefaultModuleName__' });
243  }
244  applyNormalAttribute(instance) {
245    instance.backgroundColor(this.f2);
246  }
247  backgroundColor(backgroundColor) {
248    this.f2 = backgroundColor.color;
249    return this;
250  }
251  height(height) {
252    this.g2 = height;
253    return this;
254  }
255  stateEffect(stateEffect) {
256    this.h2 = stateEffect;
257    return this;
258  }
259  padding(padding) {
260    this.paddingValue = padding;
261    return this;
262  }
263};
264__decorate([
265  Trace
266], ToolBarV2Modifier.prototype, 'backgroundColorValue', void 0);
267__decorate([
268  Trace
269], ToolBarV2Modifier.prototype, 'heightValue', void 0);
270__decorate([
271  Trace
272], ToolBarV2Modifier.prototype, 'stateEffectValue', void 0);
273__decorate([
274  Trace
275], ToolBarV2Modifier.prototype, 'paddingValue', void 0);
276ToolBarV2Modifier = __decorate([
277  ObservedV2
278], ToolBarV2Modifier);
279export { ToolBarV2Modifier };
280let ToolBarV2Theme = class ToolBarV2Theme {
281  constructor() {
282    this.i2 = {
283      'id': -1,
284      'type': 10001,
285      params: ['sys.color.icon_primary'],
286      'bundleName': '__harDefaultBundleName__',
287      'moduleName': '__harDefaultModuleName__' };
288    this.j2 = {
289      'id': -1,
290      'type': 10001,
291      params: ['sys.color.icon_emphasize'],
292      'bundleName': '__harDefaultBundleName__',
293      'moduleName': '__harDefaultModuleName__' };
294    this.l2 = {
295      'id': -1,
296      'type': 10001,
297      params: ['sys.color.font_primary'],
298      'bundleName': '__harDefaultBundleName__',
299      'moduleName': '__harDefaultModuleName__' };
300    this.m2 = {
301      'id': -1,
302      'type': 10001,
303      params: ['sys.color.font_emphasize'],
304      'bundleName': '__harDefaultBundleName__',
305      'moduleName': '__harDefaultModuleName__' };
306  }
307};
308__decorate([
309  Trace
310], ToolBarV2Theme.prototype, 'iconPrimaryColor', void 0);
311__decorate([
312  Trace
313], ToolBarV2Theme.prototype, 'iconActivePrimaryColor', void 0);
314__decorate([
315  Trace
316], ToolBarV2Theme.prototype, 'fontPrimaryColor', void 0);
317__decorate([
318  Trace
319], ToolBarV2Theme.prototype, 'fontActivatedPrimaryColor', void 0);
320ToolBarV2Theme = __decorate([
321  ObservedV2
322], ToolBarV2Theme);
323export class ToolBarV2 extends ViewV2 {
324  constructor(parent, params, __localStorage, elmtId = -1, paramsLambda, extraInfo) {
325    super(parent, elmtId, extraInfo);
326    this.initParam('toolBarList', (params && 'toolBarList' in params) ? params.toolBarList : undefined);
327    this.initParam('activatedIndex', (params && 'activatedIndex' in params) ? params.activatedIndex : -1);
328    this.initParam('dividerModifier',
329      (params && 'dividerModifier' in params) ? params.dividerModifier : new DividerModifier());
330    this.initParam('toolBarModifier',
331      (params && 'toolBarModifier' in params) ? params.toolBarModifier : new ToolBarV2Modifier()
332        .padding(LengthMetrics.resource({
333          'id': -1, 'type': 10002,
334          params: ['sys.float.padding_level12'],
335          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' }))
336        .stateEffect(true)
337        .height(LengthMetrics.vp(o))
338        .backgroundColor(ColorMetrics.resourceColor({
339          'id': -1, 'type': 10001,
340          params: ['sys.color.ohos_id_color_toolbar_bg'],
341          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' })));
342    this.localActivatedIndex = -1;
343    this.menuContent = [];
344    this.fontSize = 1;
345    this.theme = new ToolBarV2Theme();
346    this.itemCardTextMaxLine = 1;
347    this.itemDialogId = undefined;
348    this.isFollowSystem = false;
349    this.maxFontSizeScale = 3.2;
350    this.moreItem = new ToolBarV2Item({
351      content: new ToolBarV2ItemText({
352        text: {
353          'id': -1,
354          'type': 10003,
355          params: ['sys.string.ohos_toolbar_more'],
356          'bundleName': '__harDefaultBundleName__',
357          'moduleName': '__harDefaultModuleName__' },
358      }),
359      icon: new ToolBarV2ItemImage({
360        src: j
361      })
362    });
363    this.moreText = {
364      'id': -1, 'type': 10003,
365      params: ['sys.string.ohos_toolbar_more'],
366      'bundleName': '__harDefaultBundleName__',
367      'moduleName': '__harDefaultModuleName__' };
368    this.finalizeConstruction();
369  }
370  n2(params) {
371    this.o2('toolBarList', (params && 'toolBarList' in params) ? params.toolBarList : undefined);
372    this.o2('activatedIndex', (params && 'activatedIndex' in params) ? params.activatedIndex : -1);
373    this.o2('dividerModifier',
374      (params && 'dividerModifier' in params) ? params.dividerModifier : new DividerModifier());
375    this.o2('toolBarModifier',
376      (params && 'toolBarModifier' in params) ? params.toolBarModifier : new ToolBarV2Modifier()
377        .padding(LengthMetrics.resource({
378          'id': -1, 'type': 10002,
379          params: ['sys.float.padding_level12'],
380          'bundleName': '__harDefaultBundleName__',
381          'moduleName': '__harDefaultModuleName__' }))
382        .stateEffect(true)
383        .height(LengthMetrics.vp(o))
384        .backgroundColor(ColorMetrics.resourceColor({
385          'id': -1, 'type': 10001,
386          params: ['sys.color.ohos_id_color_toolbar_bg'],
387          'bundleName': '__harDefaultBundleName__',
388          'moduleName': '__harDefaultModuleName__' })));
389    this.localActivatedIndex = -1;
390    this.menuContent = [];
391    this.fontSize = 1;
392    this.theme = new ToolBarV2Theme();
393    this.q2('menus');
394    this.s2();
395  }
396  onActivateIndexChange(monitor) {
397    this.localActivatedIndex = monitor.value('activatedIndex')?.now ?? -1;
398  }
399  get menus() {
400    this.menuContent = [];
401    this.toolBarList.forEach((value, index) => {
402      if (index >= t - 1) {
403        this.menuContent.push({
404          value: this.toolBarList[index].content.text,
405          action: () => {
406            let callback = this.toolBarList[index].action;
407            if (callback) {
408              callback(index);
409            }
410          },
411          enabled: this.toolBarList[index].state !== ToolBarV2ItemState.DISABLE,
412        });
413      }
414    });
415    return this.menuContent;
416  }
417  aboutToAppear() {
418    this.localActivatedIndex = this.activatedIndex ?? -1;
419    try {
420      this.isFollowSystem = this.getUIContext()?.isFollowingSystemFontScale();
421      this.maxFontSizeScale = this.getUIContext()?.getMaxFontScale();
422    }
423    catch (err) {
424      let code = err?.code;
425      let message = err?.message;
426      hilog.error(0x3900, 'Ace', `Faild to toolBarV2 getMaxFontScale, code: ${code}, message: ${message}`);
427    }
428  }
429  onWillApplyTheme(theme) {
430    this.theme.i2 = theme.colors.iconPrimary;
431    this.theme.j2 = theme.colors.iconEmphasize;
432    this.theme.l2 = theme.colors.fontPrimary;
433    this.theme.m2 = theme.colors.fontEmphasize;
434  }
435  MoreTabBuilder(index, parent = null) {
436    this.observeComponentCreation2((elmtId, isInitialRender) => {
437      Button.createWithChild({ type: ButtonType.Normal, stateEffect: false });
438      Button.accessibilityGroup(true);
439      Button.focusable(true);
440      Button.focusOnTouch(true);
441      Button.focusBox({
442        margin: LengthMetrics.vp(h1),
443        strokeWidth: LengthMetrics.vp(i1),
444        strokeColor: ColorMetrics.resourceColor({
445          'id': -1,
446          'type': 10001,
447          params: ['sys.color.ohos_id_color_focused_outline'],
448          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' })
449      });
450      Button.width('100%');
451      Button.height('100%');
452      Button.bindMenu(this.menuContent, { placement: Placement.TopRight, offset: { x: -12, y: -10 } });
453      Button.borderRadius({
454        'id': -1,
455        'type': 10002,
456        params: ['sys.float.ohos_id_corner_radius_clicked'],
457        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
458      Button.backgroundColor(this.toolBarList[index].backgroundColor);
459      Button.onHover((isHover) => {
460        if (isHover) {
461          this.toolBarList[index].backgroundColor = {
462            'id': -1, 'type': 10001,
463            params: ['sys.color.ohos_id_color_hover'],
464            'bundleName': '__harDefaultBundleName__',
465            'moduleName': '__harDefaultModuleName__' };
466        }
467        else {
468          this.toolBarList[index].backgroundColor = Color.Transparent;
469        }
470      });
471      ViewStackProcessor.visualState('pressed');
472      Button.backgroundColor((!this.toolBarModifier?.h2) ?
473      this.toolBarList[index].backgroundColor : {
474          'id': -1,
475          'type': 10001,
476          params: ['sys.color.ohos_id_color_click_effect'],
477          'bundleName': '__harDefaultBundleName__',
478          'moduleName': '__harDefaultModuleName__' });
479      ViewStackProcessor.visualState();
480      Button.gestureModifier(this.getItemGestureModifier(this.moreItem, index));
481    }, Button);
482    this.observeComponentCreation2((elmtId, isInitialRender) => {
483      Column.create();
484      Column.width('100%');
485      Column.height('100%');
486      Column.justifyContent(FlexAlign.Center);
487      Column.padding({
488        start: LengthMetrics.resource({
489          'id': -1,
490          'type': 10002,
491          params: ['sys.float.padding_level2'],
492          'bundleName': '__harDefaultBundleName__',
493          'moduleName': '__harDefaultModuleName__' }),
494        end: LengthMetrics.resource({
495          'id': -1,
496          'type': 10002,
497          params: ['sys.float.padding_level2'],
498          'bundleName': '__harDefaultBundleName__',
499          'moduleName': '__harDefaultModuleName__' }),
500      });
501      Column.borderRadius({
502        'id': -1,
503        'type': 10002,
504        params: ['sys.float.ohos_id_corner_radius_clicked'],
505        'bundleName': '__harDefaultBundleName__',
506        'moduleName': '__harDefaultModuleName__' });
507    }, Column);
508    this.observeComponentCreation2((elmtId, isInitialRender) => {
509      SymbolGlyph.create(j);
510      SymbolGlyph.fontSize(m);
511      SymbolGlyph.fontColor([this.theme.i2]);
512      SymbolGlyph.draggable(false);
513      SymbolGlyph.margin({ bottom: {
514        'id': -1,
515        'type': 10002,
516        params: ['sys.float.padding_level1'],
517        'bundleName': '__harDefaultBundleName__',
518        'moduleName': '__harDefaultModuleName__' } });
519    }, SymbolGlyph);
520    this.observeComponentCreation2((elmtId, isInitialRender) => {
521      Text.create(this.moreText);
522      Text.fontColor(this.theme.l2);
523      Text.fontSize({
524        'id': -1,
525        'type': 10002,
526        params: ['sys.float.ohos_id_text_size_caption'],
527        'bundleName': '__harDefaultBundleName__',
528        'moduleName': '__harDefaultModuleName__' });
529      Text.fontWeight(FontWeight.Medium);
530      Text.maxLines(1);
531      Text.textOverflow({ overflow: TextOverflow.Ellipsis });
532      Text.textAlign(TextAlign.Center);
533      Text.focusable(true);
534      Text.focusOnTouch(true);
535    }, Text);
536    Text.pop();
537    Column.pop();
538    Button.pop();
539  }
540  TabBuilder(index, parent = null) {
541    this.observeComponentCreation2((elmtId, isInitialRender) => {
542      Button.createWithChild({ type: ButtonType.Normal, stateEffect: false });
543      Button.accessibilityGroup(true);
544      Button.accessibilityText(this.toolBarList[index]?.accessibilityText ??
545        this.toolBarList[index]?.content?.text);
546      Button.accessibilityDescription(this.toolBarList[index]?.accessibilityDescription ?? '');
547      Button.accessibilityLevel(this.toolBarList[index]?.accessibilityLevel ?? 'auto');
548      Button.enabled(this.toolBarList[index]?.state !== ToolBarV2ItemState.DISABLE);
549      Button.width('100%');
550      Button.height('100%');
551      Button.borderRadius({
552        'id': -1,
553        'type': 10002,
554        params: ['sys.float.ohos_id_corner_radius_clicked'],
555        'bundleName': '__harDefaultBundleName__',
556        'moduleName': '__harDefaultModuleName__' });
557      Button.focusable(!(this.toolBarList[index]?.state === ToolBarV2ItemState.DISABLE));
558      Button.focusOnTouch(!(this.toolBarList[index]?.state === ToolBarV2ItemState.DISABLE));
559      Button.focusBox({
560        margin: LengthMetrics.vp(h1),
561        strokeWidth: LengthMetrics.vp(i1),
562        strokeColor: ColorMetrics.resourceColor({
563          'id': -1,
564          'type': 10001,
565          params: ['sys.color.ohos_id_color_focused_outline'],
566          'bundleName': '__harDefaultBundleName__',
567          'moduleName': '__harDefaultModuleName__' })
568      });
569      Button.backgroundColor(this.toolBarList[index].backgroundColor);
570      Button.onHover((isHover) => {
571        if (isHover && this.toolBarList[index]?.state !== ToolBarV2ItemState.DISABLE) {
572          this.toolBarList[index].backgroundColor = {
573            'id': -1,
574            'type': 10001,
575            params: ['sys.color.ohos_id_color_hover'],
576            'bundleName': '__harDefaultBundleName__',
577            'moduleName': '__harDefaultModuleName__' };
578        }
579        else {
580          this.toolBarList[index].backgroundColor = Color.Transparent;
581        }
582      });
583      ViewStackProcessor.visualState('pressed');
584      Button.backgroundColor((this.toolBarList[index]?.state === ToolBarV2ItemState.DISABLE) ||
585        (!this.toolBarModifier?.h2) ?
586      this.toolBarList[index].backgroundColor : {
587          'id': -1,
588          'type': 10001,
589          params: ['sys.color.ohos_id_color_click_effect'],
590          'bundleName': '__harDefaultBundleName__',
591          'moduleName': '__harDefaultModuleName__' });
592      ViewStackProcessor.visualState();
593      Button.onClick(() => {
594        this.clickEventAction(index);
595      });
596      Button.gestureModifier(this.getItemGestureModifier(this.toolBarList[index], index));
597    }, Button);
598    this.observeComponentCreation2((elmtId, isInitialRender) => {
599      Column.create();
600      Column.justifyContent(FlexAlign.Center);
601      Column.width('100%');
602      Column.height('100%');
603      Column.borderRadius({
604        'id': -1,
605        'type': 10002,
606        params: ['sys.float.ohos_id_corner_radius_clicked'],
607        'bundleName': '__harDefaultBundleName__',
608        'moduleName': '__harDefaultModuleName__' });
609      Column.padding({
610        start: LengthMetrics.resource({
611          'id': -1,
612          'type': 10002,
613          params: ['sys.float.padding_level2'],
614          'bundleName': '__harDefaultBundleName__',
615          'moduleName': '__harDefaultModuleName__' }),
616        end: LengthMetrics.resource({
617          'id': -1,
618          'type': 10002,
619          params: ['sys.float.padding_level2'],
620          'bundleName': '__harDefaultBundleName__',
621          'moduleName': '__harDefaultModuleName__' }),
622      });
623    }, Column);
624    this.observeComponentCreation2((elmtId, isInitialRender) => {
625      If.create();
626      if (this.toolBarList[index]?.symbol) {
627        this.ifElseBranchUpdateFunction(0, () => {
628          this.observeComponentCreation2((elmtId, isInitialRender) => {
629            SymbolGlyph.create();
630            SymbolGlyph.fontSize(m);
631            SymbolGlyph.symbolEffect(new SymbolEffect(), false);
632            SymbolGlyph.attributeModifier.bind(this)(this.getToolBarSymbolModifier(index));
633            SymbolGlyph.margin({ bottom: {
634              'id': -1,
635              'type': 10002,
636              params: ['sys.float.padding_level1'],
637              'bundleName': '__harDefaultBundleName__',
638              'moduleName': '__harDefaultModuleName__' } });
639          }, SymbolGlyph);
640        });
641      }
642      else if (Util.b2(this.toolBarList[index]?.image?.src)) {
643        this.ifElseBranchUpdateFunction(1, () => {
644          this.observeComponentCreation2((elmtId, isInitialRender) => {
645            SymbolGlyph.create(this.toolBarList[index]?.image?.src);
646            SymbolGlyph.fontSize(m);
647            SymbolGlyph.fontColor([this.getIconColor(index)]);
648            SymbolGlyph.margin({ bottom: {
649              'id': -1,
650              'type': 10002,
651              params: ['sys.float.padding_level1'],
652              'bundleName': '__harDefaultBundleName__',
653              'moduleName': '__harDefaultModuleName__' } });
654          }, SymbolGlyph);
655        });
656      }
657      else {
658        this.ifElseBranchUpdateFunction(2, () => {
659          this.observeComponentCreation2((elmtId, isInitialRender) => {
660            Image.create(this.toolBarList[index]?.image?.src);
661            Image.width(m);
662            Image.height(m);
663            Image.fillColor(this.getIconColor(index));
664            Image.margin({ bottom: {
665              'id': -1,
666              'type': 10002,
667              params: ['sys.float.padding_level1'],
668              'bundleName': '__harDefaultBundleName__',
669              'moduleName': '__harDefaultModuleName__' } });
670            Image.objectFit(ImageFit.Contain);
671            Image.draggable(false);
672          }, Image);
673        });
674      }
675    }, If);
676    If.pop();
677    this.observeComponentCreation2((elmtId, isInitialRender) => {
678      Text.create(this.toolBarList[index]?.content.text);
679      Text.fontColor(this.getTextColor(index));
680      Text.fontSize({
681        'id': -1,
682        'type': 10002,
683        params: ['sys.float.ohos_id_text_size_caption'],
684        'bundleName': '__harDefaultBundleName__',
685        'moduleName': '__harDefaultModuleName__' });
686      Text.maxFontSize({
687        'id': -1,
688        'type': 10002,
689        params: ['sys.float.ohos_id_text_size_caption'],
690        'bundleName': '__harDefaultBundleName__',
691        'moduleName': '__harDefaultModuleName__' });
692      Text.minFontSize(9);
693      Text.fontWeight(FontWeight.Medium);
694      Text.maxLines(1);
695      Text.textOverflow({ overflow: TextOverflow.Ellipsis });
696      Text.textAlign(TextAlign.Center);
697      Text.focusable(!(this.toolBarList[index]?.state === ToolBarV2ItemState.DISABLE));
698      Text.focusOnTouch(!(this.toolBarList[index]?.state === ToolBarV2ItemState.DISABLE));
699    }, Text);
700    Text.pop();
701    Column.pop();
702    Button.pop();
703  }
704  itemCardDialogBuilder(item, index, parent = null) {
705    this.observeComponentCreation2((elmtId, isInitialRender) => {
706      If.create();
707      if (item.content && item.content.text) {
708        this.ifElseBranchUpdateFunction(0, () => {
709          this.observeComponentCreation2((elmtId, isInitialRender) => {
710            Column.create();
711            Column.constraintSize({ minHeight: this.fontSize === u ? b1 : c1 });
712          }, Column);
713          this.observeComponentCreation2((elmtId, isInitialRender) => {
714            If.create();
715            if (item.symbol) {
716              this.ifElseBranchUpdateFunction(0, () => {
717                this.observeComponentCreation2((elmtId, isInitialRender) => {
718                  SymbolGlyph.create();
719                  SymbolGlyph.attributeModifier.bind(this)(this.getToolBarSymbolModifier(index));
720                  SymbolGlyph.symbolEffect(new SymbolEffect(), false);
721                  SymbolGlyph.fontColor([{
722                    'id': -1,
723                    'type': 10001,
724                    params: ['sys.color.icon_primary'],
725                    'bundleName': '__harDefaultBundleName__',
726                    'moduleName': '__harDefaultModuleName__' }]);
727                  SymbolGlyph.fontSize(a1);
728                  SymbolGlyph.margin({
729                    top: {
730                      'id': -1,
731                      'type': 10002,
732                      params: ['sys.float.padding_level24'],
733                      'bundleName': '__harDefaultBundleName__',
734                      'moduleName': '__harDefaultModuleName__' },
735                    bottom: {
736                      'id': -1,
737                      'type': 10002,
738                      params: ['sys.float.padding_level8'],
739                      'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
740                  });
741                }, SymbolGlyph);
742              });
743            }
744            else if (Util.b2(item.image?.src)) {
745              this.ifElseBranchUpdateFunction(1, () => {
746                this.observeComponentCreation2((elmtId, isInitialRender) => {
747                  SymbolGlyph.create(item.image?.src);
748                  SymbolGlyph.fontColor([{
749                    'id': -1,
750                    'type': 10001,
751                    params: ['sys.color.icon_primary'],
752                    'bundleName': '__harDefaultBundleName__',
753                    'moduleName': '__harDefaultModuleName__' }]);
754                  SymbolGlyph.fontSize(a1);
755                  SymbolGlyph.margin({
756                    top: {
757                      'id': -1,
758                      'type': 10002,
759                      params: ['sys.float.padding_level24'],
760                      'bundleName': '__harDefaultBundleName__',
761                      'moduleName': '__harDefaultModuleName__' },
762                    bottom: {
763                      'id': -1,
764                      'type': 10002,
765                      params: ['sys.float.padding_level8'],
766                      'bundleName': '__harDefaultBundleName__',
767                      'moduleName': '__harDefaultModuleName__' },
768                  });
769                }, SymbolGlyph);
770              });
771            }
772            else {
773              this.ifElseBranchUpdateFunction(2, () => {
774                this.observeComponentCreation2((elmtId, isInitialRender) => {
775                  Image.create(item.image?.src);
776                  Image.width(a1);
777                  Image.height(a1);
778                  Image.margin({
779                    top: {
780                      'id': -1,
781                      'type': 10002,
782                      params: ['sys.float.padding_level24'],
783                      'bundleName': '__harDefaultBundleName__',
784                      'moduleName': '__harDefaultModuleName__' },
785                    bottom: {
786                      'id': -1,
787                      'type': 10002,
788                      params: ['sys.float.padding_level8'],
789                      'bundleName': '__harDefaultBundleName__',
790                      'moduleName': '__harDefaultModuleName__' },
791                  });
792                  Image.fillColor({
793                    'id': -1,
794                    'type': 10001,
795                    params: ['sys.color.icon_primary'],
796                    'bundleName': '__harDefaultBundleName__',
797                    'moduleName': '__harDefaultModuleName__' });
798                }, Image);
799              });
800            }
801          }, If);
802          If.pop();
803          this.observeComponentCreation2((elmtId, isInitialRender) => {
804            Column.create();
805            Column.width('100%');
806            Column.padding({
807              left: {
808                'id': -1,
809                'type': 10002,
810                params: ['sys.float.padding_level4'],
811                'bundleName': '__harDefaultBundleName__',
812                'moduleName': '__harDefaultModuleName__' },
813              right: {
814                'id': -1, 'type': 10002,
815                params: ['sys.float.padding_level4'],
816                'bundleName': '__harDefaultBundleName__',
817                'moduleName': '__harDefaultModuleName__' },
818              bottom: {
819                'id': -1, 'type': 10002,
820                params: ['sys.float.padding_level12'],
821                'bundleName': '__harDefaultBundleName__',
822                'moduleName': '__harDefaultModuleName__' },
823            });
824          }, Column);
825          this.observeComponentCreation2((elmtId, isInitialRender) => {
826            Text.create(item.content.text);
827            Text.fontSize(d1);
828            Text.textOverflow({ overflow: TextOverflow.Ellipsis });
829            Text.maxLines(this.itemCardTextMaxLine);
830            Text.width('100%');
831            Text.textAlign(TextAlign.Center);
832            Text.fontColor({
833              'id': -1, 'type': 10001,
834              params: ['sys.color.font_primary'],
835              'bundleName': '__harDefaultBundleName__',
836              'moduleName': '__harDefaultModuleName__' });
837          }, Text);
838          Text.pop();
839          Column.pop();
840          Column.pop();
841        });
842      }
843      else {
844        this.ifElseBranchUpdateFunction(1, () => {
845          this.observeComponentCreation2((elmtId, isInitialRender) => {
846            Column.create();
847            Column.constraintSize({ minHeight: this.fontSize === u ? b1 : c1 });
848            Column.justifyContent(FlexAlign.Center);
849          }, Column);
850          this.observeComponentCreation2((elmtId, isInitialRender) => {
851            If.create();
852            if (item.symbol) {
853              this.ifElseBranchUpdateFunction(0, () => {
854                this.observeComponentCreation2((elmtId, isInitialRender) => {
855                  SymbolGlyph.create();
856                  SymbolGlyph.attributeModifier.bind(this)(this.getToolBarSymbolModifier(index));
857                  SymbolGlyph.symbolEffect(new SymbolEffect(), false);
858                  SymbolGlyph.fontColor([{
859                    'id': -1,
860                    'type': 10001,
861                    params: ['sys.color.icon_primary'],
862                    'bundleName': '__harDefaultBundleName__',
863                    'moduleName': '__harDefaultModuleName__' }]);
864                  SymbolGlyph.fontSize(a1);
865                }, SymbolGlyph);
866              });
867            }
868            else {
869              this.ifElseBranchUpdateFunction(1, () => {
870                this.observeComponentCreation2((elmtId, isInitialRender) => {
871                  Image.create(item.image?.src);
872                  Image.width(a1);
873                  Image.height(a1);
874                  Image.fillColor({
875                    'id': -1,
876                    'type': 10001,
877                    params: ['sys.color.icon_primary'],
878                    'bundleName': '__harDefaultBundleName__',
879                    'moduleName': '__harDefaultModuleName__' });
880                }, Image);
881              });
882            }
883          }, If);
884          If.pop();
885          Column.pop();
886        });
887      }
888    }, If);
889    If.pop();
890  }
891  getFontSizeScale() {
892    let context = this.getUIContext();
893    let u1 = context.getHostContext()?.config?.fontSizeScale ?? 1;
894    if (!this.isFollowSystem) {
895      return 1;
896    }
897    else {
898      return Math.min(u1, this.maxFontSizeScale);
899    }
900  }
901  isItemActivating(index) {
902    return this.localActivatedIndex === index && (this.toolBarList[index]?.state === ToolBarV2ItemState.ACTIVATE);
903  }
904  getToolBarSymbolModifier(index) {
905    if (this.isItemActivating(index)) {
906      return this.toolBarList[index]?.symbol?.activated;
907    }
908    return this.toolBarList[index]?.symbol?.normal;
909  }
910  getIconColor(index) {
911    if (this.isItemActivating(index)) {
912      return this.toolBarList[index]?.image?.activatedColor?.color ?? this.theme.j2;
913    }
914    return this.toolBarList[index]?.image?.color?.color ?? this.theme.i2;
915  }
916  getTextColor(index) {
917    if (this.isItemActivating(index)) {
918      return this.toolBarList[index]?.content.activatedColor?.color ?? this.theme.m2;
919    }
920    return this.toolBarList[index]?.content.color?.color ?? this.theme.l2;
921  }
922  toLengthString(value) {
923    if (value === undefined) {
924      return '';
925    }
926    const length = value.value;
927    let t1 = '';
928    switch (value.unit) {
929      case LengthUnit.PX:
930        t1 = `${length}px`;
931        break;
932      case LengthUnit.FP:
933        t1 = `${length}fp`;
934        break;
935      case LengthUnit.LPX:
936        t1 = `${length}lpx`;
937        break;
938      case LengthUnit.PERCENT:
939        t1 = `${length * 100}%`;
940        break;
941      case LengthUnit.VP:
942        t1 = `${length}vp`;
943        break;
944      default:
945        t1 = `${length}vp`;
946        break;
947    }
948    return t1;
949  }
950  clickEventAction(index) {
951    let s1 = this.toolBarList[index];
952    if (s1.state === ToolBarV2ItemState.ACTIVATE) {
953      if (this.localActivatedIndex === index) {
954        this.localActivatedIndex = -1;
955      }
956      else {
957        this.localActivatedIndex = index;
958      }
959    }
960    if (s1.state !== ToolBarV2ItemState.DISABLE) {
961      s1.action && s1.action(index);
962    }
963  }
964  getItemGestureModifier(item, index) {
965    if (!item?.icon) {
966      return undefined;
967    }
968    let p1 = new ButtonGestureModifier();
969    p1.d2 = (event) => {
970      if (this.fontSize >= ButtonGestureModifier.minFontSize) {
971        event.addGesture(new LongPressGestureHandler({ repeat: false, duration: ButtonGestureModifier.e2 })
972          .onAction(() => {
973            promptAction.openCustomDialog({
974              builder: () => {
975                this.itemCardDialogBuilder(item, index);
976              },
977              onWillAppear: () => {
978                try {
979                  let context = this.getUIContext().getHostContext();
980                  let q1 = context.windowStage.getMainWindowSync();
981                  let properties = q1.getWindowProperties();
982                  if (px2vp(properties.windowRect.height) > e1) {
983                    this.itemCardTextMaxLine = f1;
984                  }
985                  else {
986                    this.itemCardTextMaxLine = g1;
987                  }
988                }
989                catch (err) {
990                  let code = err?.code;
991                  let message = err?.message;
992                  hilog.error(0x3900, 'Ace', `ToolBarV2 get window height failed, code: ${code}, message: ${message}`);
993                }
994              },
995              maskColor: Color.Transparent,
996              isModal: true,
997              backgroundBlurStyle: BlurStyle.COMPONENT_ULTRA_THICK,
998              backgroundColor: Color.Transparent,
999              shadow: ShadowStyle.OUTER_DEFAULT_LG,
1000              cornerRadius: {
1001                'id': -1,
1002                'type': 10002,
1003                params: ['sys.float.corner_radius_level10'],
1004                'bundleName': '__harDefaultBundleName__',
1005                'moduleName': '__harDefaultModuleName__' },
1006              width: this.fontSize === u ? b1 : c1
1007            }).then((dialogId) => {
1008              this.itemDialogId = dialogId;
1009            });
1010          })
1011          .onActionEnd(() => {
1012            if (this.itemDialogId) {
1013              promptAction.closeCustomDialog(this.itemDialogId);
1014            }
1015          })
1016          .onActionCancel(() => {
1017            if (this.itemDialogId) {
1018              promptAction.closeCustomDialog(this.itemDialogId);
1019            }
1020          }));
1021        return;
1022      }
1023      event.clearGestures();
1024    };
1025    return p1;
1026  }
1027  onMeasureSize(selfLayoutInfo, children, constraint) {
1028    this.fontSize = this.getFontSizeScale();
1029    let n1 = { height: 0, width: 0 };
1030    children.forEach((child) => {
1031      let o1 = child.measure(constraint);
1032      n1.width = o1.width;
1033      n1.height = o1.height;
1034    });
1035    return n1;
1036  }
1037  initialRender() {
1038    this.observeComponentCreation2((elmtId, isInitialRender) => {
1039      Column.create();
1040      Column.attributeModifier.bind(this)(this.toolBarModifier);
1041    }, Column);
1042    this.observeComponentCreation2((elmtId, isInitialRender) => {
1043      Divider.create();
1044      Divider.width('100%');
1045      Divider.height(1);
1046      Divider.attributeModifier.bind(this)(this.dividerModifier);
1047    }, Divider);
1048    this.observeComponentCreation2((elmtId, isInitialRender) => {
1049      Row.create();
1050      Row.justifyContent(FlexAlign.Center);
1051      Row.constraintSize({
1052        minHeight: this.toLengthString(this.toolBarModifier?.g2),
1053        maxHeight: this.toLengthString(this.toolBarModifier?.g2),
1054      });
1055      Row.width('100%');
1056      Row.height(this.toLengthString(this.toolBarModifier?.g2));
1057      Row.padding({
1058        start: this.toolBarList.length < t ?
1059          this.toolBarModifier?.paddingValue : LengthMetrics.resource({
1060          'id': -1,
1061          'type': 10002,
1062          params: ['sys.float.padding_level0'],
1063          'bundleName': '__harDefaultBundleName__',
1064          'moduleName': '__harDefaultModuleName__' }),
1065        end: this.toolBarList.length < t ?
1066          this.toolBarModifier?.paddingValue : LengthMetrics.resource({
1067          'id': -1,
1068          'type': 10002,
1069          params: ['sys.float.padding_level0'],
1070          'bundleName': '__harDefaultBundleName__',
1071          'moduleName': '__harDefaultModuleName__' }),
1072      });
1073    }, Row);
1074    this.observeComponentCreation2((elmtId, isInitialRender) => {
1075      ForEach.create();
1076      const forEachItemGenFunction = (_item, index) => {
1077        const item = _item;
1078        this.observeComponentCreation2((elmtId, isInitialRender) => {
1079          If.create();
1080          if (this.toolBarList.length <= t || index < t - 1) {
1081            this.ifElseBranchUpdateFunction(0, () => {
1082              this.observeComponentCreation2((elmtId, isInitialRender) => {
1083                Row.create();
1084                Row.height('100%');
1085                Row.flexShrink(1);
1086              }, Row);
1087              this.TabBuilder.bind(this)(index);
1088              Row.pop();
1089            });
1090          }
1091          else {
1092            this.ifElseBranchUpdateFunction(1, () => {
1093            });
1094          }
1095        }, If);
1096        If.pop();
1097      };
1098      this.forEachUpdateFunction(elmtId, this.toolBarList, forEachItemGenFunction, (item, index) => {
1099        return `${this.getUniqueId}__${index}}`;
1100      }, true, true);
1101    }, ForEach);
1102    ForEach.pop();
1103    this.observeComponentCreation2((elmtId, isInitialRender) => {
1104      If.create();
1105      if (this.toolBarList.length > t) {
1106        this.ifElseBranchUpdateFunction(0, () => {
1107          this.observeComponentCreation2((elmtId, isInitialRender) => {
1108            Row.create();
1109            Row.height('100%');
1110            Row.flexShrink(1);
1111          }, Row);
1112          this.MoreTabBuilder.bind(this)(t - 1);
1113          Row.pop();
1114        });
1115      }
1116      else {
1117        this.ifElseBranchUpdateFunction(1, () => {
1118        });
1119      }
1120    }, If);
1121    If.pop();
1122    Row.pop();
1123    Column.pop();
1124  }
1125  updateStateVars(params) {
1126    if (params === undefined) {
1127      return;
1128    }
1129    if ('toolBarList' in params) {
1130      this.updateParam('toolBarList', params.toolBarList);
1131    }
1132    if ('activatedIndex' in params) {
1133      this.updateParam('activatedIndex', params.activatedIndex);
1134    }
1135    if ('dividerModifier' in params) {
1136      this.updateParam('dividerModifier', params.dividerModifier);
1137    }
1138    if ('toolBarModifier' in params) {
1139      this.updateParam('toolBarModifier', params.toolBarModifier);
1140    }
1141  }
1142  rerender() {
1143    this.updateDirtyElements();
1144  }
1145}
1146__decorate([
1147  Param
1148], ToolBarV2.prototype, 'toolBarList', void 0);
1149__decorate([
1150  Param
1151], ToolBarV2.prototype, 'activatedIndex', void 0);
1152__decorate([
1153  Param
1154], ToolBarV2.prototype, 'dividerModifier', void 0);
1155__decorate([
1156  Param
1157], ToolBarV2.prototype, 'toolBarModifier', void 0);
1158__decorate([
1159  Local
1160], ToolBarV2.prototype, 'localActivatedIndex', void 0);
1161__decorate([
1162  Local
1163], ToolBarV2.prototype, 'menuContent', void 0);
1164__decorate([
1165  Local
1166], ToolBarV2.prototype, 'fontSize', void 0);
1167__decorate([
1168  Local
1169], ToolBarV2.prototype, 'theme', void 0);
1170__decorate([
1171  Monitor('activatedIndex')
1172], ToolBarV2.prototype, 'onActivateIndexChange', null);
1173__decorate([
1174  Computed
1175], ToolBarV2.prototype, 'menus', null);
1176export default { ToolBarV2Item, ToolBarV2ItemImage, ToolBarV2ItemText, ToolBarV2, ToolBarV2ItemState, ToolBarV2Modifier, ToolBarV2SymbolGlyph };