SHOEISHA iD

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

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

業務アプリ開発に使えるUIが満載、「Xuni(ズーニー)」で作るAndroid/iOSアプリ(AD)

クラウド上のデータをグリッドやグラフで表示してみよう

業務アプリ開発に使えるUIが満載、「Xuni(ズーニー)」で作るAndroid/iOSアプリ 第2回

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

FlexGridの機能を見る

 クラウド、クライアントで準備が整ったので、実際の動作と併せて前回ご紹介しきれなかった各機能を見ていきましょう。

スターサイズ機能

 画面に水平スクロールが発生しないように、端末のサイズに合わせて自動でカラムサイズを調整します。端末を横にした際は横一杯に広がります。いわゆるレスポンシブなレイアウトです。

 適用の仕方はGridColumnに対して「setWidth("*")」とします。

 スターサイズを適用すると、すべてのカラムが同じ幅で横スクロールされない状態で表示されます。

 横にするとすべてのカラムが同じ幅で横スクロールしない幅まで広がります。

 「setWidth("2*")」などとすると、横幅の割合を変更できます。「15歳~64歳」のカラムに適用してみた例がこちらです。

 このようにカラムの横幅を相対的に指定して画面一杯に広げることが可能です。

フィルタ

 カラムごとにフィルタをかけることができます。例えば2000年からのデータを表示するといったことが可能です。

 フィルタはActivityに次の3つを実装することで実現できます。詳細はサンプルコードを参照下さい。

  • onCreateOptionsMenu()
    • フィルタのメニュー(アイコン)を表示する。
  • onOptionsItemSelected()
    • フィルタのメニューのイベント。別途実装したPopulationFilterFragmentを表示したり解除したりする。
  • PopulationFilterFragment.OnDataPass.saveData()
    • フィルタの実行イベント。フィルタ処理をここに実装する。

 実装した結果が次の画面です。右上のフィルタのアイコンが表示されます。

 年次を2000より大きいに設定して、フィルタをタップします。

 年次が2000年より大きいデータのみ表示されるようにフィルタリングされました。

ソート

 カラムをタップするごとに昇順・降順でソートが可能です。これはデフォルトで有効になっていますので特に実装は必要ありません。年次をタップして降順にした画面がこちらです。

次のページ
グラフを表示する

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

  • X ポスト
  • このエントリーをはてなブックマークに追加
業務アプリ開発に使えるUIが満載、「Xuni(ズーニー)」で作るAndroid/iOSアプリ連載記事一覧

もっと読む

この記事の著者

山本 誠樹(ヤマモト マサキ)

 スマホアプリからクラウドアプリまで作成するフリーのデベロッパー。記事へ質問などあればお気軽にご連絡ください。 Twitter:@nnasaki blog:http://blog.nnasaki.com

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

【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社

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

この記事をシェア

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

おすすめ

アクセスランキング

アクセスランキング

イベント

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

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

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

メールバックナンバー

アクセスランキング

アクセスランキング