2017-06-14 11 views
1

私はyoutubeビデオiframeをWebViewコンポーネント内に配置しようとしていますが、これはうまくいきますが、iframeサイズに合わせてWebViewコンポーネントのサイズを設定したい場合、ビデオの周りに囲みます。本当に奇妙なのは、iframeの幅を画面の幅に設定すると、このサイトのギャップが大きくなるということです。私はViewタグでWebViewをラップし、このViewコンポーネントの高さをiframeの高さに設定するようなことをたくさん試しましたが、常にWebViewにスクロールバーが表示されるように、上下に枠線を残しています。ここで WebView埋め込みビデオには常にビデオの周りに白い枠が付いています

はイメージです:あなたは、私は、高さ= 20を入れるためにここにしようとした見ることができますが、私はまだ全体のビデオを見ることができますidは何も変更していないよう link

は、ここに私のコード

render() { 
    return(
      <WebView 
      source={{html: `<html><body><iframe width="${this.SCREEN_WIDTH}" height="315" src="https://www.youtube.com/embed/ojmk5tSj0sE" frameborder="0" allowfullscreen></iframe></html></body>` }} 
      style={{height: 20}} 
      > 
      </WebView>   
    ) 
} 

です。私はとの組み合わせを試みました。自動的に調整しました.AddContentInsets = {false}scalesPageToFit = {true}。私も試しました:

marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no" 

結果は表示されません。

私は同じ問題を抱えて誰かからthis記事を読んで、それを

に答えていないそれは簡単なことのように思えるが、それは私のアプリで進んから私を防ぎます。 Im 反応ネイティブのボーダーとマージンが0の埋め込みiframeを100%作成したことを確認してください:P。あなたがいくつかの例を見たなら、私に知らせてください。

答えて

0

私の推測では、不要なギャップはiframeをラップするbodyタグから来ていると思います。 HTMLやbodyタグのマージンとパディングは、Webで通常と同じ方法でリセットする必要があります。参考までに、あなたはSafariを開いて、Develop - > iPhone simulator - > YOUR WEBVIEWをクリックするだけで、WebViewのコードとスタイルを調べることができます(これはおそらくabout:blankと表示されます)。次に、

関連する問題