1/* 2 * Copyright (c) 2021-2023 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 16/** 17 * Declare the graphic format of the bar chart. 18 * 19 * @enum { number } 20 * @syscap SystemCapability.ArkUI.ArkUI.Full 21 * @since 7 22 */ 23/** 24 * Declare the graphic format of the bar chart. 25 * 26 * @enum { number } 27 * @syscap SystemCapability.ArkUI.ArkUI.Full 28 * @crossplatform 29 * @since 10 30 */ 31declare enum BarMode { 32 /** 33 * The actual layout width of the TabBar is used. If the width exceeds the total width, you can slide the tabbar. 34 * 35 * @syscap SystemCapability.ArkUI.ArkUI.Full 36 * @since 7 37 */ 38 /** 39 * The actual layout width of the TabBar is used. If the width exceeds the total width, you can slide the tabbar. 40 * 41 * @syscap SystemCapability.ArkUI.ArkUI.Full 42 * @crossplatform 43 * @since 10 44 */ 45 Scrollable = 0, 46 47 /** 48 * The width of all TabBars is evenly allocated. 49 * 50 * @syscap SystemCapability.ArkUI.ArkUI.Full 51 * @since 7 52 */ 53 /** 54 * The width of all TabBars is evenly allocated. 55 * 56 * @syscap SystemCapability.ArkUI.ArkUI.Full 57 * @crossplatform 58 * @since 10 59 */ 60 Fixed = 1, 61} 62 63/** 64 * Declare the location of the bar chart. 65 * 66 * @enum { number } 67 * @syscap SystemCapability.ArkUI.ArkUI.Full 68 * @since 7 69 */ 70/** 71 * Declare the location of the bar chart. 72 * 73 * @enum { number } 74 * @syscap SystemCapability.ArkUI.ArkUI.Full 75 * @crossplatform 76 * @since 10 77 */ 78declare enum BarPosition { 79 /** 80 * When the vertical attribute method is set to true, the tab is on the left of the container. When the vertical property method is set to false, the tab is at the top of the container. 81 * 82 * @syscap SystemCapability.ArkUI.ArkUI.Full 83 * @since 7 84 */ 85 /** 86 * When the vertical attribute method is set to true, the tab is on the left of the container. When the vertical property method is set to false, the tab is at the top of the container. 87 * 88 * @syscap SystemCapability.ArkUI.ArkUI.Full 89 * @crossplatform 90 * @since 10 91 */ 92 Start, 93 94 /** 95 * When the vertical attribute method is set to true, the tab is located on the right of the container. When the vertical property method is set to false, the tab is at the bottom of the container. 96 * 97 * @syscap SystemCapability.ArkUI.ArkUI.Full 98 * @since 7 99 */ 100 /** 101 * When the vertical attribute method is set to true, the tab is located on the right of the container. When the vertical property method is set to false, the tab is at the bottom of the container. 102 * 103 * @syscap SystemCapability.ArkUI.ArkUI.Full 104 * @crossplatform 105 * @since 10 106 */ 107 End, 108} 109 110/** 111 * Declare the layout style of the tab bar items. 112 * 113 * @enum { number } 114 * @syscap SystemCapability.ArkUI.ArkUI.Full 115 * @crossplatform 116 * @since 10 117 */ 118declare enum LayoutStyle { 119 /** 120 * The tab bar items are laid in the center of the tab bar. 121 * 122 * @syscap SystemCapability.ArkUI.ArkUI.Full 123 * @crossplatform 124 * @since 10 125 */ 126 ALWAYS_CENTER = 0, 127 /** 128 * The tab bar items are laid in the tab bar by an average split. 129 * 130 * @syscap SystemCapability.ArkUI.ArkUI.Full 131 * @crossplatform 132 * @since 10 133 */ 134 ALWAYS_AVERAGE_SPLIT = 1, 135 /** 136 * The tab bar items are laid in the center of the bar when their total length is more than half of the tab bar. 137 * Otherwise, they are laid in the center half of the tab bar with the same space between them. 138 * 139 * @syscap SystemCapability.ArkUI.ArkUI.Full 140 * @crossplatform 141 * @since 10 142 */ 143 SPACE_BETWEEN_OR_CENTER = 2 144} 145 146/** 147 * @since 7 148 */ 149/** 150 * @crossplatform 151 * @since 10 152 */ 153declare class TabsController { 154 /** 155 * constructor. 156 * 157 * @syscap SystemCapability.ArkUI.ArkUI.Full 158 * @since 7 159 */ 160 /** 161 * constructor. 162 * 163 * @syscap SystemCapability.ArkUI.ArkUI.Full 164 * @crossplatform 165 * @since 10 166 */ 167 constructor(); 168 169 /** 170 * Called when the tab is switched. 171 * 172 * @param { number } value 173 * @syscap SystemCapability.ArkUI.ArkUI.Full 174 * @since 7 175 */ 176 /** 177 * Called when the tab is switched. 178 * 179 * @param { number } value 180 * @syscap SystemCapability.ArkUI.ArkUI.Full 181 * @crossplatform 182 * @since 10 183 */ 184 changeIndex(value: number): void; 185} 186 187/** 188 * Provides an interface for switching views. 189 * 190 * @interface TabsInterface 191 * @syscap SystemCapability.ArkUI.ArkUI.Full 192 * @since 7 193 */ 194/** 195 * Provides an interface for switching views. 196 * 197 * @interface TabsInterface 198 * @syscap SystemCapability.ArkUI.ArkUI.Full 199 * @crossplatform 200 * @since 10 201 */ 202interface TabsInterface { 203 /** 204 * Called when the view is switched. 205 * 206 * @param { object } value 207 * @returns { TabsAttribute } 208 * @syscap SystemCapability.ArkUI.ArkUI.Full 209 * @since 7 210 */ 211 /** 212 * Called when the view is switched. 213 * 214 * @param { object } value 215 * @returns { TabsAttribute } 216 * @syscap SystemCapability.ArkUI.ArkUI.Full 217 * @crossplatform 218 * @since 10 219 */ 220 (value?: { barPosition?: BarPosition; index?: number; controller?: TabsController }): TabsAttribute; 221} 222 223/** 224 * Provides an interface for the style of an divider including stroke width, color, start margin 225 * and end margin 226 * 227 * @interface DividerStyle 228 * @syscap SystemCapability.ArkUI.ArkUI.Full 229 * @crossplatform 230 * @since 10 231 */ 232interface DividerStyle { 233 /** 234 * Define the stroke width of the divider 235 * 236 * @type { Length } 237 * @default 0 238 * @syscap SystemCapability.ArkUI.ArkUI.Full 239 * @crossplatform 240 * @since 10 241 */ 242 strokeWidth: Length; 243 244 /** 245 * Define the color of the divider 246 * 247 * @type { ?ResourceColor } 248 * @syscap SystemCapability.ArkUI.ArkUI.Full 249 * @crossplatform 250 * @since 10 251 */ 252 color?: ResourceColor; 253 254 /** 255 * Define the start margin of the divider 256 * 257 * @type { ?Length } 258 * @default 0 259 * @syscap SystemCapability.ArkUI.ArkUI.Full 260 * @crossplatform 261 * @since 10 262 */ 263 startMargin?: Length; 264 265 /** 266 * Define the end margin of the divider 267 * 268 * @type { ?Length } 269 * @default 0 270 * @syscap SystemCapability.ArkUI.ArkUI.Full 271 * @crossplatform 272 * @since 10 273 */ 274 endMargin?: Length; 275} 276 277/** 278 * Provides an interface for the grid column options of an tab bar including sm, md, lg, margin and gutter. 279 * 280 * @interface BarGridColumnOptions 281 * @syscap SystemCapability.ArkUI.ArkUI.Full 282 * @crossplatform 283 * @since 10 284 */ 285interface BarGridColumnOptions { 286 /** 287 * Define the occupied column number when the screen is of small size 288 * 289 * @type { ?number } 290 * @syscap SystemCapability.ArkUI.ArkUI.Full 291 * @crossplatform 292 * @since 10 293 */ 294 sm?: number; 295 296 /** 297 * Define the occupied column number when the screen is of middle size 298 * 299 * @type { ?number } 300 * @syscap SystemCapability.ArkUI.ArkUI.Full 301 * @crossplatform 302 * @since 10 303 */ 304 md?: number; 305 306 /** 307 * Define the occupied column number when the screen is of large size 308 * 309 * @type { ?number } 310 * @syscap SystemCapability.ArkUI.ArkUI.Full 311 * @crossplatform 312 * @since 10 313 */ 314 lg?: number; 315 316 /** 317 * Define the margin size of the columns 318 * 319 * @type { ?Dimension } 320 * @syscap SystemCapability.ArkUI.ArkUI.Full 321 * @crossplatform 322 * @since 10 323 */ 324 margin?: Dimension; 325 326 /** 327 * Define the gutter size of the columns 328 * 329 * @type { ?Dimension } 330 * @syscap SystemCapability.ArkUI.ArkUI.Full 331 * @crossplatform 332 * @since 10 333 */ 334 gutter?: Dimension; 335} 336 337/** 338 * Provides an interface for the options for the scrollable bar mode including margin and nonScrollableLayoutStyle. 339 * 340 * @interface ScrollableBarModeOptions 341 * @syscap SystemCapability.ArkUI.ArkUI.Full 342 * @crossplatform 343 * @since 10 344 */ 345interface ScrollableBarModeOptions { 346 /** 347 * Define the margin size of the bar items when the tab bar is scrollable. 348 * 349 * @type { ?Dimension } 350 * @syscap SystemCapability.ArkUI.ArkUI.Full 351 * @crossplatform 352 * @since 10 353 */ 354 margin?: Dimension; 355 356 /** 357 * Define the layout style of the bar items when the tab bar is not scrollable. 358 * 359 * @type { ?LayoutStyle } 360 * @syscap SystemCapability.ArkUI.ArkUI.Full 361 * @crossplatform 362 * @since 10 363 */ 364 nonScrollableLayoutStyle?: LayoutStyle; 365} 366 367/** 368 * Defines the tabs attribute functions. 369 * 370 * @extends CommonMethod 371 * @syscap SystemCapability.ArkUI.ArkUI.Full 372 * @since 7 373 */ 374/** 375 * Defines the tabs attribute functions. 376 * 377 * @extends CommonMethod 378 * @syscap SystemCapability.ArkUI.ArkUI.Full 379 * @crossplatform 380 * @since 10 381 */ 382declare class TabsAttribute extends CommonMethod<TabsAttribute> { 383 /** 384 * Called when determining whether the tab is vertical. 385 * 386 * @param { boolean } value 387 * @returns { TabsAttribute } 388 * @syscap SystemCapability.ArkUI.ArkUI.Full 389 * @since 7 390 */ 391 /** 392 * Called when determining whether the tab is vertical. 393 * 394 * @param { boolean } value 395 * @returns { TabsAttribute } 396 * @syscap SystemCapability.ArkUI.ArkUI.Full 397 * @crossplatform 398 * @since 10 399 */ 400 vertical(value: boolean): TabsAttribute; 401 402 /** 403 * Called when determining the location of the bar chart. 404 * 405 * @param { BarPosition } value 406 * @returns { TabsAttribute } 407 * @syscap SystemCapability.ArkUI.ArkUI.Full 408 * @since 9 409 */ 410 /** 411 * Called when determining the location of the bar chart. 412 * 413 * @param { BarPosition } value 414 * @returns { TabsAttribute } 415 * @syscap SystemCapability.ArkUI.ArkUI.Full 416 * @crossplatform 417 * @since 10 418 */ 419 barPosition(value: BarPosition): TabsAttribute; 420 421 /** 422 * Called when judging whether page switching can be performed by sliding left and right. 423 * 424 * @param { boolean } value 425 * @returns { TabsAttribute } 426 * @syscap SystemCapability.ArkUI.ArkUI.Full 427 * @since 7 428 */ 429 /** 430 * Called when judging whether page switching can be performed by sliding left and right. 431 * 432 * @param { boolean } value 433 * @returns { TabsAttribute } 434 * @syscap SystemCapability.ArkUI.ArkUI.Full 435 * @crossplatform 436 * @since 10 437 */ 438 scrollable(value: boolean): TabsAttribute; 439 440 /** 441 * Called when the graphic format of the bar chart is selected as fixed mode. 442 * 443 * @param { BarMode.Fixed } value 444 * @returns { TabsAttribute } 445 * @syscap SystemCapability.ArkUI.ArkUI.Full 446 * @crossplatform 447 * @since 10 448 */ 449 barMode(value: BarMode.Fixed): TabsAttribute; 450 451 /** 452 * Called when the graphic format of the bar chart is selected as scrollable mode. 453 * 454 * @param { BarMode.Scrollable } value 455 * @param { ScrollableBarModeOptions } [options] - options indicate the options for the scrollable bar mode 456 * @returns { TabsAttribute } 457 * @syscap SystemCapability.ArkUI.ArkUI.Full 458 * @crossplatform 459 * @since 10 460 */ 461 barMode(value: BarMode.Scrollable, options: ScrollableBarModeOptions): TabsAttribute; 462 463 /** 464 * Called when the graphic format of the bar chart is selected. 465 * 466 * @param { BarMode } value 467 * @returns { TabsAttribute } 468 * @syscap SystemCapability.ArkUI.ArkUI.Full 469 * @since 7 470 */ 471 /** 472 * Called when the graphic format of the bar chart is selected. 473 * 474 * @param { BarMode } value 475 * @param { ScrollableBarModeOptions } [options] - options indicate the options for the scrollable bar mode 476 * @returns { TabsAttribute } 477 * @syscap SystemCapability.ArkUI.ArkUI.Full 478 * @crossplatform 479 * @since 10 480 */ 481 barMode(value: BarMode, options?: ScrollableBarModeOptions): TabsAttribute; 482 483 /** 484 * Called when the width of the bar graph is set. 485 * Notice: barWidth only supports Number type on 7, supports Length type since 8. 486 * 487 * @param { Length } value 488 * @returns { TabsAttribute } 489 * @syscap SystemCapability.ArkUI.ArkUI.Full 490 * @since 8 491 */ 492 /** 493 * Called when the width of the bar graph is set. 494 * Notice: barWidth only supports Number type on 7, supports Length type since 8. 495 * 496 * @param { Length } value 497 * @returns { TabsAttribute } 498 * @syscap SystemCapability.ArkUI.ArkUI.Full 499 * @crossplatform 500 * @since 10 501 */ 502 barWidth(value: Length): TabsAttribute; 503 504 /** 505 * Called when the height of the bar graph is set. 506 * Notice: barHeight only supports Number type on 7, supports Length type since 8. 507 * 508 * @param { Length } value 509 * @returns { TabsAttribute } 510 * @syscap SystemCapability.ArkUI.ArkUI.Full 511 * @since 8 512 */ 513 /** 514 * Called when the height of the bar graph is set. 515 * Notice: barHeight only supports Number type on 7, supports Length type since 8. 516 * 517 * @param { Length } value 518 * @returns { TabsAttribute } 519 * @syscap SystemCapability.ArkUI.ArkUI.Full 520 * @crossplatform 521 * @since 10 522 */ 523 barHeight(value: Length): TabsAttribute; 524 525 /** 526 * Called when the animation duration of the bar graph is set. 527 * 528 * @param { number } value 529 * @returns { TabsAttribute } 530 * @syscap SystemCapability.ArkUI.ArkUI.Full 531 * @since 7 532 */ 533 /** 534 * Called when the animation duration of the bar graph is set. 535 * 536 * @param { number } value 537 * @returns { TabsAttribute } 538 * @syscap SystemCapability.ArkUI.ArkUI.Full 539 * @crossplatform 540 * @since 10 541 */ 542 animationDuration(value: number): TabsAttribute; 543 544 /** 545 * Called when the tab is switched. 546 * 547 * @param { function } event 548 * @returns { TabsAttribute } 549 * @syscap SystemCapability.ArkUI.ArkUI.Full 550 * @since 7 551 */ 552 /** 553 * Called when the tab is switched. 554 * 555 * @param { function } event 556 * @returns { TabsAttribute } 557 * @syscap SystemCapability.ArkUI.ArkUI.Full 558 * @crossplatform 559 * @since 10 560 */ 561 onChange(event: (index: number) => void): TabsAttribute; 562 563 /** 564 * Called when the tab is clicked. 565 * 566 * @param { function } event 567 * @returns { TabsAttribute } 568 * @syscap SystemCapability.ArkUI.ArkUI.Full 569 * @crossplatform 570 * @since 10 571 */ 572 onTabBarClick(event: (index: number) => void): TabsAttribute; 573 574 /** 575 * Set whether the edges of tab bar are fading. 576 * 577 * @param { boolean } value - indicates whether the edges of tab bar are fading. 578 * @returns { TabsAttribute } the attribute of the tabs 579 * @syscap SystemCapability.ArkUI.ArkUI.Full 580 * @crossplatform 581 * @since 10 582 */ 583 fadingEdge(value: boolean): TabsAttribute; 584 585 /** 586 * Set the divider between tab bar and tab content. 587 * 588 * @param { DividerStyle | null } value - indicates the style of the indicator. 589 * @returns { TabsAttribute } the attribute of the tabs 590 * @syscap SystemCapability.ArkUI.ArkUI.Full 591 * @crossplatform 592 * @since 10 593 */ 594 divider(value: DividerStyle | null): TabsAttribute; 595 596 /** 597 * Set whether the tab bar overlaps with the tab content. 598 * 599 * @param { boolean } value - indicates whether the tab bar overlaps with the tab content. 600 * @returns { TabsAttribute } the attribute of the tabs 601 * @syscap SystemCapability.ArkUI.ArkUI.Full 602 * @since 10 603 */ 604 barOverlap(value: boolean): TabsAttribute; 605 606 /** 607 * Set the background color of the tab bar. 608 * 609 * @param { ResourceColor } value - indicates the background color of the tab bar. 610 * @returns { TabsAttribute } the attribute of the tabs 611 * @syscap SystemCapability.ArkUI.ArkUI.Full 612 * @since 10 613 */ 614 barBackgroundColor(value: ResourceColor): TabsAttribute; 615 616 /** 617 * Set the grid alignment options of the tab bar. 618 * 619 * @param { BarGridColumnOptions } value - indicates the bar grid alignment options. 620 * @returns { TabsAttribute } the attribute of the tabs 621 * @syscap SystemCapability.ArkUI.ArkUI.Full 622 * @crossplatform 623 * @since 10 624 */ 625 barGridAlign(value: BarGridColumnOptions): TabsAttribute; 626} 627 628/** 629 * Defines Tabs Component. 630 * 631 * @syscap SystemCapability.ArkUI.ArkUI.Full 632 * @since 7 633 */ 634/** 635 * Defines Tabs Component. 636 * 637 * @syscap SystemCapability.ArkUI.ArkUI.Full 638 * @crossplatform 639 * @since 10 640 */ 641declare const Tabs: TabsInterface; 642 643/** 644 * Defines Tabs Component instance. 645 * 646 * @syscap SystemCapability.ArkUI.ArkUI.Full 647 * @since 7 648 */ 649/** 650 * Defines Tabs Component instance. 651 * 652 * @syscap SystemCapability.ArkUI.ArkUI.Full 653 * @crossplatform 654 * @since 10 655 */ 656declare const TabsInstance: TabsAttribute; 657