2017-03-04 5 views
0

私は、リストビューとマップビューを持つアプリケーションを構築しています。リストビューにはimageinfoセクションがありますが、イメージのスケーリングに問題があります。異なるサムネイルサイズを画面幅で作成するか、最大の画面サイズに合わせて最大のサムネイルサイズで表示しますか?

イメージはユーザーが自分自身や自分のリストなどをアップロードしたイメージです。私はAWS Lambda + S3を使用しています。そのため、サムネイルの画像の拡大縮小を変更して、複数次元のサムネイルを作成する可能性があります。

これらの画像は、モバイル/タブレット、デスクトップ、および大型(2k +)のディスプレイでアクセスできるように、どのようにスケールする必要がありますか?ユーザーがアップロードした画像から3つ以上の解像度の画像を作成してから、img-sm,img-mdimg-lgの区別子を使用する必要がありますか?

おかげ

+0

私はあなたのコードなしであなたを助けることができますか?いくつかのコードを教えてください。 –

+0

私の質問はもう少し一般的です。コードについてではなく、自分の側でサイズ変更を作成することができますが、目標とする3つの異なるディスプレイデバイスに3つの異なるサムネイルセットを用意するか、1つのサイズで表示するかどうかを尋ねています。 – scarywolfman

+0

同じ縮尺または異なる縮尺を設定することを決定しました。このためのルールはありません。モバイルビューや他のものを参照してください。必要でない場合は、変更してください。 –

答えて

0

CSSによるサイズ変更はお勧めできません。とにかく大きなファイルがユーザーのデバイスにダウンロードされているため、小さなサイズ変更されたイメージと比較して読み込みに時間がかかります。

完全なサイズの画像を提供する場合、2つの一般的なアプローチがあります。

1つのアプローチは、ユーザーが画像をアップロードするとすぐに、必要なすべての寸法でサイズ変更された画像を作成することです。

もう1つの方法は、1つの大きな画像をアップロードし、URLパラメータに高さ&を指定して、目的の寸法を取得することです。それはもっと有益です。これにより、今後、自分の側から多大な努力を払うことなく、アプリケーションのレイアウトを変更することができます。それ以外の場合は、必要な新しいサイズで古いイメージを再度アップロードする必要があります。

ImageKit.ioを確認することができます。これらのすべての機能+最適化があります。

関連する問題