1/* 2 * Copyright (c) 2022-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 { Log } from '../utils/Log'; 17 18const TAG: string = 'common_GridScrollBar'; 19 20@Component 21export struct GridScrollBar { 22 scroller: Scroller | null = null; 23 @State isClickScrollBar: boolean = false; 24 25 build() { 26 ScrollBar({ scroller: this.scroller as Scroller, direction: ScrollBarDirection.Vertical, 27 state: BarState.Auto }) { 28 Row() { 29 if (this.isClickScrollBar) { 30 Image($r('app.media.scroll_press_light')) 31 .width($r('app.float.scroll_bar_big_width')) 32 .height($r('app.float.scroll_bar_big_height')) 33 } else { 34 Image($r('app.media.scroll_light')) 35 .width($r('app.float.scroll_bar_small_width')) 36 .height($r('app.float.scroll_bar_small_height')) 37 .borderRadius(25) 38 } 39 } 40 } 41 .width(this.isClickScrollBar ? $r('app.float.scroll_bar_margin_small') : $r('app.float.scroll_bar_small_width')) 42 .height('100%') 43 .hitTestBehavior(HitTestMode.Transparent) 44 .position({ x: '100%', y: 0 }) 45 .markAnchor({ 46 x: this.isClickScrollBar ? $r('app.float.scroll_bar_big_width') : $r('app.float.scroll_bar_small_width'), 47 y: 0 48 }) 49 .onTouch((event?: TouchEvent) => { 50 if (event?.type == TouchType.Move && !this.isClickScrollBar) { 51 Log.debug(TAG, `scrollBar first TouchType.Move`); 52 this.isClickScrollBar = true; 53 } else if (event?.type == TouchType.Up || event?.type == TouchType.Cancel) { 54 Log.debug(TAG, `scrollBar TouchType.Up or Cancel. type=${event?.type}`); 55 this.isClickScrollBar = false; 56 } 57 }) 58 } 59}