[Android] Picasso でネット上の画像をGridViewで表示

picasso gridview 01 - [Android] Picasso でネット上の画像をGridViewで表示
ギャラリーやフォトアプリのように作るにはGridViewを使いますが、画像の扱いはうっかりするとOutOfMemoryにはまってしまいます。

そこでそういったところを簡単にしてくれるライブラリーPicassoを使ってGridViewを作ってみます。

Android Studio 3.4.1
Android 9.0

 



Picasso

 
Picassoはネット上の画像をもってくるのも簡単にできています。通常であれば非同期での http接続を考えなければいけないところ、コードがとても簡単になります。
 
picasso gridview 02 - [Android] Picasso でネット上の画像をGridViewで表示

 

PicassoをGridViewに導入

 
Picassoにサンプルコードがあります。ただ膨大な量なので美味しいところだけつまんでみたいということです。Picasso 大きい画像を扱ってみるで基本的な使い方がわかります。ほぼ1行です。
 
GirdViewの基本的なところは GridViewの作り方使い方 を参照してください。
 
ざっくりした差分としてはViewHolderをやめて、Picassoの画像ダウンロードを記述するところです。
 

 

サンプルコード

 
例えば、下のような10個の画像をサーバーに上げて、それをダウンロードして表示させて見たいと思います。
 
gridview picasso 01 - [Android] Picasso でネット上の画像をGridViewで表示
 
画像サイズはバラバラですが、端末の画面が高解像度で横幅が1000ピクセルを超えているものに綺麗に表示させることを考えて、画面サイズの半分程度1000pix〜290pixあたりの大きさのものにしてみました。
 
ネットワークを使うのでマニフェストにpermissionを設定
AndroidManifest.xml

 
Picassoを使うための設定
バージョンは Picasso を確認して合わせてください。

 
MainActivity.java

 
GridAdapter.java

 
レイアウトです。
activity_main.xml

 
grid_items.xml

 
strings.xml

 

サンプル動画

 
画像をダウンロードするのですが、通信状況が悪くダウンロードに時間がかかる、あるいは接続先の画像がなかったりすることも考えられます。
ダウンロードに時間がかかって画像が表示されるまで、placeholderを表示させて

placeholder 01 - [Android] Picasso でネット上の画像をGridViewで表示
接続先の画像に問題があってダウンロードが失敗した場合に、エラー画像を表示させてみましょう。

error 01 - [Android] Picasso でネット上の画像をGridViewで表示

 

 

 

drawable, assets

 
Picassoなので設定はdrawable, assets, アプリ内の内部ストレージでもネットURLと同様になります。
 
.loadでdrawableのR.darowable.XXXを呼び出す

 
assetsでは
“file:///android_asset/yuka1000x1000”
というassets用のパスを指定すると画像を引っ張ってこられます。

また内部ストレージではファイルのパスは
/data/data/(package name)/files/…
となります
 
 
関連記事:

 
References:
Grid View | Android Developers
GridView | Android Developers
Picasso

誤字脱字、意味不明で分からにゃイ、
などのご意見はこちらから mailフォーム

ブックマークしておくと便利です このエントリーをはてなブックマークに追加




アプリ開発が上達するお勧め

アプリ開発を始めたけどわからないところがあり、誰かに聞きたいけど周りにはそんな人はいない…あるいは、会社で働いていて日中そんなに時間をとれないなど、オンラインのプログラミングスクールがいいでしょう、時間の制約がないところが一番の魅力です。

以下の3つはAndroidが学習できるオンラインスクールです。


TECH ACADEMY
Androidアプリコース



侍エンジニア塾
侍エンジニア塾 無料体験レッスン



CodeCamp
~約8,000名の受講生と80社以上の導入実績~
現役エンジニアのオンライン家庭教師CodeCamp





正直ネットや本では限界があります。直接(ネットで)誰か分かる人に聞いた方が早く解決して、上達も早いと思います。

尚、スクールがダメだと言う人がいますが、やる気があれば問題ありません。与えられるのを待っていてはいけないですね
欲しいものは取りに行くのです。


Google Pixel 3 XLグローバル版
SIMフリー 並行輸入品
6.3インチの大画面
背景をぼかすポートレートモード撮影


Anker PowerCore II Slim 10000
Power IQ 2.0搭載
iPhone & Android対応

シェアする

  • このエントリーをはてなブックマークに追加

フォローする