SHOEISHA iD

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

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

現役エンジニア直伝! 「現場」で使えるコンポーネント活用術(ComponentOne Studio)(AD)

FlexChartをXamarin.Formsに導入してマルチプラットフォーム間での相違を探る

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

 FlexChartは、ComponentOne以外にもXuniやWijmoにも同名のコンポーネントが存在します。今回は、WPF向けに前回作成したものを、Xuniを適用して、スマホアプリ開発で最近非常に注目されているXamarin.Formsに移植してみようと思います。

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

 Xamarin.Formsは、C#を使ってコードを作成し、画面もWPFのXAMLによく似たXamarin XAMLを使ってモバイルアプリを作成することができる開発フレームワークです。

 WPFで気温と降水量の複合チャートを前回作成しました。これをXuniで作成してみます。もととなるデータは、気象庁の過去の気象データ検索サイトから東京の平均気温と、降水量の月合計を使います。

備考

 本記事で紹介している「Xuni」(2017年7月25日販売終了)の機能は、後継製品「ComponentOne Xamarin」(2017年7月26日発売)にて変わらずご利用いただけます。

Xamarin.Formsアプリ作成手順

 Xamarin.Formsでアプリを作成するにはVisual Studio 2017を起動して[Cross Platform]-[Crass Platform app]テンプレートで新規アプリ作成を行います。

図1 テンプレート選択
図1 テンプレート選択

 途中、共有プロジェクトかPCLかを指定するダイアログが表示されたときは共有プロジェクトを選択します。そうすることで「CZ1703CompositeChart」という名前の共有プロジェクトとプラットフォームごとに「CZ1703CompositeChart.Android」「CZ1703CompositeChart,iOS」「CZ1703CompositeChart.UWP」の合計4つのプロジェクトから構成されたソリューションが作成されます。

図2 ソリューション構成
図2 ソリューション構成

 「CZ1703CompositeChart」プロジェクトは、Android、iOS、UWPで共通のコードや画面定義などを記述するプロジェクトです。一番理想的なのはこのプロジェクトにほぼすべてのコードや定義を書いてしまうことです。アイコンやアプリ自体の定義などプラットフォーム依存の部分や、実際につくっていくとどうしても共通に書けないところがでてきたときには、プラットフォームごとに「CZ1703CompositeChart.Android」「CZ1703CompositeChart.iOS」「CZ1703CompositeChart.UWP」の各プロジェクトに記述します。

Xuniの導入

 Xamarin.FormsでXuniを使いたいときは、NuGetから必要なコンポーネントを導入してライセンスファイルを設定します。そのためには、プラットフォームごとのプロジェクトを選択し[プロジェクト]-[NuGetパッケージの管理]メニューをクリックします。

 管理画面が表示されたら、FlexChartを指定してインストールを行いますが、ここで注意したのは注意したいのはNuGetのパッケージソースの指定です。日本語対応のXuniはグレープシティからの配布となるのでNuGetのパッケージソースとして「GrapeCity」を選択し、今回はXamarin.Fromsで使用するので「Xuni.Forms.FlexChart」を選択します。

図3 NuGetパッケージの管理
図3 NuGetパッケージの管理

 Xuni.Forms.FlexChartが動作するのに必要な部品は同時に自動的に導入が行われます。

図4 関連部品の表示
図4 関連部品の表示

次のページ
複合チャート:CZ1703CompositeChart

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

  • X ポスト
  • このエントリーをはてなブックマークに追加
現役エンジニア直伝! 「現場」で使えるコンポーネント活用術(ComponentOne Studio)連載記事一覧

もっと読む

この記事の著者

初音玲(ハツネアキラ)

 国内SIerのSEでパッケージ製品開発を主に行っており、最近は、空間認識や音声認識などを応用した製品を手掛けています。 個人的には、仕事の内容をさらに拡張したHoloLensなどのMRを中心に活動しています。 Microsoft MVP for Windows Development ブログ:http://hatsune.hatenablog.jp/

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

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

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

この記事をシェア

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

おすすめ

アクセスランキング

アクセスランキング

イベント

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

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

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

メールバックナンバー

アクセスランキング

アクセスランキング