2016年7月25日月曜日

東北TECH道場青森道場夏季4日目開催しました

東北TECH道場青森道場夏季4日目を、2016年7月24日(日)に、青森駅前の新町プラザ フリーカフェ新町(まちまちプラザ)で開催しました。





最初に、GitLabでのプロジェクトの共有方法を復習しました。



そして、道場入門者のみなさんにあらかじめ考えてきたもらったアプリを、それぞれ開発することになりました。
入門者のみなさんは、もくもくとアプリを開発していきます。





格子状に配置したビューを使ったアプリを作られた道場入門者の方が多かったですが、中にはオセロやマインスィーパーのような機能を持ったアプリに挑戦した入門者の方もいました。





東北TECH道場青森道場の夏季の日程は、これで一段落です。
道場入門者のみなさん、今回の道場で学んだことをよく復習して、是非、おもしろいアプリを作ってみてください!



2016年7月24日日曜日

東北TECH道場青森道場夏季3日目開催しました

東北TECH道場青森道場夏季3日目を、2016年7月23日(土)に、青森駅前の新町プラザ フリーカフェ新町(まちまちプラザ)で開催しました。



今回も高校生と大学生の道場入門者が十数名集まり、スタートを切りました。



今回は、オリジナルアプリを作るための練習です。
まず、これまで通り、Android Studioで、空のアクティビティを選んでプロジェクトを作り、実機を接続し、実機上で起動することを確認します。
次に、SourceTreeを使って、開発しているアプリのリポジトリを作成し、コミットします。
そして、GitLabにプロジェクトを作り、東北TECH道場青森道場のグループに共有します。
GitLabのプロジェクトを、SourceTreeでリモート・リポジトリに設定し、プッシュします。
この一連の流れが自然にできるようにマスターしましょう。


次に、講師の星孝哲さん((株)サマリー)から、Androidアプリのレイアウトについて解説がありました。
アプリを開発するには、レイアウトを使いこなすことが必要になりますので、よく理解しておきましょう。


そして、バーティカル(垂直)とホリゾンタル(水平)のリニア(線形)・レイアウトを組み合わせて、3x3の格子状のレイアウトを作成しました。
このときに、レイアウトのハイト(高さ)、ウィドゥス(幅)、ウェイト(比)などのプロパティ(属性)の値を適切に設定する必要があります。



それぞれの格子には、画像を表示させるため、3つずつイメージ・ビューをはめます。



Android Studioで、画像を使用するには、プロジェクトのappの中のresの中のdrawableの中に画像を入れます。このとき、画像の名前には制約があるので、注意しましょう。
そして、用意した画像をイメージ・ビューにはめていくと、アプリで3x3の格子に画像が表示されるようになります。



次に、この画像をクリックしたら、ランダムな画像を表示するようにします。
これまでボタンをクリックしたら反応するアプリを作ってきましたが、イメージ・ビューの場合も同様なプログラムでクリックしたときの反応を記述することができます。




3x3の格子状に配置された画像をクリックに反応させるのに、3x3=9回同じようなプログラムを繰り返し書くことは避けたいものです。
そこで、イメージ・ビューを表す変数を2次元配列で用意します。
そして、この配列をfor文などで繰り返し処理することで、同じプログラムを何回も書かなくても済みます。
また、画像のリソースについても、同様に2次元配列を用意します。
これらの配列は、プログラムの中のどのスコープ(範囲)で使用するかをよく考え、フィールドとして宣言するか、メソッドのローカル変数として宣言するかを決めましょう。

なお、無名クラスを用いてイベントリスナーを設定する場合、メソッドの引数はfinal修飾子が必要になります。



最後に、縦横斜めのいずれかが3つ揃ったら、メッセージを表示するプログラムを作るという課題に取り掛かりました。
そのために、まず、一番上の行が揃っているか否かを判定する方法を考えました。
このとき、直接、イメージ・ビューに設定されている画像を調べることは、あまり現実的ではありません。
そこで、盤面の状態を内部的にデータとして持つようにし、盤面のデータを使って揃っているか否かを判定したり、表示を行うようにプログラムを変更しました。



道場入門者のみなさんは、是非、一番上の行だけでなく、縦横斜めいずれかが3つ揃ったら、メッセージを表示するプログラムに取り組んでみてください。

さて、明日7月24日(日)は、いよいよ夏季4日目。
今回のような格子状のレイアウトを使って、どんなおもしろいアプリが作れるかを考えてきてください。
講師、道場主、スタッフ一応、楽しみにみなさんをお待ちしております。


2016年7月19日火曜日

東北TECH道場青森道場夏季2日目開催しました

東北TECH道場青森道場夏季2日目を、2016年7月18日(月・祝)に、青森駅前の新町プラザ フリーカフェ新町(まちまちプラザ)で開催しました。



今回も高校生と大学生の道場入門者が十数名集まり、スタートを切りました。


最初に前回の復習です。
まず、Android Studioで空のアクティビティを選んでプロジェクトを作ります。
次に、Android端末を接続して、端末上でアプリを実行させます。
そして、SourceTreeを起動して、リポジトリを作成し、作ったプログラムをコミットして記録します。
最後に、GitLabにプロジェクトを作り、そこにプログラムをプッシュしてアップロードします。

また、他人の作ったプログラムをGitLabからダウンロードしてみました。
まず、GitLabで共有されている他人のプロジェクトを見てみます。
そして、SourceTreeを使って、そのGitLab上のリポジトリのURLから、自分のコンピュータにプログラムをクローンして複製します。
クローンしたプログラムを、Android Studioで開いて、Android端末で実行してみました。

これら一連の操作には、GitLabのアカウントを覚えておき、アクセスできるようになっている必要があります。
道場入門者のみなさんは忘れないようにしましょう。
また、作った自分のプロジェクトは、プロジェクトの設定からGroupsを選び、東北TECH道場青森道場のグループに対して、最大のアクセスレベルをレポーターにして共有しておきましょう。

前回学んだことを復習し、いよいよ今回の内容に入りました。
今回のテーマはトランプを使ったカードゲームです。

まず、講師の星孝哲さん((株)サマリー)から、Android OSのユーザー・インターフェイスの名称、AndroidアプリのGUI部品を紹介がありました。



そして、道場入門者たちは、ボタンを押すと1〜13までのいずれかの数を表示するプログラムの開発に取り組むことになりました。

前回、ボタンを押すと画面の中の文字を書き換えるプログラムを作っています。
まずこのプログラムのことを思い出す必要がありました。
アプリの画面をデザインするXMLのプレビュー表示で、テキスト・ビューとボタンを配置します。
そして、ボタンのクリックに対するイベントリスナーを用意して、その中にテキスト・ビューを書き換えるプログラムを書きます。
そのとき、前回は固定された文字列でテキスト・ビューを書き換えましたが、今回は1から13までの乱数を作り、その値で書き換えます。
Javaで乱数の作り方を検索して調べて実装していきました。



次に、通常のトランプのように、1のときA、11のときJ、12のときQ、13のときKを表示するように書き換えました。
これは単純には、if〜else文やswitch文を用いて、カードの番号が1、11、12、13のときだけ特殊な表示を行わせることで実現できました。
これ以外にもいろいろな方法があるので、是非、自分なりに工夫してみてください。



それから、ボタンをクリックしたときに表示するカードの枚数を3枚にしました。
まず、アプリの画面をデザインするXMLのプレビュー表示で、テキスト・ビューを追加します。
このとき、追加したテキスト・ビューのidを確認しておきましょう。
そして、追加したテキスト・ビューそれぞれに、これまでと同様に乱数でカードの番号を生成して、その値で書き換えるプログラムを書きました。


しかし、そうすると、同じようなプログラムを何回も記述することになります。
プログラムを書くときに大切なことの一つは、同じことを何回も繰り返し記述しないことです。
そこで、乱数でカードの番号を生成して、その値でテキスト・ビューを書き換えるプログラムを抽出して、名前をつけて抽象化し、メソッドにします。
そして、その引数は、テキスト・ビューのidにします。
これにより、3つのテキスト・ビューを書き換えるために3回書いていたプログラムを、1回書くだけで済むようになりました。



次に、3枚のカードの合計値も表示するプログラムに取り組みました。
最初に、アプリの画面をデザインするXMLのプレビュー表示で、合計値を表示させるテキスト・ビューを追加します。
次に、これまでメソッドの中でカードの番号を乱数で生成していましたが、これを分離することにしました。
そのために、ボタンをクリックしたときに実行されるメソッドを新しく用意します。
そのメソッドの中で3枚のカードの番号を乱数で生成します。
そして、テキスト・ビューを書き換えるメソッドに、カードの番号とテキスト・ビューのidを引数として渡すようにしました。
また、カードの番号を合計し、それを表示させます。
最後に、カードの番号を複数個扱うのに、個別に変数を用意するよりも、配列を使用した方が便利なので、配列を使用するように書き換えました。

最後に本日の開発内容を保存し、SoureTreeでコミットし、リモートリポジトリにプッシュしました。



道場入門者のみなさん、次回に向けて、今回の内容を是非復習してみてください。
また、GitLabにテキストがありますが、上級の課題がありますので、取り組んでみてください。

講師、道場主、スタッフ一応、次回も楽しみにみなさんをお待ちしております。

2016年7月11日月曜日

東北TECH道場青森道場夏季1日目開催しました

東北TECH道場青森道場夏季1日目を、2016年7月10日(日)に、青森駅前の新町プラザ フリーカフェ新町(まちまちプラザ)で開催しました。



道場には、講師の星孝哲さん((株)サマリー)、道場主の紅林亘(青森大学)、小田桐正巳(青森商業高校)、榊雄介(青森工業高校)、道場入門者の高校生と大学生15人、青森県庁や青森大学からのサポートスタッフがたくさん集まり、熱気に包まれたスタートを切りました。また、八戸道場の道場主の岡本信也さんも駆けつけてくださいました。

最初に講師の星さんから、東北TECH道場の歴史、プログラミングの上達に関する秘訣のご紹介がありました。







続いて、Android Studioがインストールされた状態のノートパソコンとAndroid端末の実機を用意し、チュートリアルがスタートしました。
まず、Android Studioで、新しいプロジェクトを空のアクティビティで作ります。
次に、Android端末の[設定]から、[端末情報]を表示し、[ビルド番号]を連続でタップし、[開発者向けオプション]を表示させ、USBデバッグを有効にできるようにします。そして、Android端末をノートパソコンに接続し、デバイスドライバを適切にインストールします。
そして、Android Studioから、接続したAndroid端末上でプログラムを実行させました。



次に、開発したプログラムのバージョンを管理したり、互いに共有するために、分散バージョン管理システムのGitの利用環境を整えました。
具体的には、講師の星さんからバージョン管理システムを使う意味、Gitの概念の紹介がありました。そして、AtlassianのSourceTreeをインストールし、ユーザー登録してGitをGUIで使えるようにしました。そして、開発したコードのフォルダにローカルなリポジトリを作り、コミットして履歴を保存しました。



次に、オンラインにリポジトリを作ることができるGitLabのサービスに登録しました。そして、プライベートなリポジトリを作成し、そこに開発したコードをプッシュして転送します。また、東北TECH道場青森道場のグループに加盟し、開発したコードをそこで互いに参照できるようにしました。
これで、開発環境が整い、実際の開発に進めるようになりました。



最後にアプリにボタンを追加し、クリックに反応するコードを書きました。
具体的には、Android Studioのアプリの画面をデザインするXMLのプレビュー表示に、パレットからボタンを追加します。そのボタンがクリックに反応するように、対応するアクティビティのJavaのプログラムのファイルの中にイベントリスナーを記述しました。
最初にボタンをクリックするとトーストを表示させました。





次に画面の中のテキストを書き換えました。最後にボタンの数を増やして対応する動作をそれぞれ用意しました。
そして、本日の開発内容を保存し、リモートリポジトリにプッシュしました。



道場入門者のみなさん、次回に向けて、今回の内容を是非復習してみてください。
講師、道場主、スタッフ一応、次回も楽しみにみなさんをお待ちしております。