1 | import { View, AddChildFromBuilder, AddArrayFromBuilder } from '../core/view';
|
2 | import { ViewBase } from '../core/view-base';
|
3 | import { Property, CoercibleProperty, CssProperty } from '../core/properties';
|
4 | import { EventData } from '../../data/observable';
|
5 | import { Color } from '../../color';
|
6 | import { Style } from '../styling/style';
|
7 |
|
8 | /**
|
9 | * Represents a SegmentedBar item.
|
10 | */
|
11 | export class SegmentedBarItem extends ViewBase {
|
12 | /**
|
13 | * Gets or sets the title of the SegmentedBarItem.
|
14 | */
|
15 | public title: string;
|
16 | }
|
17 |
|
18 | /**
|
19 | * Defines the data for the SegmentedBar.selectedIndexChanged event.
|
20 | */
|
21 | export interface SelectedIndexChangedEventData extends EventData {
|
22 | /**
|
23 | * The old selected index.
|
24 | */
|
25 | oldIndex: number;
|
26 |
|
27 | /**
|
28 | * The new selected index.
|
29 | */
|
30 | newIndex: number;
|
31 | }
|
32 |
|
33 | /**
|
34 | * Represents a UI SegmentedBar component.
|
35 | */
|
36 | export class SegmentedBar extends View implements AddChildFromBuilder, AddArrayFromBuilder {
|
37 | /**
|
38 | * Gets or sets the selected index of the SegmentedBar component.
|
39 | */
|
40 | selectedIndex: number;
|
41 |
|
42 | /**
|
43 | * Gets or sets the selected background color of the SegmentedBar component.
|
44 | */
|
45 | selectedBackgroundColor: Color;
|
46 |
|
47 | /**
|
48 | * Gets or sets the selected text color of the SegmentedBar component.
|
49 | */
|
50 | selectedTextColor: Color;
|
51 |
|
52 | /**
|
53 | * Gets or sets the items of the SegmentedBar.
|
54 | */
|
55 | items: Array<SegmentedBarItem>;
|
56 |
|
57 | /**
|
58 | * String value used when hooking to the selectedIndexChanged event.
|
59 | */
|
60 | public static selectedIndexChangedEvent: string;
|
61 |
|
62 | /**
|
63 | * A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
|
64 | * @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
|
65 | * @param callback - Callback function which will be executed when event is raised.
|
66 | * @param thisArg - An optional parameter which will be used as `this` context for callback execution.
|
67 | */
|
68 | on(eventNames: string, callback: (data: EventData) => void, thisArg?: any): void;
|
69 |
|
70 | /**
|
71 | * Raised when the selected index changes.
|
72 | */
|
73 | on(event: 'selectedIndexChanged', callback: (args: SelectedIndexChangedEventData) => void, thisArg?: any): void;
|
74 |
|
75 | /**
|
76 | * Called for every child element declared in xml.
|
77 | * @param name - Name of the element.
|
78 | * @param value - Value of the element.
|
79 | */
|
80 | public _addChildFromBuilder(name: string, value: any): void;
|
81 | public _addArrayFromBuilder(name: string, value: Array<any>): void;
|
82 | }
|
83 |
|
84 | /**
|
85 | * Gets or sets the selected index dependency property of the SegmentedBar.
|
86 | */
|
87 | export const selectedIndexProperty: CoercibleProperty<SegmentedBar, number>;
|
88 |
|
89 | /**
|
90 | * Gets or sets the selected background color property of the SegmentedBar.
|
91 | */
|
92 | export const selectedBackgroundColorProperty: CssProperty<Style, Color>;
|
93 |
|
94 | /**
|
95 | * Gets or sets the items dependency property of the SegmentedBar.
|
96 | */
|
97 | export const itemsProperty: Property<SegmentedBar, SegmentedBarItem[]>;
|
98 |
|
99 | /**
|
100 | * Gets or sets the selected text color property of the SegmentedBar.
|
101 | */
|
102 | export const selectedTextColorProperty: CssProperty<Style, Color>;
|