2017-02-02 9 views
1

私は、ScrollView内の画像をアスペクト比を維持しながら画面の全幅を取ろうとしています(私は固定背景画像を必要としません)。 https://github.com/facebook/react-native/issues/950の回答は、Viewでは動作しますが、ScrollViewでは動作しません。ScrollViewの全幅画像

ヌルの幅/高さのトリックは画像​​を消すだけです。 Dimensions.get('window').widthを使用して幅を設定することは何らかの理由で機能しません。アスペクト比に応じて、画像の上下左右または画像の左右にいくらかのスペースを残します。

イメージがローカルであるため、を使用することはできません。このようにスタイリングする必要がある他の多くのイメージがあるため、ハードコーディングを避けることになります。私はflexalignSelfなどの他の多くの組み合わせを試しましたが、どれもうまくいかないようです。

+1

すべての画像のアスペクト比が同じであることが分かっている場合は、 'const imageHeight = imageWidth/aspectRatio;」または0.40の新しいスタイル属性を使用して計算できます。https://github.com/facebook/react-native/commit/5850165795c54b8d5de7bef9f69f6fe6b1b4763d 私は同じ問題を抱えていましたが、リモートイメージを使用していましたので、私はそれを 'getSize'を使って行い、自分で次元を計算しました。他の解決策を見つけることができませんでした。 – binchik

+0

いいえ、すべて同じアスペクト比を持っているわけではありません。そのため、私はハードコーディングを避けたかったと言いました。 –

+0

イメージのコンポーネントは、イメージのアスペクト比に基づいてサイズ変更されません。だからあなたはイメージのサイズを取得し、いくつかの計算を行う必要があります。次元をハードコーディングするのと同じではありません。私は、各画像コンポーネントにaspectRatioスタイルを使用できると思います。 RN 0.40以前は、画像のアスペクト比に基づいて 'onLayout'の内部でサイズを変更できる独自のコンポーネントを作成しました。 aspectRatioスタイルが機能しない、または0.40を使用できない場合は、コードを自分と共有できます。 –

答えて

0

ScrollViewのstyle={{width: "100%"}}の設定は私の仕事です。

関連する問題