Yerel Android ViewManager Tepsisindeki Fragmenti Gizleme

Question

YouTube Android API'sini React Native için bir UI Bileşeni olarak sarmalamaya çalışıyorum. Bazı şeylerin Android konfigürasyonunda başarılı oldum (onInitializationSuccess), ancak YouTubePlayerView cihazımı React Native uygulamasına nasıl geri döndürdüğümü anlayamıyorum.

YouTubeBaseActivity'yi genişletemezseniz, dokümanlara göre YouTubePlayerFragment uygulamasını kullanmanızı öneririz. Android'de React Native, XML tabanlı mizanpaj kullanmıyor olduğundan, görünümleri programsal olarak oluşturmaya çalıştım. Ancak, Sarma Görünümünü döndürdüğümde (FrameLayout olarak denedim, ancak doğru seçim olup olmadığından emin değilim).

Şimdilik son derece basit tutmak arıyorum, burada kod gerekli bit şunlardır:

YouTubeManager.java

public class YouTubeManager extends SimpleViewManager<FrameLayout> implements YouTubePlayer.OnInitializedListener { 
// ... 
@Override 
    protected FrameLayout createViewInstance(ThemedReactContext reactContext) { 
     this.reactContext = reactContext; 

     FrameLayout view = new FrameLayout(reactContext); 
     view.setId(View.generateViewId()); 


     FragmentManager fragmentManager = activity.getFragmentManager(); 
     FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction(); 

     YouTubePlayerFragment fragment = new YouTubePlayerFragment(); 
     fragmentTransaction.add(view.getId(), fragment); 

     fragmentTransaction.commit(); 

     fragment.initialize("SECRET_KEY", this); 

     return view; 
    } 
// ... 
} 

YouTube.js

class YouTube extends Component { 
    render() { 
     return <YouTubeAndroid {...this.props}/>; 
    } 
}; 

var iface = { 
    name : 'YouTube', 
    propTypes : { 
     ...View.propTypes 
    }, 
}; 


var YouTubeAndroid = requireNativeComponent('YouTube', iface); 

module.exports = YouTube; 

index.android.js

var YouTube = require('./YouTube'); 

class YouTubePlayer extends Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text>hello</Text> 
     <YouTube /> 
     </View> 
    ); 
    } 
} 

Herhangi bir yardım gerçekten çok memnun olur, teşekkür ederim!

Answer 1

YouTube fragmanı için gerçek bir çözüm yok, ancak RN'de bir YouTube görünümünü görüntülemek için bazı geçici çözümler kullandım.

(Belki öncelikle fragmanı üzerinde 3. yılında kesmek deneyebilirsiniz.)

1. olun YouTubeBaseActivity uzanır ve MainActivity bunu uzatır let kendi ReactActivity.

   public abstract class ReactActivity extends YouTubeBaseActivity implements DefaultHardwareBackBtnHandler { 
       // copy & paste RN's ReactActivity.java source 
   

2. YouTubePlayerView için YoutubeManager sınıfını olun.

   ReactPackage uygularsanız,numaralı telefondan bir Activity örneği gerekir. ve bunun için bir js modülü hazırlayın.

   module.exports = requireNativeComponent('RCTYoutube', iface); 
   

3. Artık bir YouTube görünümü görüntüleyebilirsiniz, ancak boş görünüm gibi görünüyor. Bunun için biraz hack gerekiyor.

   componentDidMount() { 
       this.setState({ 
       width: this.props.style.width, 
       height: this.props.style.height - 1 
       }) 
       this.timer = setInterval(()=>{ 
       this.setState({ 
        width: this.props.style.width, 
        height: this.props.style.height + Math.floor(Math.random() * 2) 
       }) 
       }, 500) 
   } 
   
   render() { 
       return (<YoutubeView style={[style, { width: this.state.width, height: this.state.height }]} />) 
   } 
   
   componentWillUnmount() { 
       if(this.timer) clearTimeout(this.timer); 
   } 
   

benim app aslında nasıl çalıştığını görebilirsiniz.

https://play.google.com/store/apps/details?id=kr.dobbit.sharehows