HarmonyOS 鸿蒙Next 视频横竖屏处理
HarmonyOS 鸿蒙Next 视频横竖屏处理
短视频播放,横竖屏失败的,不正常,可能是什么原因????
2 回复
参考demo如下:
import { window } from '[@kit](/user/kit).ArkUI';
[@Entry](/user/Entry)
[@Component](/user/Component)
struct VideoPlayerPage {
controller: VideoController = new VideoController();
[@State](/user/State) curRate: PlaybackSpeed = PlaybackSpeed.Speed_Forward_1_00_X
[@State](/user/State) fullHeight: Length = 300
[@State](/user/State) isFullVertical: boolean = false
[@State](/user/State) isFullHorizontal: boolean = false
[@State](/user/State) setHeight:Length = 300
onPageHide(): void {
this.handlerOrientation(window.Orientation.PORTRAIT)
this.controller.requestFullscreen(true)
}
handlerOrientation(type: number) {
window.getLastWindow(getContext(this), (err, win) => {
win.setPreferredOrientation(type)
})
}
build() {
Column() {
Stack({ alignContent: Alignment.Bottom }) {
Video({
//竖版视频和横版视频的显示效果不同
src: $rawfile('videoDemo.mp4'),
currentProgressRate: this.curRate,
controller: this.controller
})
.width('100%')
.height(this.fullHeight)
.loop(false)
.objectFit(ImageFit.Contain)
.autoPlay(false)
.controls(false)
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
Row() {
Text('播放').onClick(() => {
this.controller.start() // 开始播放
}).margin(5).fontColor(Color.White).fontSize(12)
Text('暂停').onClick(() => {
this.controller.pause() // 暂停播放
}).margin(5).fontColor(Color.White).fontSize(12)
Text('0.75X').onClick(() => {
this.curRate = PlaybackSpeed.Speed_Forward_0_75_X
}).margin(5).fontColor(Color.White).fontSize(12)
Text('1.0X').onClick(() => {
this.curRate = PlaybackSpeed.Speed_Forward_1_00_X
}).margin(5).fontColor(Color.White).fontSize(12)
Text('2.0').onClick(() => {
this.curRate = PlaybackSpeed.Speed_Forward_2_00_X
}).margin(5).fontColor(Color.White).fontSize(12)
Text(this.isFullVertical ? '退出竖屏' : '竖屏')
.margin(5)
.fontSize(12)
.onClick(() =>
{
if (this.isFullVertical) {
// this.fullHeight = 600
this.fullHeight = this.setHeight
} else {
this.fullHeight = '100%'
}
this.isFullVertical = !this.isFullVertical
}).fontColor(Color.White)
Text(this.isFullHorizontal ? '退出横屏' : '横屏')
.fontSize(12)
.onClick(() => {
this.isFullHorizontal = !this.isFullHorizontal
if (this.isFullHorizontal) {
this.handlerOrientation(window.Orientation.LANDSCAPE_INVERTED)
this.fullHeight = '100%'
} else {
this.handlerOrientation(window.Orientation.PORTRAIT)
// this.fullHeight = 600
this.fullHeight = this.setHeight
}
}).fontColor(Color.White)
}
.zIndex(1)
}
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
更多关于HarmonyOS 鸿蒙Next 视频横竖屏处理的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
在处理HarmonyOS(鸿蒙)Next系统中的视频横竖屏问题时,首先需要确保你的应用已经正确配置了屏幕方向的处理逻辑。HarmonyOS提供了丰富的API接口来管理屏幕方向,开发者可以通过以下方式来实现视频横竖屏的处理:
-
配置文件设置:在
config.json
中,可以指定应用的默认屏幕方向(如横屏或竖屏)。对于视频播放功能,若需支持动态切换,则需通过代码逻辑控制。 -
编程接口调用:利用HarmonyOS的显示管理API,如
setRequestedOrientation
方法,可以在运行时动态改变屏幕方向。调用此方法时需传入目标方向参数,如Orientation.LANDSCAPE
(横屏)或Orientation.PORTRAIT
(竖屏)。 -
事件监听:为设备方向变化添加监听器,当用户旋转设备时,应用可以捕捉到这一事件并作出响应,如调整视频播放器的布局和方向。
-
适配与优化:确保在不同屏幕方向下,视频播放界面能够良好适配,无拉伸或变形现象,同时保持用户交互的一致性。
如果上述方法已正确实施但问题依旧没法解决,请联系官网客服。官网地址是:https://www.itying.com/category-93-b0.html。