3

Facebook グラフ API http://developers.facebook.com/docs/reference/api/post/を使用し、パラメーターを追加していpictureます。私たちの写真は 30x30 ピクセルの画像で、Facebook の Web バージョンにぴったりのサイズです。ただし、iPhone4 (Retina ディスプレイ) で FB モバイル アプリを使用すると、画像がピクセル化されます。

60x60 の高解像度画像を提供する方法はありますが、Facebook のウォール投稿では常に 30x30 でレンダリングしますか?

4

3 に答える 3

3

さて..現時点で、これが私が見つけたものであり、このコンセプトをテストして遊んでいる時間に基づいて、私のために働いた「解決策」を提供します. 質問への迅速な回答が必要なすべての読者のために、私は質問に対する正確な解決策を持っていませんが…. 基本的に、30x30 の画像は 90x90 にスケーリングされます。60x60 の画像は 90x90 にスケーリングされています。そして、私はこれを回避する方法を見つけることができません。

以下は私が試したことです。入力を自由に追加してください。

  • フィード画像を取得し、画像のフレームの周りに 2 ~ 5 ピクセルの黒い線を描きます。

  • アプリをロードし、デバイスでウォール フィードを開始します。画像が表示されたら、スクリーンショットを撮ります。画像を自分宛に郵送してください。Photoshop (または写真編集プログラム) で開きます。マーキー ツールを使用して、画像の輪郭を描きます。スクリーンショットから切り取って、新しい画像として貼り付けます。サイズは何ですか?90×90ですよね?(画像が網膜の場合は明らかに 180x180)

  • 90x90 の画像を作成します。元の 30x30 画像をコピーして、新しい 90x90 画像のフレーム内の任意の場所に貼り付けます。URL パラメータの場所にアップロードします。アプリを再実行します。再実行するとは、完全にシャットダウンする必要があることを意味します。SDK がフィードの最初の起動時に画像をキャッシュしているように見えます。アプリを完全に閉じて再実行すると、そのキャッシュをクリアできます。これを行うと、画像の外観が大幅に改善されます。網膜画像ではないかもしれませんが、少なくとも「ぼやけた醜い」ものにはなりません。この時点で、ラスター グラフィックスへの変換によって生じるエイリアシング効果を除去するためにデザイン プロセスで実行された、例示的な線がいかに優れているかということになります。同様に、リサンプリング方法のバリエーションがさらに良い結果をもたらすかどうかはわかりません。

私が試したいくつかのこと:透明度のないpngファイルとしても保存しました:90 x 90サイズの144ppi。つまり、90x90 の画像をより高い解像度 (ピクセル/インチ) で保存します。画像のサイズを変更するときは、プロポーションを制限しないでください。また、Adobe 製品 (例: photoshop) を使用している場合は、Web 用に保存しないでください。指定した ppi が保持されるため、「名前を付けて保存...」を使用してください。ただし、この方法で表示される品質に大きな違いがあるとは思いません。ファイルサイズを小さく抑えることをお勧めします。これにより、全体の画像サイズが約 500% 以上増加します。

同じホストされたフォルダー内で 2 倍のサイズ (180x180) の画像をホストし、それに image@2x.png & image-large.png <--(念のため) という名前を付けるバリエーションを試しました。これも実際には問題を解決していません。

私が試していない他のいくつかのこと:

  • Web サーバーのトラフィックを監視し、リソースへの「見つかりません」エラーを監視して、FB が表示用の画像を取得するときに潜在的な代替リソースにアクセスしようとしているかどうかを確認します。表示されるウォール フィード ボックスは Web ビューです。Web グラフィックの意味。(これは FB の Web ページです...つまり、彼らのルールであり、SDK 内でページのソースを利用できるとは思えません..だから!…

  • サファリ ブラウザでフィード自体の HTML を確認します。FB ウォールに投稿された最終結果の画像内の HTML を調べると、これがわかります….

    • <img class="img" src="http://platform.ak.fbcdn.net/www/app_full_proxy.php?app=153675474666495&amp;v=1&amp;size=z&amp;cksum=773bba91f6146b2463eed0a0bb77dc42&amp;src=http%3A%2F%2Fwww.thumbwizards.com%2Fspeakinapps%2Fgraphics%2Fboxed%2Faussie.png" alt="">

不思議なんだけど:

  • HTML5 内に、Web ページから Retina グラフィックスを表示するツールキット タイプの JavaScript を提供するメカニズムはありませんか?

  • 画像への URL を取得するときにそのコードを実行することは可能でしょうか (つまり、画像の URL はコードへのポインターとして機能します。私のロジックが教えてくれるので、これで遊んでみませんでした)上記の URL によると、この時点で FB が基本的に画像を制御しています.画像が明らかにキャッシュされており、新しい画像で壁に投稿されていることに気付きました (そして、確認するのに十分な時間待ちませんでした)。古い画像がまだ使用されています. (そして、はい、ブラウザのキャッシュをクリアしました)... おそらく単に別の場所にキャッシュされた..

公開されていない画像タイプの別のパラメーターがある場合、まだ遭遇していません。

  • [http://platform.ak.fbcdn.net/www/app_full_proxy.php] この php ファイルが利用可能な画像プロセッサの一部である場合、何ができるかを表示するためにアクセスできます。 ?

  • フィード投稿で Retina グラフィックを使用するアプリについて言及できる人はいますか?

本当に考えただけで、私は本当に収穫を与えないことに決めました、そしてあなたがここまでやったなら。ご覧いただきありがとうございます。Sulf さん、30x30 を 90x90 にスケーリングしています。それを醜くする!

頑張ってください..他に何かわかりましたら、お知らせください!

マーク

于 2011-09-05T09:50:47.673 に答える
2

Appleは、iOSアプリに網膜効果を追加する場合は、この形式で使用している画像を指定します。

sampleImag.png- 57 * 57(サイズ)、163(DPI)sampleImag@2x.png-114 * 114(サイズ)、326(DPI)これらの特定のグラフィック画像を使用すると、アプリがiPhoneで網膜効果を示していることがわかります4世代以上。

于 2011-09-05T10:17:15.513 に答える
0

コードをより大きなスケールの画像にポイントするだけで、後は Facebook が処理します。

于 2011-09-16T22:31:43.970 に答える