chenjun3_wd

早晚报 音频播放

import { ReLInfo } from './ReLInfo';
export interface AudioDataList {
audioUrl: string;
coverUrl: string;
duration: number;
objectId: number;
objectType: number;
reLInfo: ReLInfo;
title: string;
}
\ No newline at end of file
... ...
import { AudioDataList } from './AudioDataList';
import { OperDataList } from './OperDataList';
export interface CompList {
// audioDataList: any[];
audioDataList: AudioDataList[];
backgroundImgUrl: string;
// bottomNavId?: any;
cardItemId: string;
// cardUpdateStrategy?: any;
compStyle: string;
compType: string;
dataSourceType: string;
expIds: string;
extraData: string;
// fullColumnImgUrls: any[];
hasMore: number;
id: number;
// imageScale?: any;
imgSize: string;
itemId: string;
itemType: string;
itemTypeCode: string;
linkUrl: string;
// localGovernance?: any;
name: string;
objectId: string;
... ... @@ -27,13 +33,16 @@ export interface CompList {
objectSummary: string;
objectTitle: string;
objectType: string;
// openComment?: any;
// openLikes?: any;
operDataList: OperDataList[];
pageId: string;
// position?: any;
posterSize: string;
posterUrl: string;
// questionSection?: any;
recommend: number;
relId: number;
... ... @@ -41,8 +50,10 @@ export interface CompList {
sortValue: number;
subSceneId: string;
summaryName: string;
// tabOperDataList: any[];
titleShowPolicy: number;
// topicTemplate?: any;
traceId: string;
traceInfo: string;
... ...
export interface ReLInfo {
channelId?: string;
relId: string;
relObjectId: number;
relType: string;
}
\ No newline at end of file
... ...
... ... @@ -13,6 +13,7 @@
"wdBean": "file:../../features/wdBean",
"wdRouter": "file:../../commons/wdRouter",
"wdNetwork": "file:../../commons/wdNetwork",
"wdPlayer": "file:../../features/wdPlayer",
"wdLogin": "file:../../features/wdLogin"
}
}
... ...
import { AudioDTO } from 'wdBean';
import { Logger } from 'wdKit/Index';
/**
* 早晚报页面音频bar
*/
@Entry
// @Entry
@Component
export struct AudioBarView {
@State audioDataList?: AudioDTO[] = []
@Consume isAudioPlaying?: boolean
aboutToAppear() {
}
... ... @@ -45,6 +47,11 @@ export struct AudioBarView {
.height(24)
.margin({ left: 10 })// .alignSelf(ItemAlign.Center)
.objectFit(ImageFit.Contain)
.onClick(() => {
Logger.info("TAG", "cj compInfoBean onClick1 = " + this.isAudioPlaying)
this.isAudioPlaying = !this.isAudioPlaying
Logger.info("TAG", "cj compInfoBean onClick2 = " + this.isAudioPlaying)
})
}
// .aspectRatio(7 / 4)
.height('100%')
... ...
// import { FrontLinkObject, MorningEveningPaperDTO, PageInfoBean } from 'wdBean';
import { CompList, PageInfoBean } from 'wdBean';
import { DateTimeUtils, Logger } from 'wdKit/Index';
import { PaperReaderSimpleDialog } from '../../dialog/PaperReaderDialog';
import { MorningEveningViewModel } from '../../viewmodel/MorningEveningViewModel';
import { AudioBarView } from './AudioBarView';
// import { AudioBarView } from './AudioBarView';
import { PaperTitleComponent } from './PaperTitleComponent';
import { SingleColumn999Component } from './SingleColumn999Component';
import { topicInfoView } from './topicInfoView';
import { WDPlayerController } from 'wdPlayer';
const TAG = 'MorningEveningPaperComponent';
... ... @@ -17,6 +19,7 @@ export struct MorningEveningPaperComponent {
@State pageInfoBean: PageInfoBean = {} as PageInfoBean
// @State compInfoBean: CompInfoBean = {} as CompInfoBean
@State compListItem: CompList = {} as CompList
@State audioPlayUrl: string = ""
// @Provide compListItem: CompList = {} as CompList
// @State morningEveningPaperDTO: MorningEveningPaperDTO = {
// name: "新闻夜读",
... ... @@ -36,6 +39,16 @@ export struct MorningEveningPaperComponent {
// } as MorningEveningPaperDTO
@Provide title: string = ''
@Provide subTitle: string = ''
@Provide isAudioPlaying: boolean = false
private playerController: WDPlayerController = new WDPlayerController();
private xComponentController: XComponentController = new XComponentController();
simpleAudioDialog: CustomDialogController = new CustomDialogController({
builder: PaperReaderSimpleDialog(),
autoCancel: false,
customStyle: true,
alignment: DialogAlignment.CenterStart,
offset: { dx: 12, dy: -150 }
})
async aboutToAppear() {
console.info(TAG, `aboutToAppear`)
... ... @@ -44,7 +57,7 @@ export struct MorningEveningPaperComponent {
Logger.info(TAG, "currentTime = " + currentTime)
Logger.info(TAG, `currentTime = ${currentTime}`)
try {
let pageInfoBean = await MorningEveningViewModel.getMorningEveningPageInfo("28949")
let pageInfoBean = await MorningEveningViewModel.getMorningEveningPageInfo("25091")
this.pageInfoBean = pageInfoBean;
this.title = this.pageInfoBean?.topicInfo?.title
let dateTime = DateTimeUtils.parseDate(this.pageInfoBean?.topicInfo?.topicDate ?? '', DateTimeUtils.PATTERN_DATE_HYPHEN);
... ... @@ -59,9 +72,13 @@ export struct MorningEveningPaperComponent {
// this.compInfoBean = compInfoBean
if (compInfoBean?.compList[0]) {
this.compListItem = compInfoBean?.compList[0]
if (compInfoBean?.compList[0].audioDataList) {
this.audioPlayUrl = compInfoBean?.compList[0].audioDataList[0].audioUrl
}
}
Logger.info(TAG, "compInfoBean compStyle = " + compInfoBean.compList[0].compStyle)
} catch (exception) {
}
... ... @@ -77,12 +94,15 @@ export struct MorningEveningPaperComponent {
}
ListItem() {
AudioBarView()
this.AudioBarView(this.simpleAudioDialog)
}
}
ListItem() {
SingleColumn999Component({ compListItem: this.compListItem }).margin({ top: $r('app.float.top_bar_height') })
SingleColumn999Component({ compListItem: this.compListItem })
.margin({
top: this.pageInfoBean?.topicInfo?.frontLinkObject ? 10 : 44
})
}
}
// .backgroundColor('#FFF1F3F5')
... ... @@ -104,4 +124,63 @@ export struct MorningEveningPaperComponent {
// .backgroundColor(Color.Black)
.backgroundColor(this.pageInfoBean?.backgroundColor ?? Color.Black)
}
@Builder
AudioBarView(dialog: CustomDialogController) {
Row() {
Stack({ alignContent: Alignment.Start }) {
Image($r('app.media.listen_left_bg'))
.width('100%')
.height('100%')
.objectFit(ImageFit.Contain)
Image($r('app.media.icon_listen'))
.width(24)
.height(24)
.margin({ left: 10 })
.alignSelf(ItemAlign.Start)
Text('晚上好, 请收听今日新闻播报')
.fontSize(14)
.margin({ left: 50 })
.fontColor(Color.Black)
.maxLines(1)
.textOverflow({ overflow: TextOverflow.Ellipsis })
}
.layoutWeight(1)
.height('100%')
Stack({ alignContent: Alignment.Center }) {
Image($r('app.media.listen_right_bg'))
.width('100%')
.height('100%')
.objectFit(ImageFit.Contain)
Image($r('app.media.ic_red_triangle'))
.width(24)
.height(24)
.margin({ left: 10 })// .alignSelf(ItemAlign.Center)
.objectFit(ImageFit.Contain)
.onClick(() => {
Logger.info("TAG", "cj compInfoBean onClick1 = " + this.isAudioPlaying)
dialog.open()
this.playerController.firstPlay(this.audioPlayUrl)
Logger.info("TAG", "cj compInfoBean onClick2 = " + this.isAudioPlaying)
})
}
// .aspectRatio(7 / 4)
.height('100%')
// .justifyContent(FlexAlign.Center)
// .width(94)
// .width(140)
.width('20%')
// .height(56)
.onClick(() => {
// console.info(TAG, `onClick listen_right_bg`);
})
}
// .width('100%')
.height(56)
.alignItems(VerticalAlign.Center)
.justifyContent(FlexAlign.SpaceBetween)
}
}
\ No newline at end of file
... ...
/**
* 简易音频对话框
* */
@CustomDialog
export struct PaperReaderSimpleDialog {
private controllerSimple?: CustomDialogController;
build() {
Row() {
Image($r("app.media.icon_audio_pause"))
.objectFit(ImageFit.Contain)
.margin(18)
.width(24)
.height(24)
}
.width(60)
.height(60)
.backgroundColor(Color.White)
.onClick(() => {
if (this.controllerSimple) {
this.controllerSimple.close()
}
})
}
}
/**
* 图文音频对话框
* */
@CustomDialog
export struct PaperReaderDialog {
controllerDetail?: CustomDialogController
build() {
Stack() {
Column() { //标题 时间 进度条
Marquee({
start: true,
step: 50,
loop: Number.POSITIVE_INFINITY,
fromStart: true,
src: "Running Marquee starts rolling"
})
.width("60%")
.height(20)
.fontColor($r("app.color.color_222222"))
.fontSize(14)
.margin({ top: 10 })
.onStart(() => {
console.info('Marquee animation complete onStart')
})
.onBounce(() => {
console.info('Marquee animation complete onBounce')
})
.onFinish(() => {
console.info('Marquee animation complete onFinish')
})
Row() {
Text("00:00")
.fontSize($r('app.float.font_size_12'))
.fontColor($r('app.color.color_999999'))
.width("49%")
.height("100%")
Text("/00:00")
.fontSize($r('app.float.font_size_12'))
.fontColor($r('app.color.color_999999'))
.width("51%")
.height("100%")
}
.width("100%")
.height(16)
.margin({ top: 4 })
}
.width("100%")
.height("100%")
Progress({ value: 0, total: 100, type: ProgressType.Linear })
.color($r('app.color.color_ED2800'))
.width("100%")
.height(3)
Image($r("app.media.icon_audio_pause"))
.objectFit(ImageFit.Auto)
.align(Alignment.End)
.margin({ right: 12 })
Image($r("app.media.icon_audio_close"))
.objectFit(ImageFit.Auto)
.align(Alignment.End)
.margin({ right: 48 })
.onClick(() => {
if (this.controllerDetail) {
this.controllerDetail.close()
}
})
}
.width("65%")
.height(60)
.backgroundColor(Color.White)
.borderRadius(5)
}
}
\ No newline at end of file
... ...