• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2023 Fujian Newland Auto-ID Tech.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 */
15import MouseManagerUtil from '../util/MouseManagerUtil'
16import {
17  setPointerVisible,
18  isPointerVisible,
19  setPointerSpeed,
20  setPointerStyle,
21  getPointerStyle
22} from '../util/MouseManagerUtil'
23import { pointerStyleArr, PointerStyleData } from '../model/PointerStyleData'
24import { getString } from '@ohos/common/src/main/ets/util/ResourceUtil';
25import pointer from '@ohos.multimodalInput.pointer'
26
27/**
28 * 鼠标管理视图
29 */
30@Preview
31@Component
32export struct MouseManager {
33  @State mMouseEvent: string = ''
34  @State mIsVisible: boolean | undefined = false;
35  // 鼠标速度
36  private mPointerSpeedArr = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11']
37  // 鼠标样式
38  @State mPointerStyleVal: string = getString($r('app.string.mouse_style_default'))
39  @State mSpeedIndex: number = 4
40  @State mSpeedVal: string = this.mPointerSpeedArr[4]
41  @State mStyleIndex: number = 0
42  private mSheetArr: Array<SheetInfo> = []
43  private mPointerStyleArr: Array<PointerStyleData> = pointerStyleArr
44  @State mIsShowMouseData: boolean = false // 是否显示鼠标详情，在开启监听后才显示
45
46  async aboutToAppear() {
47    this.mIsVisible = await isPointerVisible()
48    let pointerStyle = await getPointerStyle()
49    this.initPointerStyle(pointerStyle)
50  }
51
52  initPointerStyle(style: pointer.PointerStyle) {
53    let isCheck: boolean = true
54    for (let item of this.mPointerStyleArr) {
55      if (isCheck && style && item.style === style) {
56        this.mPointerStyleVal = item.name
57        isCheck = false
58      }
59      let sheetInfo: SheetInfo = {
60        title: item.name,
61        icon: item.icon,
62        action: () => {
63          setPointerStyle(item.style)
64          this.mPointerStyleVal = item.name
65        }
66      }
67      this.mSheetArr.push(sheetInfo)
68    }
69  }
70
71  aboutToDisappear() {
72    MouseManagerUtil.unregisterMouse()
73  }
74
75  onMouseEvent(data: string) {
76    this.mMouseEvent = data
77  }
78
79  /**
80   * 显示选择鼠标移动速度弹窗
81   */
82  showSelectSpeedDialog() {
83    TextPickerDialog.show({
84      range: this.mPointerSpeedArr,
85      selected: this.mSpeedIndex,
86      onAccept: (result: TextPickerResult) => {
87        let indexTemp: number | number[] = result.index;
88        let speedTemp: string | string[] = result.value;
89        this.mSpeedIndex = indexTemp as number;
90        this.mSpeedVal = speedTemp as string;
91        setPointerSpeed(Number(this.mSpeedVal))
92        console.info("TextPickerDialog:onAccept()" + JSON.stringify(result))
93      }
94    })
95  }
96
97  /**
98   * 显示鼠标样式弹窗
99   */
100  showPointerStyleDialog() {
101    ActionSheet.show({
102      title: $r('app.string.mouse_pointer_style_title'),
103      message: $r('app.string.mouse_pointer_style_hint'),
104      autoCancel: true,
105      alignment: DialogAlignment.Bottom,
106      sheets: this.mSheetArr
107    })
108  }
109
110  @Builder CustomDivider() {
111    Divider()
112      .strokeWidth('1px')
113      .color($r('sys.color.ohos_id_color_subheading_separator'))
114      .margin({
115        bottom: px2vp(8)
116      })
117  }
118
119  build() {
120    Scroll() {
121      Column({ space: 12 }) {
122        Text($r('app.string.mouse_setting'))
123          .fontColor($r('sys.color.ohos_id_color_text_secondary'))
124          .fontSize($r('sys.float.ohos_id_text_size_body2'))
125          .fontWeight(FontWeight.Regular)
126          .fontFamily('HarmonyHeiTi')
127
128        Column() {
129          Row() {
130            Text($r('app.string.mouse_setting_show'))
131              .fontColor($r('sys.color.ohos_id_color_text_primary'))
132              .fontSize($r('sys.float.ohos_id_text_size_body1'))
133              .fontWeight(FontWeight.Medium)
134            Blank()
135            Toggle({
136              type: ToggleType.Switch,
137              isOn: this.mIsVisible
138            })
139              .width(42)
140              .onChange((isOn) => {
141                setPointerVisible(isOn)
142              })
143          }
144          .width('100%')
145          .height(48)
146
147          this.CustomDivider()
148
149          Row() {
150            Text($r('app.string.mouse_setting_speed_title'))
151              .fontColor($r('sys.color.ohos_id_color_text_primary'))
152              .fontSize($r('sys.float.ohos_id_text_size_body1'))
153              .fontWeight(FontWeight.Medium)
154            Blank()
155            Row() {
156              Text(this.mSpeedVal)
157                .fontColor($r('app.color.battery_info_value_text'))
158                .fontSize($r('sys.float.ohos_id_text_size_body2'))
159                .margin({
160                  right: px2vp(12)
161                })
162
163              Image($r('app.media.icon_right_grey'))
164                .width(12)
165                .height(12)
166                .objectFit(ImageFit.Contain)
167            }
168            .onClick(() => {
169              this.showSelectSpeedDialog()
170            })
171          }
172          .width('100%')
173          .height(48)
174
175          this.CustomDivider()
176
177          Row() {
178            Text($r('app.string.mouse_setting_style_title'))
179              .fontColor($r('sys.color.ohos_id_color_text_primary'))
180              .fontSize($r('sys.float.ohos_id_text_size_body1'))
181              .fontWeight(FontWeight.Medium)
182            Blank()
183            Row() {
184              Text(this.mPointerStyleVal)
185                .fontColor($r('app.color.battery_info_value_text'))
186                .fontSize($r('sys.float.ohos_id_text_size_body2'))
187                .margin({
188                  right: px2vp(12)
189                })
190
191              Image($r('app.media.icon_right_grey'))
192                .width(12)
193                .height(12)
194                .objectFit(ImageFit.Contain)
195            }
196            .onClick(() => {
197              this.showPointerStyleDialog()
198            })
199          }
200          .width('100%')
201          .height(48)
202        }
203        .width('100%')
204        .padding(px2vp(24))
205        .backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
206        .border({
207          radius: $r('sys.float.ohos_id_corner_radius_default_l')
208        })
209        .id('columnMouseSetting')
210
211        Text($r('app.string.mouse_listener_title'))
212          .fontColor($r('sys.color.ohos_id_color_text_secondary'))
213          .fontSize($r('sys.float.ohos_id_text_size_body2'))
214          .fontWeight(FontWeight.Regular)
215          .fontFamily('HarmonyHeiTi')
216
217        Column() {
218          Row() {
219            Text($r('app.string.mouse_listener_open'))
220              .fontColor($r('sys.color.ohos_id_color_text_primary'))
221              .fontSize($r('sys.float.ohos_id_text_size_body1'))
222              .fontWeight(FontWeight.Medium)
223            Blank()
224            Toggle({
225              type: ToggleType.Switch,
226              isOn: false
227            })
228              .width(42)
229              .onChange((isOn) => {
230                this.mIsShowMouseData = isOn
231                if (isOn) {
232                  MouseManagerUtil.registerMouse((data: string): void => this.onMouseEvent(data));
233                } else {
234                  MouseManagerUtil.unregisterMouse()
235                }
236              })
237              .id('toggleMouseListener')
238          }
239          .width('100%')
240          .height(48)
241
242          Text($r('app.string.mouse_listener_open_hint'))
243            .fontColor($r('app.color.battery_info_value_text'))
244            .fontSize($r('sys.float.ohos_id_text_size_body2'))
245            .width('100%')
246        }
247        .padding(px2vp(24))
248        .backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
249        .border({
250          radius: $r('sys.float.ohos_id_corner_radius_default_l')
251        })
252        .id('columnMouseListener')
253
254        if (this.mIsShowMouseData) {
255          Text($r('app.string.mouse_event_info_title'))
256            .fontColor($r('sys.color.ohos_id_color_text_secondary'))
257            .fontSize($r('sys.float.ohos_id_text_size_body2'))
258            .fontWeight(FontWeight.Regular)
259            .fontFamily('HarmonyHeiTi')
260          Column() {
261            Text(this.mMouseEvent)
262              .fontColor($r('app.color.input_consumer_hint'))
263              .fontSize(14)
264              .fontWeight(FontWeight.Regular)
265              .width('100%')
266          }
267          .padding(px2vp(24))
268          .backgroundColor($r('sys.color.ohos_id_color_list_card_bg'))
269          .border({
270            radius: $r('sys.float.ohos_id_corner_radius_default_l')
271          })
272          .id('columnMouseEvent')
273        }
274
275      }
276      .justifyContent(FlexAlign.Center)
277      .alignItems(HorizontalAlign.Start)
278      .margin(px2vp(24))
279    }
280    .width('100%')
281    .scrollBar(BarState.Off)
282    .id('scrollMouse')
283  }
284}