2016-09-10 89 views
6

İçindekilere video içeren facebook özetine benzer bir uygulamanız var. Video oluşturmak için react-native-video kullanıyorum. Şimdi videoyu tam ekran yapmak için bileşeni başka bir bileşene geçirdim. Bu başka bir bileşen bir TouchableHightlight'a sahip. TouchableHighlight'ın onPress olayında, yeni bir yol oluşturulur ve bu.props.children, rotadaki bileşene sahne olarak geçirilir. Yeni bileşen sadece bir {bu.props.children}. Ancak bu, sarılmış Video bileşeninin bağlantısını kesmesine ve yeni görünümde yeniden oluşturulmasına neden olur (yani, bileşenin yapıcısını tekrar çağırır). Bu, aynı bileşenin kullanılması ve tamponlanmış verilerin saklanması ve bırakıldığı yerden devam ettirilmesi yerine videonun başlangıç ​​pozisyonundan yüklenmesine ve başlatılmasına neden olur. demo projeyeİki görünüm arasında görüş paylaşma tepki Yerel

Bağlantı: https://github.com/shahankit/video-player-fullscreen

Ben kontrolleri geçirilir desteklemek zaman gömülü geliyor oynatıcı kontrolleri varsayılan benzer bir şey istiyorum. bileşenini yapma

Bu yöntemler tam ekran aşağıdakine benzer görünüm hiyerarşileri oluşturma react-native-lightbox

+1

değişikliği yapmak için bir yol kullanmak zorunda mıyım tam ekran video görüntülemesi saydamlığını geçmek için küçük video görünümünde onPress kullanmak değil? –

+0

Tamam, durumu kullanabilirim, ancak gerçek uygulamada, videonun çok karmaşık bir hiyerarşiye sarılmış hali var. Tam ekran yapmak için Video bileşenini sarmalamayı yapmak zorundayım, tüm bileşenlerin üstüne çık ve tüm ekranı kapla. – meteors

+0

Görünümü tam ekran olarak CSS ile değiştirebilirsiniz. {position: 'absolute', yukarı: 0, left: 0, right: 0, bottom: 0}. Z-indeksi, tepki-native'de desteklenmediği için bir sorun olabilir. Öyleyse, mevcut oynatma süresinin yeni bileşene bir pervane olarak aktarılmasını ve videonun buradan başlatılmasını düşünebilirsiniz. –

cevap

0

alınır gidin. Video tam ekran ya da eğer kontrol etmek durumu kullanır can

- 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 

sonra,