비디오 플레이어 앱 #2(동영상 사이즈 조절, 뒤로가기, 재생, 앞으로가기 버튼 구현)

custom_video_controller.dart

동영상 실제 사이즈로 보이게 하기

 

AspectRatio

child 매개변수에 입력되는 위젯의 비율 정할 수 있는 위젯이다

aspectRatio 매개변수에 원하는 비율 입력 가능하다

-> 16:9라면 16/9 입력한다

     위 예시에서는 value.aspectRatio 게터로 받아와 원동영상 비율 값을 넣어주었다

 

 

 

custom_video_controller.dart

custom_video_controller.dart

재생, 뒤로가기, 앞으로가기 버튼

버튼 스타일은 renderIconBtn 위젯으로 정의해줬고

renderIconBtn의 onPressed 매개변수에 각각 재생, 뒤로가기, 앞으로가기 기능을 가진 함수를 넣어줬다

각 함수는 아래와 같이 정의한다

 

 

 

custom_video_controller.dart

재생, 뒤로가기, 앞으로가기 함수 정의

 

재생(onPlayPressed) 함수

setState(() {
  //이미 실행 중이면 중지, 아니면 실행
  if (videoController!.value.isPlaying) {
    videoController!.pause();
  } else {
    videoController!.play();
  }
});

현재 동영상이 실행 중이면 pause() 실행, 일시정지 중이면 동영상 실행하는 play() 실행한다

실행하거나 일시정지할 때 가운데 버튼을 재생 또는 일시정지 아이콘으로 변경해줘야하므로 setState() 실행해준다

 

뒤로가기(onReversePressed) 함수

if(crntPosition.inSeconds > 3){
  position = crntPosition - Duration(seconds: 3);
}
videoController!.seekTo(position);

위 예시에서는 현재 실행되고 있는 동영상의 위치가 3초보다 길면 현재 위치에서 3초를 뺀 위치로 동영상을 돌리고 아니면 0초 위치로 돌린다

 

앞으로가기(onForwardPressed) 함수

if((maxPosition - Duration(seconds: 3)).inSeconds > crntPosition.inSeconds){
    // 현재 포지션 시간이 더 짧다면
    position = crntPosition + Duration(seconds: 3);
  }
  videoController!.seekTo(position);
}

기본값을 동영상의 최대 길이로 설정 후 현재 실행 중인 위치에서 3초를 더한 길이가 동영상 전체 길이보다 길지 않을 때만 현재 위체에서 3초를 더한 위치로 동영상을 돌린다

그게 아니면 동영상의 끝으로 돌린다

 

 

 

가운데 재생 버튼을 눌렀을 때 pause동작이 수행된다

오른쪽 앞으로가기 버튼을 눌렀을 때 동영상이 현재 포지션에서 3초 이동한 영상을 보여준다

그 상태에서 뒤로가기 버튼을 눌렀을 때 동영상이 그 포지션으로부터 3초 뒤로 이동한다