SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

Web APIで楽々Androidアプリ

AndroidアプリでInstagram APIを利用する

Web APIで楽々Androidアプリ(12)

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

Instagram API解析クラスの追加

 ここからコードの追加です。まずは、Instagram API解析クラス(ParseInstagramImage)を作成します。

リスト3 ImageInfo.java
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; }
}
リスト4 ParseInstagramImage.java
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に変更しています。

リスト5 MainActivity.java
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のグリッド表示
URLのグリッド表示

最後に

 今回は、画像のURLを取得するところまででした。次回は、実際に画像を表示する処理など、残りのコードを解説していきます。

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
Web APIで楽々Androidアプリ連載記事一覧

もっと読む

この記事の著者

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

WINGSプロジェクト 高江 賢(タカエ ケン)

WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書記事多数。 RSS X: @WingsPro_info(公式)、@WingsPro_info/wings(メンバーリスト) Facebook

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/7990 2014/09/04 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング