Showing
4 changed files
with
109 additions
and
4 deletions
| @@ -107,4 +107,6 @@ export { MorningEveningViewModel } from './src/main/ets/viewmodel/MorningEvening | @@ -107,4 +107,6 @@ export { MorningEveningViewModel } from './src/main/ets/viewmodel/MorningEvening | ||
| 107 | 107 | ||
| 108 | export { GrayManageModel } from './src/main/ets/viewmodel/GrayManageModel' | 108 | export { GrayManageModel } from './src/main/ets/viewmodel/GrayManageModel' |
| 109 | 109 | ||
| 110 | -export { VoiceInputView } from './src/main/ets/components/comment/view/VoiceInputView' | ||
| 110 | +export { VoiceInputView } from './src/main/ets/components/comment/view/VoiceInputView' | ||
| 111 | + | ||
| 112 | +// export {voicese} |
| 1 | import router from '@ohos.router' | 1 | import router from '@ohos.router' |
| 2 | +import { VoiceRecoginizer } from 'wdHwAbility' | ||
| 2 | import { BreakpointSystem, DateTimeUtils, NetworkUtil, StringUtils, ToastUtils } from 'wdKit' | 3 | import { BreakpointSystem, DateTimeUtils, NetworkUtil, StringUtils, ToastUtils } from 'wdKit' |
| 3 | import { ParamType, TrackConstants, Tracking } from 'wdTracking/Index' | 4 | import { ParamType, TrackConstants, Tracking } from 'wdTracking/Index' |
| 4 | import SearcherAboutDataModel from '../../model/SearcherAboutDataModel' | 5 | import SearcherAboutDataModel from '../../model/SearcherAboutDataModel' |
| @@ -8,6 +9,8 @@ import { SearchHistoryComponent } from './SearchHistoryComponent' | @@ -8,6 +9,8 @@ import { SearchHistoryComponent } from './SearchHistoryComponent' | ||
| 8 | import { SearchHotsComponent } from './SearchHotsComponent' | 9 | import { SearchHotsComponent } from './SearchHotsComponent' |
| 9 | import { SearchRelatedComponent } from './SearchRelatedComponent' | 10 | import { SearchRelatedComponent } from './SearchRelatedComponent' |
| 10 | import { SearchResultComponent } from './SearchResultComponent' | 11 | import { SearchResultComponent } from './SearchResultComponent' |
| 12 | +import { VoiceSearchCustomDialog } from './VoiceSearchCustomDialog' | ||
| 13 | +import { common } from '@kit.AbilityKit' | ||
| 11 | 14 | ||
| 12 | const TAG = "SearchComponent" | 15 | const TAG = "SearchComponent" |
| 13 | 16 | ||
| @@ -37,6 +40,7 @@ export struct SearchComponent { | @@ -37,6 +40,7 @@ export struct SearchComponent { | ||
| 37 | @StorageProp('currentBreakpoint') @Watch("currentChanged") currentBreakpoint: string = 'sm'; | 40 | @StorageProp('currentBreakpoint') @Watch("currentChanged") currentBreakpoint: string = 'sm'; |
| 38 | private breakpointSystem = new BreakpointSystem(); | 41 | private breakpointSystem = new BreakpointSystem(); |
| 39 | @State percent: number = 1 | 42 | @State percent: number = 1 |
| 43 | + private commentInputDialogController?: CustomDialogController | ||
| 40 | 44 | ||
| 41 | currentChanged() { | 45 | currentChanged() { |
| 42 | if (this.currentBreakpoint == "md" || this.currentBreakpoint == "lg") { | 46 | if (this.currentBreakpoint == "md" || this.currentBreakpoint == "lg") { |
| @@ -366,17 +370,22 @@ export struct SearchComponent { | @@ -366,17 +370,22 @@ export struct SearchComponent { | ||
| 366 | } | 370 | } |
| 367 | }) | 371 | }) |
| 368 | 372 | ||
| 369 | - Image($r('app.media.search_input_del_icon')) | 373 | + Image($r(StringUtils.isEmpty(this.searchText) ? 'app.media.search_voice_icon' : 'app.media.search_input_del_icon')) |
| 370 | .width(`${this.calcHeight(31)}lpx`) | 374 | .width(`${this.calcHeight(31)}lpx`) |
| 371 | .height(`${this.calcHeight(31)}lpx`) | 375 | .height(`${this.calcHeight(31)}lpx`) |
| 372 | .objectFit(ImageFit.Auto) | 376 | .objectFit(ImageFit.Auto) |
| 373 | .interpolation(ImageInterpolation.Medium) | 377 | .interpolation(ImageInterpolation.Medium) |
| 374 | .onClick(() => { | 378 | .onClick(() => { |
| 375 | - this.searchText = "" | 379 | + if (StringUtils.isEmpty(this.searchText)) { ///唤起语音搜索 |
| 380 | + this.stopInput() | ||
| 381 | + this.voiceSearchDialog() | ||
| 382 | + }else { ///清除输入内容 | ||
| 383 | + this.searchText = "" | ||
| 384 | + } | ||
| 376 | }) | 385 | }) |
| 377 | .offset({ x: 10 }) | 386 | .offset({ x: 10 }) |
| 378 | .enabled(true) | 387 | .enabled(true) |
| 379 | - .visibility(StringUtils.isEmpty(this.searchText) ? Visibility.Hidden : Visibility.Visible) | 388 | + // .visibility(StringUtils.isEmpty(this.searchText) ? Visibility.Hidden : Visibility.Visible) |
| 380 | 389 | ||
| 381 | }.padding({ right: `${this.calcHeight(70)}lpx` }) | 390 | }.padding({ right: `${this.calcHeight(70)}lpx` }) |
| 382 | .layoutWeight(1) | 391 | .layoutWeight(1) |
| @@ -406,6 +415,31 @@ export struct SearchComponent { | @@ -406,6 +415,31 @@ export struct SearchComponent { | ||
| 406 | .alignItems(VerticalAlign.Center) | 415 | .alignItems(VerticalAlign.Center) |
| 407 | } | 416 | } |
| 408 | 417 | ||
| 418 | + private voiceSearchDialog() { | ||
| 419 | + | ||
| 420 | + VoiceRecoginizer.checkPemmission(getContext(this) as common.UIAbilityContext) | ||
| 421 | + | ||
| 422 | + this.commentInputDialogController = new CustomDialogController({ | ||
| 423 | + builder: VoiceSearchCustomDialog ( | ||
| 424 | + { onSearchBtnClick:((content:string) => { | ||
| 425 | + this.commentInputDialogController?.close() | ||
| 426 | + this.searchText = content | ||
| 427 | + if (StringUtils.isNotEmpty(this.searchText)) { | ||
| 428 | + SearcherAboutDataModel.putSearchHistoryData(this.searchText) | ||
| 429 | + this.getSearchHistoryData() | ||
| 430 | + this.getSearchInputResData(this.searchText) | ||
| 431 | + } | ||
| 432 | + }) | ||
| 433 | + } | ||
| 434 | + ), | ||
| 435 | + autoCancel: true, | ||
| 436 | + alignment: DialogAlignment.Bottom, | ||
| 437 | + customStyle: true, | ||
| 438 | + backgroundColor: "#50000000", | ||
| 439 | + }).open() | ||
| 440 | + | ||
| 441 | + } | ||
| 442 | + | ||
| 409 | getSearchResultCountData() { | 443 | getSearchResultCountData() { |
| 410 | SearcherAboutDataModel.getSearchResultCountData(encodeURI(this.searchText), getContext(this)).then((value) => { | 444 | SearcherAboutDataModel.getSearchResultCountData(encodeURI(this.searchText), getContext(this)).then((value) => { |
| 411 | if (value != null) { | 445 | if (value != null) { |
sight_harmony/features/wdComponent/src/main/ets/components/search/VoiceSearchCustomDialog.ets
0 → 100644
| 1 | + | ||
| 2 | +import { VoiceRecoginizer } from 'wdHwAbility' | ||
| 3 | +import { common, UIAbility } from '@kit.AbilityKit' | ||
| 4 | +import { VoiceInputView } from '../comment/view/VoiceInputView' | ||
| 5 | + | ||
| 6 | +@Preview | ||
| 7 | +@CustomDialog | ||
| 8 | +export struct VoiceSearchCustomDialog { | ||
| 9 | + controller?: CustomDialogController | ||
| 10 | + onSearchBtnClick?: (content: string) => void | ||
| 11 | + @State voiceContent: string = "" | ||
| 12 | + | ||
| 13 | + build() { | ||
| 14 | + Column() { | ||
| 15 | + Row() { | ||
| 16 | + TextArea({ | ||
| 17 | + placeholder: '我来说两句', | ||
| 18 | + text: this.voiceContent | ||
| 19 | + }) | ||
| 20 | + .placeholderColor("#999999") | ||
| 21 | + .id("textAreaId") | ||
| 22 | + .defaultFocus(false) // 获取默认焦点 | ||
| 23 | + .enableKeyboardOnFocus(true) | ||
| 24 | + .height('100%') | ||
| 25 | + .width('100%') | ||
| 26 | + .backgroundColor($r('app.color.color_transparent')) | ||
| 27 | + .caretColor("#ED2800") | ||
| 28 | + .onFocus(() => { | ||
| 29 | + this.controller?.close() | ||
| 30 | + }) | ||
| 31 | + } | ||
| 32 | + .backgroundColor('#F9F9F9') | ||
| 33 | + .margin({ top: 12, right: 12, left: 12, bottom:10}) | ||
| 34 | + .height(80) | ||
| 35 | + .borderRadius(4) | ||
| 36 | + Row() { | ||
| 37 | + Image($r('app.media.WDInput_keyboardImage')) | ||
| 38 | + .width(30) | ||
| 39 | + .height(30) | ||
| 40 | + .onClick(() => { | ||
| 41 | + this.controller?.close() | ||
| 42 | + }) | ||
| 43 | + Text('搜索') | ||
| 44 | + .backgroundColor("#ED2800") | ||
| 45 | + .width(80) | ||
| 46 | + .height(30) | ||
| 47 | + .fontSize(15) | ||
| 48 | + .fontColor(Color.White) | ||
| 49 | + .textAlign(TextAlign.Center) | ||
| 50 | + .borderRadius(4) | ||
| 51 | + .opacity(this.voiceContent.length > 0 ? 1.0 : 0.5) | ||
| 52 | + .enabled(this.voiceContent.length > 0) | ||
| 53 | + .onClick(() => { | ||
| 54 | + if (this.onSearchBtnClick) { | ||
| 55 | + this.onSearchBtnClick(this.voiceContent) | ||
| 56 | + } | ||
| 57 | + }) | ||
| 58 | + } | ||
| 59 | + .padding({ left: 12, right: 12 }) | ||
| 60 | + .width('100%') | ||
| 61 | + .justifyContent(FlexAlign.SpaceBetween) | ||
| 62 | + VoiceInputView({voiceRecoginizerResult:(result: string) => { | ||
| 63 | + this.voiceContent = result | ||
| 64 | + }}).height(150) | ||
| 65 | + }.backgroundColor(Color.White) | ||
| 66 | + .width('100%') | ||
| 67 | +} | ||
| 68 | + | ||
| 69 | +} |
-
Please register or login to post a comment