두 개의보기 간보기가 네이티브로 반응합니다.

동영상이 포함 된 페이 스북 피드와 비슷한 앱이 있습니다. 나는 비디오를 렌더링하는 데 react-native-video을 사용하고 있습니다. 이제 비디오를 전체 화면으로 만들려면 구성 요소를 다른 구성 요소로 래핑했습니다. 이 또 다른 구성 요소에는 TouchableHightlight가 있습니다. TouchableHighlight의 onPress 이벤트 내에서 새 경로가 만들어지고 this.props.children이 경로의 구성 요소에 전달됩니다. 새로운 컴퍼넌트는, {this.props.children}를 렌더링합니다. 그러나 이렇게하면 래핑 된 비디오 구성 요소가 마운트 해제되고 새 뷰에서 재구성됩니다 (즉, 구성 요소의 생성자를 다시 호출 함). 이로 인해 비디오는 동일한 구성 요소를 사용하고 버퍼링 된 데이터를 저장하고 그 위치에서 다시 시작하는 대신 초기 위치에서로드 및 시작합니다. 데모 프로젝트에두 개의보기 간보기가 네이티브로 반응합니다.

링크 : https://github.com/shahankit/video-player-fullscreen

나는 컨트롤이 전달됩니다 소품 때 내장되어 제공됩니다 플레이어 컨트롤을 기본값으로 비슷한 일을합니다. 구성 요소를 만드는

이 방법은 전체 화면은 다음과 같은보기 계층 구조를 만들기 react-native-lightbox

출처

2016-09-10 meteors

당신이 변화를 만들기 위해 경로를 사용해야합니까 전체 화면 비디오보기의 불투명도를 전환하는 작은 비디오보기에 onPress에 사용 아니? –

좋아요. 상태를 사용할 수는 있지만 실제 앱에서는 매우 복잡한 계층 구조로 래핑 된 비디오가 있습니다. 전체 화면을 만들기 위해서는 비디오 컴포넌트를 모든 컴포넌트 위에 배치하고 전체 화면을 감싸는 뷰를 만들어야합니다. – meteors

CSS로보기를 전체 화면으로 변경할 수 있습니다. {위치 : '절대', 상단 : 0, 왼쪽 : 0, 오른쪽 : 0, 아래쪽 : 0} Z- 색인은 반응 네이티브에서 지원되지 않기 때문에 문제가 될 수 있습니다. 그렇다면 단순히 현재 재생 시간을 새 구성 요소의 소품으로 전달하고 여기에서 비디오를 시작하는 것을 고려할 수 있습니다. –

에서 가져 간다. 당신이 비디오가 전체 화면의 경우, 또는 제어 상태를 사용할 수

- Root View(position: absolute) 
    - Your old entire screen layout which small video view is inside of it. 
    - Your fullscreen video view with opacity = 0 with more zIndex

는,

출처

2017-06-23 05:05:09 Nantaphop

두 개의보기 간보기가 네이티브로 반응합니다.

답변

관련 문제