• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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
16import Constants from '../utils/constant';
17import { indexValue, sortByName } from '../utils/utils';
18import { GlobalContext } from '../utils/globalContext';
19import { appInfo, ApplicationObj } from '../utils/typedef';
20
21@Component
22export struct alphabetIndexerComponent {
23  @Link applicationItem: Array<appInfo | ApplicationObj>; // application info array
24  @Link index: number; // alphabetical index
25  @State usingPopup: boolean = false;
26
27  aboutToAppear() {
28    const this_ = this;
29    setTimeout(() => {
30      this_.usingPopup = true;
31    }, 1000)
32  }
33
34  build() {
35    AlphabetIndexer({ arrayValue: indexValue, selected: this.index })
36      .color($r('sys.color.ohos_id_color_text_secondary'))
37      .selectedColor($r('sys.color.ohos_id_color_text_primary_activated')) // selected color
38      .popupColor($r('sys.color.ohos_id_color_text_primary_activated')) // popover color
39      .popupBackground($r('sys.color.ohos_id_color_card_bg')) // popover background color
40      .usingPopup(this.usingPopup) // whether to show a popup
41      .font({ size: $r('sys.float.ohos_id_text_size_body3') })
42      .popupFont({ size: $r('sys.float.ohos_id_text_size_headline7') }) // Demo of the popup
43      .onSelect((index: number) => {
44        const value = indexValue[index];
45        let scroller: Scroller = GlobalContext.getContext().get('scroller') as Scroller;
46        for (let i = 0; i < this.applicationItem.length; i++) {
47          let item = sortByName(this.applicationItem)[i];
48          if (item.indexTag === value) {
49            scroller.scrollToIndex(i);
50            return;
51          }
52        }
53      })
54      .height(Constants.FULL_HEIGHT)
55      .constraintSize({ maxHeight: Constants.ALPHABETINDEXER_HEIGHT })
56      .width(Constants.APPLICATION_ALPHABETINDEX_WIDTH)
57  }
58}