Androidでグラフを描こう [ MPAndroidChart, C# ]

Androidでグラフを描こう

燃費を計測するアプリを作成しているとき、ふとグラフもあった方が視覚的に分かりやすくていいんじゃない？と思い「Android　グラフ」でGoogle先生にお尋ねしました。
するとほとんどが Java 言語 + グラフ用ライブラリの解説サイトでしたがその中に、C# に簡単に移植できそうなものを見つたのでご紹介します。。

その名も…

MPAndroidChart
(ｴﾑ・ﾋﾟｰ ｱﾝﾄﾞﾛｲﾄﾞ・ﾁｬｰﾄ)

MPAndroidChart は Visual Studio の [NuGet パッケージの管理] から簡単にダウンロードし使うことができます。

詳細については後日改めて記載するが、簡単に使い方を紹介すると次の通りです。

• 画面 AXML にグラフのコントロールを設定（グラフ毎に設定項目が多少違うが、基本コピペで）
• データの入力
• 表示設定（色やアニメーションについてなど）

基本的にはこれだけで動的なグラフがすぐに作れてしまいます。アニメーションの設定もソース１行で済みます。

実際にインストールから 3時間程試行錯誤して、次のようなグラフができました。




フリックするとこのようなアニメーションが動きます。なかなかおもしろいですね






次回、詳細なコーディングについてお楽しみください。

Androidアプリ開発の第一歩 Xamarinってなんだ？

ようこそ、Android開発に興味をもってこのページへ辿りつかれた方へ。
この記事はAndroid開発を１からはじめようとする人向けに執筆しています。

いつかPlay Storeに自作アプリを掲載して一山当てたい！（金銭的にウハウハな夢を見ている人や、1000万ダウンロードになりたい！と目指す人など…一山の価値観もそれぞれですが）そんな人達が、どうやって１から作るの？というところから読んでわかるサイトです。

スマホアプリの特徴

スマホアプリは大きく分類して、ネイティブアプリ と Webアプリ、 Java アプリ が存在します。

① ネイティブアプリ とは

• 演算処理をネットワーク上のサーバーで行う。
• 端末はもっぱら入出力のみ。
• インターネットに接続できるネットワーク環境が必要。
• 通信障害やサーバー側の不具合によって利用を影響される。

といった様に処理性能がサーバーに依存しやすくなっています。

② Web アプリ とは

• 端末で演算処理も入出力も行う。（処理性能はスマホに依存する）
• ネットワーク環境を必要としない。
• 低スペックなスマホでは動かないアプリも出てくる。

③ Java アプリ とは

Javaアプリとネイティブアプリとの対比は、携帯電話（フィーチャーフォン）の発展史において話題に上ることが多い。
スマートフォンやタブレット型端末などのスマートデバイスでは、ソフトウェア開発キット（SDK）で開発されたアプリをネイティブコードに変換して実行するJavaアプリ型の方式が当たり前となっており、ことさらにJavaアプリとネイティブアプリとを対比することはあまりない。



ちなみに、Android端末などのスマートデバイスのアプリ（モバイルアプリ）において、アプリケーション自体はネイティブアプリでありつつデータの扱いはWebアプリと同様であるような作りのものを「ハイブリッドアプリ」または「ガワネイティブ」などと呼ぶ場合がある。ユーザーインターフェースはレスポンスがよく機能も豊富に、そして情報はクラウド上の豊富なデータを用いてリッチに、というような、両方式のメリットの総取りが期待できる方式として注目されている。

Xamarinとは？

ここ数年前までは、Andoroid アプリ開発と iOS アプリ開発、Windows アプリ開発はまったく別々な開発環境（IDE）を用意して、それぞれのプラットフォームに合わせた画面をデザインしコーディングをしていました。 Android なら Java 言語で Eclipse を IDE とした開発をし、Windows なら C# で Visual Stuido を IDE とした開発をし、iOS なら Mac を用意して… といった具合に、とても手間暇がかかりました。

ところが、最近の主流はクロスプラットフォームという一つの IDE を利用して、共通化できる処理はひとまとめにコーディング。各OSごとの微調整を少ししたらあっという間に複数の OS 用アプリが出来上がり！という大変便利な機能が誕生しました。このクロスプラットフォームに Visual Studio 2013 Community は対応しています。


Xamarin はVisual Stuido 2013 Community 上でクロスプラットフォームで実現するためのアドインです。

Xamarin の本家は英語ですが、日本語版にローカライズされたアドインが用意されており、ライセンス販売・コーディング解説を「エクセルソフト」が取り扱っています。



ここからはエクセルソフトで紹介されている Xamarin + Visual Stuido + C# のクロスプラットフォームについて簡単にまとめて紹介します。（参照元：Xamarin）




つぎに Microsoft で掲載されているクロスプラットフォーム、Xamarinに関連したページを紹介します。
こちらはしっかり読むと結構なボリュームになるため、大事な点だけまとめて掲載します。

１．Microsoft おすすめ一覧

Visual Studio に関するおすすめトピック、キャンペーン、イベント、セミナーの情報を掲載しています。

２．Visual Studio ではじめる iOS/Android/Windows クロス プラットフォーム アプリ開発

Visual Stuido で Android, iOS の開発ができることを紹介しています。
　HTML と JacaScript で開発をする Cordva (コルドバ)アドインと、C# で開発をする Xamarin アドインの2種類を紹介。 今回は Cordva については触れません。

３．【無償版】Visual Studio の活用法

Visual Stuido Community と Visual Stuido Express の違いについて表にまとめて解説しています。

４．C#/.NET で iOS/Android/Windows Phone アプリ開発

無料の試用版 Xamarin for Business を使って、Xamarin のインストールから実行、デバッグまでの流れを簡単に紹介しています。
だいたいの開発の流れがわかると思います。

Xamarin.Android をインストールする手順

Xamarin のインストールはエクセルソフトで紹介されています。

　Windows に Xamarin.Android をインストールする手順

Xamarin のダウンロード ⇒ インストール ⇒ Xamarin Stuido の設定 ⇒ Visual Stuido の設定 ⇒ エミュレータの設定 と進みます。

「新しいVirtual Device を作成」まで終わったら、Xamarinの開発環境は９０％完成です。すぐにVisual Studio を起動して開発をすることもできます。




………しかし、あなたは標準の Android エミュレータの遅さにイライラすること間違いなしです。
次回は、高速なエミュレータ「Genymotion Emulator」のインストールを紹介します。お疲れ様でした。

おしまいに

人気の高いモバイルアプリは Android、iOS、Windows Store と次々に移植され世界中のユーザに広まっていきます クロスプラットフォームは開発者のコーディング時間を短縮させ、よりスムーズに柔軟な開発・保守を可能とさせました。そして、これからの開発者に求められるのはコーディングする力 + α のスキルです。

　コーディング + デザイン ができる。
　コーディング + 魅力的なシナリオを描ける
　コーディング + ユーザの求めているものにアンテナを張れる

……といった具合です。チームで開発を進めれば、各々の役割分担を明確に作業に専念できるでしょう。しかし、開発環境の進歩によって一人でも開発が出来る今では + α の力はとても大切です。

Visual Studio Community 2013 インストールガイド

マイクロソフトが2014年11月13日、高価なPro版と同等の機能を有する「Visual Studio Community 2013」を特定ユーザに無償提供することを発表しました。

Android アプリ開発用にインストールしてみたので、ダウンロード～インストール～起動までの方法をご紹介します。

Visual Stuido Community とは

Visual Stuido の各エディション Community, Professional, Enterprise の比較がMicrosoftのVisual Stuido Community 紹介ページ(https://www.microsoft.com/ja-jp/dev/products/community.aspx)に掲載されています。
これによると、Community と Professionalは同等の機能を持っていることがわかります。高機能で安定性のあるソフト開発環境(IDE)が無料とは、コストをかけずに一山儲けたい開発者にとって大変ありがたい話である。

	Community	Professional	Enterprise
利用可能ユーザー タイプ	●個人開発者 ●学習、学術調査目的の開発者 ●オープン ソース開発者 ●中小規模の企業や団体	あらゆるユーザー	あらゆるユーザー
全アプリをターゲット	○	○	○
機能拡張	○	○	○
単体テスト	○	○	○
テスト ケース管理	×	×	○
自動 UI テスト	×	×	○
コード カバレッジ	×	×	○
Release Management	×	×	○
フィードバック クライアント	×	×	○
コード クローン分析	×	×	○
IntelliTrace	×	×	○
依存関係グラフ	×	×	○
CodeLens	×	○	○

Visual Studio Community 2013のダウンロード

ダウンロードはこちらからできます。(2016/3月時点)
https://www.visualstudio.com/ja-jp/downloads/download-visual-studio-vs#DownloadFamilies_2



画面ひだり側のメニューから[Visual Stuido 2013]⇒[Community 2013]をクリック。
Visual Stuido2013 本体と Language Pack をダウンロードします。保存場所は任意の場所を選びます。
ダウンロードが完了するまで少し待ちましょう……( ^^) _旦~~

Visual Studio Community 2013のインストール

まずは本体（英語版）のインストールです。インストールにはHDDの容量を約10GBほど消費するため、空き容量に注意が必要です。

○本体のインストール

ダウンロードした「vs_community.exe」をダブルクリックで実行します。


ライセンス条項とプライバシーポリシー同意にチェックを入れ、「Next」を押します。


インストールするコンポーネントを選択します。全て選択して「INSTALL」を押します。管理者権限が必要です。


インストールが始まります。多数のファイルをダウンロードしながらインストールするためしばらく時間がかかります。

○言語パックのインストール

本体のインストールが完了したら「vs_langpack.exe」をダブルクリックで実行します。日本語化が行われます。


Microsoft Visual Studio 2013 Preparation」のステップは異常に時間がかかりますが気長に待つ以外にありません。


セットアップが正常に完了した旨のメッセージが出たらインストール完了です。

Visual Studio Community 2013の起動

Visual Studio Community 2013はWindows7の場合はスタートメニューから、Windows8(8.1)の場合アプリ一覧から起動できます。


初回起動時によく使う言語のテンプレートを選択します。今回は「Visual C#」を選択します。起動が完了すると以下のような画面になります。※テンプレートは後からも変更できます。

おしまいに

個人であれば無償で使うことができるため、学生の方や家でもプログラミングしたい社会人には非常に嬉しいVisual Studio Community 2013の公開でした。

マクロでセルの移動方向を制御する

Enter キーを押したとき、セルは下に移動します（初期設定）。
[オプション]からセルの移動方向を上下左右に変更することができます。

１）『オプション』メニューからセルの移動方向を変更する方法

『ファイル』⇒『オプション』⇒『詳細設定』⇒『Enterキーを押したら、セルを移動する（M）』で変更できます。
上・下・左・右の４方向から選びます。





この変更方法は、すべてのExcelファイルに対して設定が反映されます。
つまり、ファイルAを開いているときにセルの移動方向を『右』に設定すると、ファイルBを開いたときも
セルの移動方向は『右』になります。

特定のファイルだけセルの移動方向を変更したい！という方は、次のマクロで変更する方法に進みましょう。

２）マクロでセルの移動方向を変更する方法

書き込むワークブックは「ThisWorkbook」です。以下のソースを張り付けてください。

'ブックがアクティブになったとき、セルを右に移動するよう設定
Private Sub Workbook_Activate()
  
    Application.MoveAfterReturn = True
    Application.MoveAfterReturnDirection = xlToRight

End Sub

'ブックが非アクティブになったとき、セルを下に移動するよう設定
Private Sub Workbook_Deactivate()
    
    Application.MoveAfterReturn = True
    Application.MoveAfterReturnDirection = xlDown

End Sub

ブックのイベントプロシージャを復習しましょう。

イベントの種類	イベントトリガー
Activate	ブックがアクティブになったとき
Deactivate	ブックがアクティブでなくなったとき

ここで使うプロパティは以下の２つです。

MoveAfterReturn

ユーザーが Enter キーを押したときに、アクティブ セルを移動するかどうかを決定します。既定値は True です。ユーザーが Enter キーを押したときにアクティブ セルを移動する方向を設定するには、MoveAfterReturnDirection プロパティを使用します。値の取得および設定が可能です。ブール型 (Boolean) の値を使用します。

使用例

次の使用例は、ユーザーが Enter キーを押した後も、アクティブ セルが選択されたままの状態にします。 Spreadsheet1.MoveAfterReturn = False

出典

https://msdn.microsoft.com/ja-jp/library/cc409510.aspx

MoveAfterReturnDirection

MoveAfterReturn プロパティが True に設定されている場合、ユーザーが Enter キーを押したときにフォーカスが移動する方向を設定します。値の取得および設定が可能です。使用できる定数は、XlDirection クラスの定数のいずれかです。 使用できる定数は、次に示す XlDirection クラスの定数のいずれかです。 xlDown、xlToLeft、xlToRight、xlUp

使用例

次の使用例は、ユーザーが Enter キーを押した後も、アクティブ セルが選択されたままの状態にします。 Spreadsheet1.MoveAfterReturn = False

出典

https://msdn.microsoft.com/ja-jp/library/cc409511.aspx

以上で完成です。

応用編

２）マクロ編では『ThisWorkbook』にマクロを記述しました。これによりブックの表示を切り替えるたびにセルの移動を初期値の「下」に戻しています。
他の活用方法として、シートのワークブックにコードを記述すれば、そのシートを表示している時だけセルの移動を切り替えることもできます。

アクティブセルのある行・列を目立たせる

大きな表を作成していると、画面の真ん中にアクティブセルがきたとき、あれ？ここ何行目だっけ？何列目だっけ？とセルの番地がわかりにくくなることがあります。
そんなときセルの位置がパッとひとめで分かるように行と列に色がついているとわかりやすいですよね！

Excelの[条件付き書式]とVBAを使うと、図のようにアクティブセルから上辺の列番号までと、左辺の行番号までカラー表示ができます。

１）条件付き書式の設定

[ホーム]－[条件付き書式]－[新しいルール]をクリックします。
対象となる目立たせたいセルを範囲指定してください。

下記の数式２つを条件付き書式に設定して、塗りつぶしの色を設定する。


十字にしたい場合の設定

=AND(CELL("row")>=ROW(), CELL("col")=COLUMN())

囲み型にしたい場合の設定

縦軸の数式

=AND(CELL("row")>=ROW(), CELL("col")=COLUMN())

横軸の数式

=AND(CELL("row")=ROW(), CELL("col")>=COLUMN())

２）リアルタイムに色の描画を行うため、VBAを追加する。

アクティブセルが移動したら必ず再描画するようにVBAで設定します。
再描画とは、例えばセルに値を入力してEnterキーを押すと計算式が更新されるように、Excelが画面の描画を更新することをいいます。しかし、矢印キーを押してもその都度、計算式を更新するようなことはしていません。
今回の機能では、矢印キーやマウスクリックでアクティブセルを移動したときにも再描画をする必要があるため、VBAで以下のように設定します。


書き込むワークブックは「ThisWorkbook」です。以下のソースを張り付けてください。

' アクティブセルの行と列をハイライト表示する。
Private Sub Workbook_SheetSelectionChange(ByVal Sh As Object, ByVal Target As Range)
     
     Application.ScreenUpdating = True

End Sub

以上で完成です。

マクロ？　VBAってなに？

マクロやVBAという言葉を検索してここに辿りついたあなたへ。
ようこそ！　Excel VBA 入門編へ。こちらはマクロを作ったことがない人に向けて、ゼロから開発環境を整え、マクロ完成までを目指すページです。最初は聞き覚えのない単語に戸惑うかもしれませんが、わからないところは読み流す！わかろうと努力する！スタイルで読み進めていただければ、後からすこしずつ理解が深まります。
ExcelのスキルUP！…ひいては周りからの羨望の眼差しを目指してがんばりましょう！

マクロ？　VBAとは？

まずは『マクロ』や『VBA』というのは何なのか？というところから、やさしく解説していきましょう。

　・マクロとはVBAを使って作成したプログラムのことです。
　・VBAとは何かと言えば、正式にはMicrosoft Visual Basic for Applicationsと言いOffice製品でマクロを開発するために使うプログラミング言語のことです。

ピンとこないかもしれませんので、例をだします。

私たちがご飯を作ろうとするとき、材料を調理する道具と、調理して出来上がる料理とがあります。

　

ここで料理とは目的であり、道具とは目的を達成するための手段になります。
同じように、マクロは料理であり、VBAはそれを作るための道具なのです。たとえば、セルのコピーを繰り返したい！という目的があったとき、その「コピー」マクロを実現するためにプログラミングする道具がVBA言語なのです。

開発環境を準備する

マクロを作るためのソフト「Microsoft Visual Basic for Applications」はExcelの中に入っている機能です。しかし普段はファイルメニューを見ても『開発』タブは非表示になっています。



[開発]タブを表示する手順

１．[ファイル] タブをクリックします。

２．[オプション] をクリックします。

３．[リボンのユーザー設定] をクリックします。

４．[リボンのユーザー設定] および [メイン タブ] の下の [開発] チェック ボックスをオンにします。







開発タブをクリックすると、左から順に[Visual Basic]、[マクロの記録]といったボタンがありますね。
これで開発準備は完了です。[開発]タブはExcelを開きなおしても表示されるので、次回からこの[マクロの記録]を使ってマクロを作ってみましょう。