Instagram API解析クラスの追加
ここからコードの追加です。まずは、Instagram API解析クラス（ParseInstagramImage）を作成します。
public class ImageInfo {
private String standard; // 標準解像度の画像URL
private String thumbnail; // サムネイル画像のURL
public String getThumbnail(){ return this.thumbnail; }
public String getStandard(){ return this.standard; }
public void setStandard(String standard){ this.standard = standard; }
public void setThumbnail(String thumbnail){ this.thumbnail = thumbnail; }
}
public class ParseInstagramImage extends ParseJson {
// 画像情報のリスト
private List<ImageInfo> image_info = new LinkedList<ImageInfo>();
// 次の画像を取得するためのURL
private String next_url = null;
public List<ImageInfo> getImageinfo() { return this.image_info; }
public String getNext_url() { return this.next_url; }
public ParseInstagramImage(String next_url) {
super();
this.next_url = next_url;
}
// 保持しているリストのクリア
public void clear() { this.image_info.clear(); }
// レスポンスの解析
@Override
public void loadJson(String str) {
JsonNode root = getJsonNode(str);
if (root != null){
// 次のURLを取得（1）
this.next_url = root.path("pagination").path("next_url").asText();
Iterator<JsonNode> ite = root.path("data").elements();
while (ite.hasNext()) {
JsonNode j = ite.next();
ImageInfo img = new ImageInfo();
img.setThumbnail(j.path("images").path("thumbnail")
.path("url").asText());
img.setStandard(j.path("images").path("standard_resolution")
.path("url").asText());
// 画像情報（URL）をリストに追加（2）
image_info.add(img);
}
}
}
}
ImageInfoは、画像情報を格納するデータクラスです。
レスポンスデータの解析は、ParseInstagramImageクラスのloadJsonメソッドで行います。引数で渡されたJSON形式の文字列から、次ページのURL（1）と、2種類の画像データのURLを取得（2）しています。
グリッドビューの表示
では次に、Fragmentクラスにコードを追加していきましょう。なお、今回のサンプルでは、Fragmentクラスの名称をPlaceholderFragmentからInstagramFragmentに変更しています。
public static class InstagramFragment
extends Fragment implements LoaderCallbacks<String>, OnRefreshListener {
private SwipeRefreshLayout swipeRefreshLayout = null;
// Instagram API解析クラス
private ParseInstagramImage parse =
new ParseInstagramImage(
"https://api.instagram.com/v1/tags/akb48/media/recent?client_id=XX");
@Override
public View onCreateView(LayoutInflater inflater,
ViewGroup container,Bundle savedInstanceState) {
View rootView =
inflater.inflate(R.layout.fragment_main, container,false);
return rootView;
}
@Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
setRetainInstance(true);
this.swipeRefreshLayout = (SwipeRefreshLayout)getView().
findViewById(R.id.SwipeRefreshLayout);
// プログレスアニメーションの色指定（1）
this.swipeRefreshLayout.
setColorScheme(android.R.color.holo_blue_bright,
android.R.color.holo_green_light,
android.R.color.holo_orange_light,
android.R.color.holo_red_light);
// 更新リスナーの追加（2）
this.swipeRefreshLayout.
setOnRefreshListener(InstagramFragment.this);
// アニメーション開始（3）
this.swipeRefreshLayout.setRefreshing(true);
onRefresh(); // 更新処理
}
// loaderの開始
private void startLoader(int id) {
getLoaderManager().restartLoader(id, null, InstagramFragment.this);
}
// 取得データの更新（次の20枚の取得）（4）
@Override
public void onRefresh() {
this.parse.clear();
startLoader(0);
}
@Override
public Loader<String> onCreateLoader(int id, Bundle args) {
HttpAsyncLoader loader = new HttpAsyncLoader(getActivity(),
parse.getNext_url());
loader.forceLoad();
return loader;
}
@Override
public void onLoadFinished(Loader<String> loader, String data) {
if (data == null) return;
this.parse.loadJson(data); // APIのレスポンスを解析する
// 文字列のアダプターを作成する
ArrayAdapter<String> adapter =
new ArrayAdapter<String>(getActivity(),
android.R.layout.simple_list_item_1);
// URLの取り出し
for (ImageInfo info : this.parse.getImageinfo() ){
adapter.add(info.getThumbnail()); }
// アダプターの設定
((GridView)getView().findViewById(R.id.gridView)).
setAdapter(adapter);
// アニメーション停止（5）
this.swipeRefreshLayout.setRefreshing(false);
}
@Override
public void onLoaderReset(Loader<String> loader) {}
}
これまでのローダーを使った処理と、大きく変わったところはありませんが、今回はSwipeRefreshLayoutの設定やメソッド呼び出しを追加しています。
SwipeRefreshLayoutでは、下方向へのスワイプ操作を検知すると、内部のビューの上端にプログレス表示のアニメーションが表示されます。デフォルトでは黒一色で分かりにくいため、Gmailと同様の色に設定しています（1）。
スワイプ操作が検知されると、リスナー（OnRefreshListener）のonRefreshメソッドが呼び出されます。サンプルではリスナー（インターフェース）は、InstagramFragmentに実装しています（2）。また、onRefreshメソッドでは、URLのリストをクリアして、ローダーを起動させています（4）。
なお、プログレス表示のアニメーションは、setRefreshingメソッドで任意に開始、停止させることができます（コールバックされたときは、自動で開始）（3）（5）。
アプリを起動すると、プログレス表示の後、画像のURLが表示されます（最大20個）。スワイプ操作すると、再度APIにアクセスして、次の20個のURLを取得、表示します。
最後に
今回は、画像のURLを取得するところまででした。次回は、実際に画像を表示する処理など、残りのコードを解説していきます。
