8

WhatsApp の開発者は最近、画像の一部をすぐに読み込み (画像のサイズと画像のピクセルを取得)、画像全体を読み込んだ後、プレースホルダーを完全な画像に置き換える画像の読み込みを改善しました。

ここに画像の説明を入力

私の質問は、彼らはそれをどのように実装したのですか? ヘッダー (メタデータ) を読み取ることで、画像の寸法を読み取りますか? 画像の内容は？それとも、サーバー側に 2 つのバージョンのイメージがありますか? 最初にロードされる低品質の小さいバージョンと、完全なイメージである大きいバージョンですか? 2 番目のアプローチの場合、送信者から画像を受信したら、サーバー側で画像の小さいバージョンを抽出する必要があることに注意してください。他のアプローチはありますか？

4

4 に答える 4

2

色付きのプレースホルダーソリューションの別の方法として、実際の画像を読み込むまでプレースホルダーとしてサムネイル画像(100 X 100 ピクセルのみの場合があります) を表示する方法があります。

私はZingooでそれを行い、それについてブログ投稿を行いました. Picassoを使用すると、次のように実行できます。

Transformation blurTransformation = new Transformation() {
    @Override
    public Bitmap transform(Bitmap source) {
        Bitmap blurred = Blur.fastblur(LiveImageView.this.context, source, 10);
        source.recycle();
        return blurred;
    }

    @Override
    public String key() {
        return "blur()";
    }
};

Picasso.with(context)
    .load(thumbUrl) // thumbnail url goes here
    .placeholder(R.drawable.placeholder)
    .resize(imageViewWidth, imageViewHeight)
    .transform(blurTransformation)
    .into(imageView, new Callback() {
        @Override
        public void onSuccess() {
            Picasso.with(context)
                    .load(url) // image url goes here
                    .resize(imageViewWidth, imageViewHeight)
                    .placeholder(imageView.getDrawable())
                    .into(imageView);
        }

        @Override
        public void onError() {
        }
    });

Blurクラスを含む投稿自体の詳細。

于 2015-02-15T13:14:34.630 に答える
1

いくつかの実験の後、画像全体をダウンロードせずに寸法を取得しました。

String address = "image_url";
URL url = new URL(address);
URLConnection urlC = url.openConnection();
urlC.connect();
InputStream is = urlC.getInputStream();
for(int i = 0; i < 92; i++) is.read();

nt byte1 = is.read();
int byte2 = is.read();

int width = (byte1 << 8) + byte2;

for(int i = 0; i < 10; i++) is.read();

byte1 = is.read();
byte2 = is.read();

int height = (byte1 << 8) + byte2;

System.out.println("width = " + width + " | height = " + height);

is.close();
于 2013-11-22T11:26:35.247 に答える