React Native で画像グリッドを構築するのを手伝ってほしいです。
配列内のマップされたデータを使用して画像グリッドを作成しようとしています。マッピング部分は正常に機能しますが、画像が希望どおりに配置されません。 これが私が探しているものです（赤い四角の場所に画像が配置されています）。
これはこれまでの私のコードです:
リーリーこれは私の CSS です:
リーリーこれは私が現在得ているものです:
これまでのところ、考えられるすべての CSS の組み合わせを試しましたが、これまでのところ何も機能しません。 FLATLIST も試しましたが、正直に言うと、現在のコードをフラットリストの要件に「適合」するように適切に変換できませんでした。
＃＃＃助けてくれてありがとう！ 乾杯！
P粉3302320962024-02-22 00:48:20
これは HTML エラーです。 実際には、要素ごとにフレックスラップ スタイルを設定するため、行ごとに要素が 1 つだけ存在します。 flex-wrap div が機能するには、すべての要素を flex-wrap div に入れる必要があります。お役に立てば幸いです
リーリーP粉1352928052024-02-22 00:05:05
答えが見つかりました! 2 つのチュートリアルのいくつかのヒントを組み合わせて、無事に完了しました。
まず、「FlatList」を使用して画像グリッドを構築しました。ここで素晴らしいステップバイステップのチュートリアルを見つけました (私のページではなく、アフィリエイトもありません): YouTube チュートリアル 最初は、「numColumns={ }」
を追加するまでは同じ結果が得られました。コードは以下のように表示されます:
リーリー.
リーリー次に、このチュートリアルのいくつかの戦略を使用しました (私のページではなく、アフィリエイトでもありません)。 YouTube チュートリアル
見た目を良くするために CSS を微調整する必要がありますが、今のところ満足しています。
