鸿蒙OS开发文档 鸿蒙OS 添加多媒体支持

2024-02-25 开发教程 鸿蒙OS开发文档 匿名 3

本小节主要说明 HarmonyOS 车载多媒体的使用方法,以音乐 Demo 开发为例,开发步骤如下:

  1. 在布局中添加音乐播放控件。
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:id="$+id:play_music_root"
ohos:width="-1"
ohos:height="-1"
ohos:left_padding="24vp"
ohos:right_padding="24vp"
ohos:orientation="1">
<AdaptiveBoxLayout ohos:id="$+id:title_bar"
ohos:width="-1"
ohos:height="-2"
ohos:top_margin="24vp">
<Image ohos:id="$+id:arrow_down_btn"
ohos:width="24vp"
ohos:height="24vp"
ohos:align_parent_left="$+id:title_bar"
ohos:image_src="$media:default.png"/>
<Image ohos:id="$+id:music_heart_btn"
ohos:width="24vp"
ohos:height="24vp"
ohos:left_of="$+id:music_hiplay_btn"
ohos:image_src="$media:default.png"/>
<Image ohos:id="$+id:music_hiplay_btn"
ohos:width="24vp"
ohos:height="24vp"
ohos:left_margin="16vp"
ohos:align_parent_right="$+id:title_bar"
ohos:image_src="$media:default.png"/>
</AdaptiveBoxLayout>
<DirectionalLayout ohos:id="$+id:cover_container"
ohos:width="-1"
ohos:height="-2"
ohos:weight="1"
ohos:orientation="1">
<AdaptiveBoxLayout
ohos:id="$+id:music_cover_adapt"
ohos:width="-1"
ohos:height="-1">
<DirectionalLayout
ohos:id="$+id:music_cover_wrap1"
ohos:width="-2"
ohos:height="-2"
ohos:padding="20vp"
ohos:orientation="1">
<Image ohos:id="$+id:music_cover"
ohos:width="300vp"
ohos:height="300vp"
ohos:layout_alignment="17"
ohos:image_src="$media:default.png"/>
</DirectionalLayout>
<DirectionalLayout
ohos:id="$+id:music_cover_wrap2"
ohos:width="-1"
ohos:height="-1"
ohos:orientation="1">
<DirectionalLayout
ohos:width="-1"
ohos:height="-2"
ohos:layout_alignment="17"
ohos:top_margin="20vp"
ohos:bottom_margin="20vp"
ohos:orientation="1">
<Text ohos:id="$+id:music_title"
ohos:text_size="20vp"
ohos:shape="0"
ohos:text_color="#FF000000"
ohos:text_alignment="72"
ohos:width="-1"
ohos:height="-2"
ohos:multiple_lines="false"/>
<Text ohos:id="$+id:music_auth"
ohos:text_size="14vp"
ohos:shape="0"
ohos:top_margin="4vp"
ohos:text_color="#FF000000"
ohos:text_alignment="72"
ohos:width="-1"
ohos:height="-2"
ohos:multiple_lines="false"/>
</DirectionalLayout>
<Text ohos:id="$+id:music_lrc"
ohos:width="-1"
ohos:height="-2"
ohos:layout_alignment="17"
ohos:text="See the lights see the party the ball grows"
ohos:text_size="13vp"
ohos:text_color="#FF000000"
ohos:text_alignment="72"/>
</DirectionalLayout>
</AdaptiveBoxLayout>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:foot_wrap"
ohos:width="-1"
ohos:height="-2"
ohos:orientation="1">
<DirectionalLayout ohos:id="$+id:progress_container"
ohos:width="-1"
ohos:height="-2"
ohos:top_margin="10vp"
ohos:orientation="0">
<Text ohos:id="$+id:play_progress_time"
ohos:width="-2"
ohos:height="-2"
ohos:layout_alignment="16"
ohos:right_margin="6vp"
ohos:text_size="13vp"
ohos:text_color="#FF000000"
ohos:text_alignment="72"/>
<SeekBar ohos:id="$+id:play_progress_bar"
ohos:width="-1"
ohos:height="14vp"
ohos:layout_alignment="16"
ohos:weight="1"/>
<Text ohos:id="$+id:play_total_time"
ohos:width="-2"
ohos:height="-2"
ohos:layout_alignment="16"
ohos:left_margin="6vp"
ohos:text_size="13vp"
ohos:text_color="#FF000000"
ohos:text_alignment="72"/>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:control_container"
ohos:width="-1"
ohos:height="96vp"
ohos:orientation="0">
<DirectionalLayout ohos:id="$+id:control_box1"
ohos:width="-2"
ohos:height="-2"
ohos:weight="1"
ohos:layout_alignment="17"
ohos:orientation="1">
<Image ohos:id="$+id:volume_down_btn"
ohos:width="24vp"
ohos:height="24vp"
ohos:layout_alignment="17"
ohos:image_src="$media:default.png"/>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:control_box2"
ohos:width="-2"
ohos:height="-2"
ohos:weight="1"
ohos:layout_alignment="17"
ohos:orientation="1">
<Image ohos:id="$+id:prev_btn"
ohos:width="40vp"
ohos:height="40vp"
ohos:layout_alignment="17"
ohos:image_src="$media:default.png"/>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:control_box3"
ohos:width="-2"
ohos:height="-2"
ohos:weight="1"
ohos:layout_alignment="17"
ohos:orientation="1">
<Image ohos:id="$+id:play_btn"
ohos:width="64vp"
ohos:height="64vp"
ohos:layout_alignment="17"
ohos:image_src="$media:default.png"/>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:control_box4"
ohos:width="-2"
ohos:height="-2"
ohos:weight="1"
ohos:layout_alignment="17"
ohos:orientation="1">
<Image ohos:id="$+id:next_btn"
ohos:width="40vp"
ohos:height="40vp"
ohos:layout_alignment="17"
ohos:image_src="$media:default.png"/>
</DirectionalLayout>
<DirectionalLayout ohos:id="$+id:control_box5"
ohos:width="-2"
ohos:height="-2"
ohos:weight="1"
ohos:layout_alignment="17"
ohos:orientation="1">
<Image ohos:id="$+id:volume_up_btn"
ohos:width="24vp"
ohos:height="24vp"
ohos:layout_alignment="17"
ohos:image_src="$media:default.png"/>
</DirectionalLayout>
</DirectionalLayout>
</DirectionalLayout>
</DirectionalLayout>
  1. 加载播放控件。
super.setUIContent(ResourceTable.Layout_play_music_layout);
  1. 实现音乐播放管理类。
public class PlayManager {
...
private Player player;
public synchronized boolean play(String filePath, int startMilliSecond) {
...
FileDescriptor fd = IoUtil.getFileDescriptor(filePath);
Source source = new Source(fd);
player.setSource(source);
boolean isSuccess = player.prepare();
isSuccess = player.rewindTo(startMilliSecond * MICRO_MILLI_RATE, REWIND_NEXT_SYNC);
// 播放
isSuccess = player.play();
isPlaying.set(isSuccess);
return isSuccess;
}
public synchronized void pause(int startMilliSecond) {
...
player.pause();
}
public synchronized void stop() {
if (player == null) {
return;
}
player.stop();
isPlaying.set(false);
LogUtil.info(TAG, "stop success");
player.release();
player = null;
}
}
  1. 调用音乐播放管理类的接口播放音乐。
// 指定歌曲播放
String path = "/data/music/files/data/wonderful_life.mp3";
PlayManager.getInstance().play(path,1);
  1. 在布局中增加视频播放控件。
// 视频布局实现方法
public class MySurfaceSlice extends AbilitySlice {
...
public void makeSurfaceView() {
...
mySurfaceProvider = new SurfaceProvider(this);
adaptiveBoxLayoutSurfaceView.AdaptiveBoxLayout.LayoutConfig().addComponent(mySurfaceProvider);
}
}
  1. 实现视频播放管理类。
public class VideoPlay {
public synchronized void startPlay() {
...
ret = playImpl.play();
}
public synchronized void preParePlay() {
...
ret = playImpl.prepare();
}
public synchronized void pausePlay() {
...
boolean pauseRet = playImpl.pause();;
}
public synchronized void setSourcePlay(String filePath) {
...
FileDescriptor fd = IoUtil.getFileDescriptor(filePath);
Source source = new Source(fd);
playImpl.setSource(source);
}
@Override
public synchronized void onStop() {
...
super.onStop();
}
}
  1. 调用视频播放管理类的接口播放视频。
// 调用视频播放类进行播放
String filePath = "/data/video/files/data/festival.mp4";
VideoPlay videoPlay = new VideoPlay()
videoPlay.setSourcePlay(filePath);
videoPlay.startPlay();