wuyanan

ref |> 搜索集成语音输入

@@ -108,3 +108,5 @@ export { MorningEveningViewModel } from './src/main/ets/viewmodel/MorningEvening @@ -108,3 +108,5 @@ export { MorningEveningViewModel } from './src/main/ets/viewmodel/MorningEvening
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(() => {
  379 + if (StringUtils.isEmpty(this.searchText)) { ///唤起语音搜索
  380 + this.stopInput()
  381 + this.voiceSearchDialog()
  382 + }else { ///清除输入内容
375 this.searchText = "" 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) {
  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 +}