Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
コデアルAndroidアプリ勉強会
- Programming 24 -
2014年5月11日
2014年5月25日
2014年6月8日
到達目標
● 人に見せられるAndroidアプリが作成できる
(名刺代わりのアプリ)
(生活を便利するアプリ)
● 現在地をメールするアプリ
Androidアプリの開発に必要な知識を
身につける
1.Androidとは
2.開発環境を準備する
3.Javaの基礎
4.Androidアプリの作成
5.基本的なUI作成
現在地をメールするアプリ
● GPS情報の取得
● プリファレンス(情報の記憶、保持)
● メール送信(インテント)
1.Androidとは
● googleが開発したスマートフォン用のOS
● ライセンスフリーのOS(Linuxカーネル)
● 2014年現在、スマートフォン用のOSとしては、
シェア1位
● 2003年に、Android社設立
● 2005年...
● 開発ツール、技術ドキュメント、ソースコードを誰で
も無償で入手することができる
● スマートフォン以外の組み込み分野へ展開されて
いる
例えば、ネットブック、カーナビ、TVレコーダ、デジ
タル家電など
Androidで何ができるのか?
● 次のような機能を利用したアプリを作成できる
- 音声通話(電話)
- フルブラウザによるWebサイト閲覧
- 2D/3Dグラフィックスの描画
- 音声、映像、静止画の表示・再生
- カメラ(静止画、動画)
...
- SQLiteによるデータストレージ
- 各種センサー
 加速度センサー、傾きセンサー、磁気センサー
 温度センサー、明るさセンサー、接近センサー
 ジャイロスコープ、圧力センサーなど
 
Androidのバージョン
1 Android 1.0 Astro
2 Android 1.1 Bender
3 Android 1.5 Cupcake ←ここから、google
4 Android 1.6 Donut   コードネームがスイー...
API Level
● バージョンに対応したAPI Levelが決められてい
る。
● API Levelにより、使える機能が変わる。
● 開発時には、どのAPI Levelを対応するか、決める
必要がある。
● また、開発情報を調べる際にも、...
2.開発環境を準備する
● 開発に必要なもの
1)統合環境
Eclipseまたは、Android Studio
2)AndroidSDK
3)プログラミング言語
 Java
1)と2)は、統合環境に含まれている
  
開発ツールダウンロード1
● ここでは、Eclipseを使います。実はAndroid
Studioの方が評判が良いのですが、今のとこ
ろ、Eclipseの方がメジャーのため。
● SDKダウンロード
http://developer.andro...
開発ツールダウンロード2
● Java SE 7 Development Kit (JDK)ダンロード
http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads...
開発環境インストール1
● JDKのインストール
デフォルト設定のままインストール
注意)統合環境が64Bit版の場合は、64Bit版の
JREが必要になります。
● Android SDKのインストール
AndroidSDKのzipを適当なフ...
開発環境インストール2
● Eclipseの日本語化
● Pleiadesプラグインを導入
● ダウンロードしたpleiades.zipを解凍
● 解凍したファイルを全てEclipseのフォルダーの下
に移動
開発環境インストール3
● eclipseフォルダーの中にあるeclipse.iniファイルを
編集。eclipse.iniの末尾に
-javaagent:plugins/jp.sourceforge.mergedoc.pleiades/ple...
開発環境の確認
● Androidアプリの開発環境の確認をします。
● プロジェクトの作成
今までは、ファイルメニューの新規で、Javaプロ
ジェクトを選択していましたが、今回から、Android
アプリケーション・プロジェクトを選択します
●...
新規Androidアプリケーション
● アプリケーション名
アイコンに表示する名前
●
プロジェクト名
このプロジェクトにつける名前
(アプリケーション名と同じで構わない)
● パッケージ名
アプリの名前の衝突をさけるための名称
Javaの慣習...
次に
● その他は、初期値のまま。
●
ここまでの作業で、空のアプリができています。
動作確認
● 実機につないで動作確認でも良いのですが、
まずは、エミュレータで実行します。
● そのために、Android仮想デバイスを作成します。
Android仮想デバイスの作成
● ウィンドウメニューから、Android仮想デバイスマネ
ジャーを選択
● 新規ボタンをクリック
● AVD名は、任意
● デバイスの選択は、ターゲットの画面サイズにより
選択
● Skinは、「Skin w...
Android仮想デバイス
● 作成が完了したら、エミュレータを動かしてみる
● かなり遅いです。PCが遅いと数分かかる。
● 起動すると、Androidの画面が表示される
● 画面の機能確認であれば、十分に使えます。
● 特に、Android...
アプリの動作確認
● 実行画面より、実行を選択すると
エミュレータ上に、先ほど作成したアプリの画面が
表示されます。
実機での動作確認
● 実機を持っている人は、実機で動作させる方が、動
作確認が早い。
● 実機以外に必要なもの
USBケーブル(通信用)
*間違えて、充電を使っても動作しません。
● 対象の実機用のADB用USBドライバをインストー
ルする必要...
実機の接続確認
● 実機のUSBデバッグを有効にする必要があります
実機のバージョン、機種によって、設定箇所が異な
ります。
● Eclipseで、DDMSを選ぶとデバイスが繋がってい
る場合は、デバイス一覧に名称が表示されます。
● DDMS...
USB デバッグを有効にする
● [設定|開発者向けオプション]で[USB デバッグ]
オプションをオンにします。
● Android 4.2 以降では、[開発者向けオプション]が
デフォルトで非表示になっています。
● [設定|<デバイス種別...
Javaの基礎
● Javaを使って、Androidアプリを作成するため。
● Javaの基礎を学ぶ。
● よく使いそうな部分だけ、抜粋して説明。
Javaの基礎
● Androidアプリ用に、準備した開発環境で、Javaの
基礎を学ぶために、コンソールアプリで試す。
● コンソールアプリは、ちょっとしたコードを試すの
に、便利です。
● Androidアプリを開発するときも、小さい機能を...
Javaの基礎
● Androidアプリ用に、準備した開発環境で、Javaの基礎を
学ぶために、コンソールアプリで試す。
● コンソールアプリは、ちょっとしたコードを試すのに、便利で
す。
● Androidアプリを開発するときも、小さい機能を...
Eclispeでコンソールアプリ
● Eclipseを起動します
● ファイルメニューの新規で、Javaプロジェクトを選択
します。(Androidアプリの場合とは異なります)
● Javaプロジェクトの作成画面が開きます
● プロジェクト名を...
Eclispeでコンソールアプリ
● 名前(クラス名)を入力します(任意の名前)
説明をわかりやすくするため、「Sample」としておき
ましょう。
● public static void main()の欄にチェックを入れる
● Sample...
最初のプログラム
● main()の下にある、todoの次の行に、プログラムを
書いていきます。
● 「syso」と入力して、CTRL+スペースを押してくださ
い。(コード補完のショートカット)
● System.out.println()とい...
最初のプログラム
● 問題がなければ、文字が出力された思います。
● 問題があった場合は、エラーとなっています。
●
エラー原因を取り除いて、再度、実行しましょう。
● 下部の問題というタブを除くとエラー要因が書かれ
ています。
● エラーの修...
エラーの修正のコツは(重要!)
● 1行目のエラーに注目すること。
2行目以降のエラーは、1行目が原因で出ているこ
とがあるので、1行目を無視してはいけない。
● 小さく作って、小さく試す。
たくさんのコードを一度にコンパイルすると、エラー
が...
変数とは
● 値を入れる箱のようなもの
● 型がある。箱のサイズ、種類が決まる
● とりあえず、int型とboolean型を覚えよう。
● プリミティブ型(基本的な型)
● intは、整数を扱う型。
(-2147483648~214748364...
変数の使い方1
● 宣言方法
型名 変数名;
● 変数名は、AからZ、aからz、0から9、アンダーバー
(_)が使える。但し、先頭に数字は使えない。
任意の名前をつけることができる。
わかりやすい名前をつけた方が後で読みやすい。
● 例
int...
変数の使い方2
● 変数に値を代入する
● 例
int temp;
temp = 10;
boolean flag;
flag = false;
変数の使い方3
● 変数の値を表示してみる
● 最初に使ったSystem.out.println()を使って。
int temp = 100;
System.out.println(temp);
● 上記を先ほど書いたプログラムのmain()の...
演算子
● コンピュータなので、当然計算ができます。
● 計算の時に使うのが演算子です。
四則演算+剰余の演算。
● + 足し算
● - 引き算
● * 掛け算
● / 割り算
● % 剰余
演算子を使う
● 以下の演算で、temp3の値がどうなるか試すこと。
● int temp1 = 100;
int temp2 = 30;
int temp3 = 0;
temp3 = temp1+temp2;
temp3 = temp1-te...
制御構文(if文)
● 分岐をするための構文
int money = 100;
if(money >= 120){
System.out.println(“缶ジュース”);
} else {
  System.out.println(“購入不可...
制御構文(for文)
● 繰り返しを行うための構文
for(int i=1;i<=10;i++) {
System.out.println(“繰り返し:” + i);
}
● Money >= 120、i<=10は、条件式
● >=、i<=は、...
演習
● 二つの変数(int)を準備し、大きい方の数を
if文で判定し、表示しなさい。
(数値の値を変えても動作が正しいこと)
● 1から100までの奇数を表示
(forとifの組み合わせ)
奇数の判定は、剰余を使うと簡単。
関数
● 入力を与えて、出力を得る
● 入力のことを引数という
●
出力を戻り値という
● function(x,y)=x+yは、
int plus(int x,int y){
return x+y;
}
関数
● 前のページのままでは、コンパイルが通りません。
public static int plus(int x,int y){
return x + y;
}
● この関数の呼び出しは
int a = 10;
int b = 90;
int...
関数
● 関数の定義
型名 関数名(型名 仮引数名) {
// 処理
}
● 関数の呼び出し
関数名(実引数名);
● 戻り値がない場合は、型名をvoidとする。その場合
は、returnが不要となる。
演習
● 割引計算関数 discount();を作成
● 引数に元の値段を与えて、値引き後の値段を得る
(割引率は30%)(*整数演算だけで行う)
元の値段が100なら、値引き後は、70が得られ
る。
Int result = discount...
オブジェクト指向
● クラス
変数定義(フィールド)とメソッド定義からなる設計
書。(レシピのようなもの)
● メソッド
関数定義と同様。
● インスタンス生成
クラス(設計書)を元に、実体を作ること。
(レシピを見て、実際の料理を作るイメージ)
オブジェクト指向
● クラス
変数定義(フィールド)とメソッド定義からなる設計
書。(レシピのようなもの)
● メソッド
関数定義と同様。
● インスタンス生成
クラス(設計書)を元に、実体を作ること。
(レシピを見て、実際の料理を作るイメージ)
クラスの書き方(例:Dogクラス)
class Dog
{
private String Name; // Stringは、文字列型
public void setName(String n){
Name = h;
}
public void ...
クラスの使い方
● インスンタンスの生成
● 先ほどのDogクラスを使ってみる
// インスンタンスの生成
Dog myDog = new Dog();
myDog.setName(“たろう”);
myDog.showProfile();
演習
● 例題のDogクラスに、次の内容を追加してください
年齢を保持するint型のフィールドを定義。
● 年齢を設定するメソッド、SetAge。
● ShowProfileメソッドで名前、年齢を表示するようにする。
● 修正したDogクラスを...
配列とコレクションクラス
● 配列は、あまり使わずにコレクションクラスを使うこ
とが多いので、あえてコレクションクラスを一緒に説
明します。
● 配列とは、複数の変数を同じ名前でまとめて扱え
るようにしたもの。
● 例えば、Seito01,Se...
配列の使いづらい点
● int Seito[] = new int[4];のようにした場合
● Seito[4] = 100; とすると配列の範囲をこえるので、
エラーとなる。(プログラムが落ちる)
● 最初の要素数を超えた場合、後で、要素数を...
コレクション(ArrayList)クラス
● 書き方
ArrayList<型> 変数名 = new ArrayList<型>();
● 先ほどの配列をArrayListにしてみる
ArrayList<Integer> Seito
      =...
コレクション(ArrayList)クラス
● データの取得
int temp = Seito.get(0);
● 要素数の取得
int count = Seito.size();
● 要素の検索
int index = Seito.size(1...
● コード例
ArrayList<Integer> Seito = new ArrayList<Integer>();
Seito.add(300);
Seito.add(250);
Seito.add(400);
Seito.add(100)...
Stringクラス
● 文字列を扱うクラス
String temp = “ab,cde,fg”;
● 長さを取得
int len = temp.length();
● 文字列の検索
int posi = temp.indexOf(“cde”);...
●
コード例
String aaa = "ab,cde,fg";
System.out.println(aaa.length());
System.out.println(aaa.indexOf("cde"));
String abc[] = ...
ここまでの復習
● 課題のコードは、以下のURLのExercise01です。
https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
Androidアプリの開発
● ここから、Androidアプリの開発に入ります。
● まず、動作確認のために作成したAndroidアプリで
生成されたファイル、フォルダを見ていきます。
生成されたファイルについて
● 生成されたファイル、フォルダの中で、よく使うもの
に限って、説明します。
● srcフォルダ
Androidアプリを作成するJavaのコードがある場所
● resフォルダ
レイアウトファイル、アイコンなどのリソー...
とりあえず、動かしたい
● 主要コンポートの説明の前に、動かしている実感
が湧くアプリを書いてみましょう。
● モチベーションを維持するために、とりあえず動し
てみます。
● プロジェクトの作成
Androidアプリケーション・プロジェクトを選...
新規Androidアプリケーション
アプリケーション名、プロジェクト名、パッケージ名
は、好きな名称をつけてください。
● 最小必須SDKを、API 14 
Android4.0(IceCreamSandwich)に設定。
● テーマをNone...
余分なコードを消す
● onCreateOptionsMenu()を削除
● onOptionsItemSelected()を削除
● class PlaceholderFragment()を削除
● if (savedInstanceStat...
Viewクラスの作成
● クラスの作成機能を使って、Viewクラスを作成しま
す。
● クラス名は、「SampleView」としておいてください。
名前に意味はありません。説明をしやすくするため
です。
● スーパークラスをandroid.vi...
SampleViewクラス
● SampleViewメソッドを追記してください。
public SampleView(Context context){
super(context);
setBackgroundColor(Color.WHIT...
SampleViewクラス
● onDraw()メソッドをオーバーライドしてください。
@Override
public void onDraw(Canvas canvas){
canvas.drawText("Hello", 100, 100...
ビルドと実行
● それでは、再度ビルド、実行してください。
● 「Hello」と表示されたはずです。
● これでは、コンソールと変わらないので、次は、
● テキスト表示の部分を図形に変えて見ます。
● canvas.drawText()を削除。...
描画を拡張
● 円の色を変えてみます。
● canvas.drawCircle()の前に、
paint.setColor(Color.RED);を記述
● 実行して、赤い円が描かれることを確認してくださ
い。
*座標の原点は、左上です。
タッチイベントの取得
● onTouchEvent()をオーバーライドしてください
@Override
public boolean onTouchEvent(MotionEvent
event)
{
}
● ビルドが通ることを確認
タッチイベント動作確認
● タッチイベントの動作確認をします。
onTouchEvent()内に、
Toast.makeText(getContext(), "Touchされまし
た", Toast.LENGTH_SHORT).show();
...
円がタッチされたら、色を変える
● タッチイベントの判定
public boolean onTouchEvent(MotionEvent
event){
int action = event.getAction();
if((action & ...
座標を取得
// タッチされた座標
int ex = (int)event.getX();
int ey = (int)event.getY();
円と点の衝突判定
円(bx,by,R)点(ex,ey)
R:円の半径
● if((bx - ex)*(bx - ex)+(by - ey)*(by - ey) <= R*R){
// 衝突
}
円の色を変える
● colorというフィールドを定義
● color = Color.RED; // Color.BLUE
● 円を描く際に
paint.setColor(color);
● で色指定すること
● colorをセットしたら、
i...
タイマーで、円を移動
● MainActivityのフィールドに
private Handler handler = new Handler();
を記述。
● onCreate()でタイマー作成
タイマー作成
Timer timer = new Timer(false);
timer.schedule(new TimerTask(){
public void run(){
handler.post(new Runnable(){
pub...
onDraw()で座標更新
● 左端、右端、上端、下端に来たときの処理を記述。
● 例)左端の処理 bx:円の中心 dx:移動量
(正で右へ、負で左へ移動)
if (bx < 0 ) {
dx = 2;
}
bx = bx + dx; // 座...
線と矩形描画
● 線の描画
● canvas.drawLine(x1,y1,x2,y2,paint);
● x1,y1 始点座標 x2,y2 終点座標
● 矩形描画
● canvas.drawRect(x1,y1,x2,y2,paint);
●...
画像描画
● フィールドにビットマップ保存用の変数を定義
● private Bitmap item;
● viewのコンストラクタで、ビットマップを読み込む
● Resources res = context.getResources();
...
復習
● ここで、Javaの復習
● 継承、コンストラクタ、オーバーロード、
オーバーライド、superなどの要素が出てきたの
で、コンソールアプリを使って、ひと通り説明しま
す。
応用
● ここまでの要素を組み合わせれば、ブロック崩し、
インベーダー、テトリス、オセロなどが作成可能で
す。
● 何でも良いので、作ってみましょう。
● 次は、Androidの主要コンポーネントについて
● アプリの作成方法は、レイアウトファ...
主要コンポーネント
● アプリの主要な機能を実現するためのコンポーネ
ント
● Activity ・・・ ユーザーインターフェース
● Intent  ・・・ コンポーネント間通信
● Content Provider ・・・ データアクセス
...
Activity(アクティビティ)
●
画面の元になるコンポーネント
● アクティビティの上にボタン、チェックボックスなどの部品を
を配置して画面を作成する
● 基本的に1画面は、1つのアクティビティで構成される。
●
アクティビティは、実行中...
View(ボタン)を配置
● アクティビティにViewを配置する
まず、ボタンを配置してみる
● GUIデザイナで、ボタンを配置
● XMLファイルに書かれる
● コードでは、XMLファイルを指定することで、View
を指定することができる。
ボタンを使うコード
● コード上でボタンを呼び出す処理
findViewById()
● 取得したオブジェクトに設定を行う
● イベントを設定
トーストを表示するコード
*トースト、画面上に短い間メッセージを表示する
仕組み。警告メッセージなど...
ログ出力
● コードが複雑になってくると、プログラムが思い通り
動いているか、検証したくなります。
● 毎回、デバッガで動かすのも面倒なので、よく使う
テクニックとして、気になる箇所にログを仕込みま
す。
● Log.d("TAG", "mes...
テキストViewを配置
● GUIデザイナで、テキストViewを配置
● ボタンが押されたイベントに、テキストViewに文字
を出力するコードを記述
エディットテキストを配置
● GUIデザイナでエディットテキストを配置
● ボタンクリックのイベントでエディットテキストから
文字列を読んで、テキストViewに出力するコードを
書いてみる
Activityのライフサイクル
ライフサイクルに関連するメソッド
メソッド名 呼ばれるタイミング
● onCreate() Activityが初めて作られたとき
● onStart() Activityが開始されたとき
● onResume() Activityが表示されたと...
ライフサイクルの確認
● ライフサイクルに関連するメソッドに、ログを仕込ん
だアプリを使って、どのような順番で呼ばれのか、
調べてみましょう。
● Androidで吐き出すログは、logcatというツールで
見ることができます。開発環境に含まれ...
Intent(インテント)
● コンポーネント間通信の仕組み
● ここでいうコンポーネントとは、アクティビィティ、
サービス、ブロードキャストレシーバ。
● 具体例
アクティビィティ1からアクティビィティ2を起動(画面
遷移)
外部アプリのメー...
Intent(インテント)
● コンポーネント間通信の仕組み
● ここでいうコンポーネントとは、アクティビィティ、
サービス、ブロードキャストレシーバ。
● 具体例
アクティビィティ1からアクティビィティ2を起動(画面
遷移)
外部アプリのメー...
Intentを試す
● ブラウザ起動
Intent intent = null;
intent = new Intent(Intent.ACTION_VIEW,
Uri.parse("http://google.com/"));
startAc...
Intentを試す
● メール送信
Uri uri=Uri.parse("mailto:test@test.com");
Intent intent=new Intent(Intent.ACTION_SENDTO,uri);
intent.pu...
画面遷移
● アクティビティを追加して、画面遷移を実現
1)クラスの追加(Activityを継承)
2)マニュフェストに新たなアクティビティを追記
  <activity android:name=".SubActivity"
   andro...
位置情報の取得
● マニフェストにパーミンション記述が必要
<uses-permission
android:name="android.permission.ACCESS_FINE_LOCATION" />
● wifiで位置情報を取得するに...
LocationManager
private LocationManager locationManager = null;
locationManager =
(LocationManager)getSystemService(LOCATI...
LocationListener
● LocationListenerを生成
private LocationListener mLocationListener = new LocationListener(){
● LocationList...
緯度経度の取得
● onLocationChangedで緯度経度を取得
String latitude =
Double.toString(location.getLatitude());
String longitude =
Double.t...
緯度経度をブラウザへ
● Yhoo地図を利用(「Yahoo!地図 パラメータ」で検索)
String urlStrng = "http://map.yahoo.co.jp/maps?
type=scroll&pointer=on&sc=2&la...
緯度経度をメールへ
Uri uri=Uri.parse("mailto:test@test.com");
Intent intent=new Intent(Intent.ACTION_SENDTO,uri);
intent.putExtra(I...
装飾(背景を画像に)
● resのdrawableフォルダに、画像を追加
● "background.png"
● RelativeLayoutの属性に以下を追加
● android:background="@drawable/backgrou...
ボタンに画像をつける
● 画像はアイコンを利用
● Buttonの属性に以下を追加
● android:drawableLeft="@drawable/ic_launcher"
位置情報を使う
● 位置情報をつかって、最寄り駅の検索をしてみる
● Web上には、いろんな情報を取得できるサービス
があります。
● Webにアクセスして情報を取得すると更におもしろ
いことができるようになります。
●
今回は、緯度経度から最...
位置情報を使う
● 位置情報をつかって、最寄り駅の検索をしてみる
● Web上には、いろんな情報を取得できるサービス
があります。
● Webにアクセスして情報を取得すると更におもしろ
いことができるようになります。
●
今回は、緯度経度から最...
Webにアクセスするには
● HttpClient/HttpGet/HttpResponseなどのクラスを
使ってアクセスします。
● 問題なのは、Androidの規約で、Webアクセスする
コードは、バックグランドで動かす必要があります。
●...
AsyncTaskの使い方
● Activityを継承したクラスの内部で、AsyncTaskクラ
スを継承したクラスを宣言します。
protected class Task extends AsyncTask<String,String,Str...
AsyncTaskの使い方
● Activityを継承したクラスの内部で、AsyncTaskクラ
スを継承したクラスを宣言します。
protected class Task extends AsyncTask<String,String,Str...
Webアクセスのコード
●
手順は、下記のようなコードでアクセス可能です
● 実際には、エラー処理などが入るのでもう少し複雑です。
● 実際のコードは、Eclipse上で説明します。
HttpClient client = new Defaul...
JSONを使う
● Webサービスは、JSONというデータ形式でデータ
を返してくることが多いです。今回、使う最寄り駅検
索のサービスもJSONです。
● でも、JSONを扱うクラスがちゃんと用意されている
ので、簡単に使えます。JSONObj...
最寄り駅検索完成
● 最寄り駅情報をJSONから取得できたら、後は、それをUI
上のTextViewに書いてやれば、完成です。
● JSONを取得する部分は、先ほど出てきたonPostExecute
の中に記述します。
理由は、データを抜き出し...
更にブラッシュアップ
● 見た目も、機能もそれなりに整ってきたのですが、
更に本格的なアプリに近づけます。
● 何が問題かというと、メールアドレスが直接書かれ
ているので、送り先が書きかえできないのが欠点
です。
● これを解消するために、アプ...
SharedPreferences
● SharedPreferencesをフィールドに宣言。(sharedPref)
● onCreateで、インスタンスを取得
sharedPref = 
PreferenceManager.getDefau...
PreferenceActivity
● これを継承したクラス(Activity)を使うと、設定画面
が簡単に作成できます。
● 必要なメソッドは、onCreateのみ作成
● レイアウト用のXMLが必要
● 新たなActivityを追加するの...
アプリ作成のまとめ
● 位置情報取得(Sample16)
● 最寄り駅取得(Sample17)
● プリファレンス(Sample18)
これらの機能から必要なものを組み合わせて、最
終形に仕上げる。
Github
● ソーシャルコーディング
● コードを公開するための仕組み
●
有料なら、公開しないプライベートでの使用も可
能。
● Gitは、Githubを使うためのソフトウェアであり、ソー
スコードのバージョン管理のために作られたもので
...
Githubで開発されているOSS
● Ruby On Rails
● node.js
● jQuery
● Symfony2
● Bootstrap
*有名なOSSが多く利用している
Gihubの利用方法
● まず、GitがPCにインストールされていること
● 次に、Githubにアカウント作成する必要があります
http://github.com にアクセス
[Sign up for Github]をクリック
● Step...
Githubの登録
● Step2
フリープランが選択されていることを確認して、
[Finish sign up] をクリックします。
● Step3
ダッシュボード画面が表示されていれば、完了
SSH Keyの設定
● ssh-keygenというコマンドでSSH Keyを作成する
生成されたid_rsa.pubの中身を利用。
● Githubの設定ボタン(Account Setting)(右上)をク
リック
● 画面が表示されたら、メ...
確認・ポイント
● SSH Keyの登録が成功すると、登録したメールアドレス
に、登録成功のメールが届きます
● Windowsの場合は、Gitと一緒にインストールされたSSH-
Keygenを使うと良いです。
***これで、準備が整いました*...
リポジトリの作成
● 右上の+記号の横をクリックするとメニューが
● 表示されるので、その中から、
● [New Repository]を選択
● Repository Nameを入力したら
● Initialize this reposito...
リポジトリにアクセス
● https://github.com/ユーザー名/リポジトリ名
で作成したリポジトリにアクセスできます。
● 作成したリポジトリをcloneする
git clone https://github.com/ユーザー名/リ...
ファイルを追加
● cloneされたディレクトリに移動
● 追加するファイルを置く(作成)(例:test.txt)
● git add test.txt
● git commit -m "File Add"
*まだ、リモートには、登録されていな...
Programming24 第3回Androidアプリ勉強会
Upcoming SlideShare
Loading in …5
×

Programming24 第3回Androidアプリ勉強会

2,346 views

Published on

コデアル株式会社主催、プログラミング初心者向けのAndroid勉強会を実施しました。入門者を対象にAndroidアプリの作成を行っていきます。Javaの勉強を始めたい方、スマホアプリの勉強会を始めたい方、これからプログラミングを学ぼうと考えている方にピッタリの内容です。積極的に学習していきましょう。

Published in: Engineering
  • Be the first to comment

  • Be the first to like this

Programming24 第3回Androidアプリ勉強会

  1. 1. コデアルAndroidアプリ勉強会 - Programming 24 - 2014年5月11日 2014年5月25日 2014年6月8日
  2. 2. 到達目標 ● 人に見せられるAndroidアプリが作成できる (名刺代わりのアプリ) (生活を便利するアプリ) ● 現在地をメールするアプリ
  3. 3. Androidアプリの開発に必要な知識を 身につける 1.Androidとは 2.開発環境を準備する 3.Javaの基礎 4.Androidアプリの作成 5.基本的なUI作成
  4. 4. 現在地をメールするアプリ ● GPS情報の取得 ● プリファレンス(情報の記憶、保持) ● メール送信(インテント)
  5. 5. 1.Androidとは ● googleが開発したスマートフォン用のOS ● ライセンスフリーのOS(Linuxカーネル) ● 2014年現在、スマートフォン用のOSとしては、 シェア1位 ● 2003年に、Android社設立 ● 2005年にgoogleが買収 ● 2009年に、開発ツールAndroidSDKr1.5リリース (この時点から、市場に登場)
  6. 6. ● 開発ツール、技術ドキュメント、ソースコードを誰で も無償で入手することができる ● スマートフォン以外の組み込み分野へ展開されて いる 例えば、ネットブック、カーナビ、TVレコーダ、デジ タル家電など
  7. 7. Androidで何ができるのか? ● 次のような機能を利用したアプリを作成できる - 音声通話(電話) - フルブラウザによるWebサイト閲覧 - 2D/3Dグラフィックスの描画 - 音声、映像、静止画の表示・再生 - カメラ(静止画、動画) - Bluetooth、WiFiによるデータ通信 - GPS - NFC
  8. 8. - SQLiteによるデータストレージ - 各種センサー  加速度センサー、傾きセンサー、磁気センサー  温度センサー、明るさセンサー、接近センサー  ジャイロスコープ、圧力センサーなど  
  9. 9. Androidのバージョン 1 Android 1.0 Astro 2 Android 1.1 Bender 3 Android 1.5 Cupcake ←ここから、google 4 Android 1.6 Donut   コードネームがスイーツ名 5 Android 2.0/2.1 Eclair 6 Android 2.2 Froyo 7 Android 2.3 Gingerbread 8 Android 3.x Honeycomb 9 Android 4.0 Ice Cream Sandwich 10 Android 4.1/4.2/4.3 Jelly Bean 11 Android 4.4 KitKat
  10. 10. API Level ● バージョンに対応したAPI Levelが決められてい る。 ● API Levelにより、使える機能が変わる。 ● 開発時には、どのAPI Levelを対応するか、決める 必要がある。 ● また、開発情報を調べる際にも、どのAPI Levelに 対応した情報かを意識しなければならない。
  11. 11. 2.開発環境を準備する ● 開発に必要なもの 1)統合環境 Eclipseまたは、Android Studio 2)AndroidSDK 3)プログラミング言語  Java 1)と2)は、統合環境に含まれている   
  12. 12. 開発ツールダウンロード1 ● ここでは、Eclipseを使います。実はAndroid Studioの方が評判が良いのですが、今のとこ ろ、Eclipseの方がメジャーのため。 ● SDKダウンロード http://developer.android.com/sdk/index.html MACの場合は、 [DOWNLOAD FOR OTHER PLATFORMS]をクリック
  13. 13. 開発ツールダウンロード2 ● Java SE 7 Development Kit (JDK)ダンロード http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html ● Pleiadesプラグインダウンロード Eclipseを日本語化するためのプラグイン http://mergedoc.sourceforge.jp/
  14. 14. 開発環境インストール1 ● JDKのインストール デフォルト設定のままインストール 注意)統合環境が64Bit版の場合は、64Bit版の JREが必要になります。 ● Android SDKのインストール AndroidSDKのzipを適当なフォルダーで解凍。 フォルダーをADTとリネームしてCドライブのルート 直下に移動。
  15. 15. 開発環境インストール2 ● Eclipseの日本語化 ● Pleiadesプラグインを導入 ● ダウンロードしたpleiades.zipを解凍 ● 解凍したファイルを全てEclipseのフォルダーの下 に移動
  16. 16. 開発環境インストール3 ● eclipseフォルダーの中にあるeclipse.iniファイルを 編集。eclipse.iniの末尾に -javaagent:plugins/jp.sourceforge.mergedoc.pleiades/pleiades.jar=default.splash という記述を付加。 ● Eclipse.exeを実行  ↑これで、準備完了!
  17. 17. 開発環境の確認 ● Androidアプリの開発環境の確認をします。 ● プロジェクトの作成 今までは、ファイルメニューの新規で、Javaプロ ジェクトを選択していましたが、今回から、Android アプリケーション・プロジェクトを選択します ● 新規Androidアプリケーションダイアログが表示さ れます。
  18. 18. 新規Androidアプリケーション ● アプリケーション名 アイコンに表示する名前 ● プロジェクト名 このプロジェクトにつける名前 (アプリケーション名と同じで構わない) ● パッケージ名 アプリの名前の衝突をさけるための名称 Javaの慣習として、ドメイン名を利用することが多 い。
  19. 19. 次に ● その他は、初期値のまま。 ● ここまでの作業で、空のアプリができています。
  20. 20. 動作確認 ● 実機につないで動作確認でも良いのですが、 まずは、エミュレータで実行します。 ● そのために、Android仮想デバイスを作成します。
  21. 21. Android仮想デバイスの作成 ● ウィンドウメニューから、Android仮想デバイスマネ ジャーを選択 ● 新規ボタンをクリック ● AVD名は、任意 ● デバイスの選択は、ターゲットの画面サイズにより 選択 ● Skinは、「Skin with dynamic hardware controls」 を選択
  22. 22. Android仮想デバイス ● 作成が完了したら、エミュレータを動かしてみる ● かなり遅いです。PCが遅いと数分かかる。 ● 起動すると、Androidの画面が表示される ● 画面の機能確認であれば、十分に使えます。 ● 特に、Androidは、画面サイズがたくさんあるので、 すべての装置を準備できない場合は、エミュレータ だけで確認することがあります。
  23. 23. アプリの動作確認 ● 実行画面より、実行を選択すると エミュレータ上に、先ほど作成したアプリの画面が 表示されます。
  24. 24. 実機での動作確認 ● 実機を持っている人は、実機で動作させる方が、動 作確認が早い。 ● 実機以外に必要なもの USBケーブル(通信用) *間違えて、充電を使っても動作しません。 ● 対象の実機用のADB用USBドライバをインストー ルする必要があります。これは、対象の実機によっ て変わります。対象の実機のサイトでダウンロード することになります。(Windowsの場合)
  25. 25. 実機の接続確認 ● 実機のUSBデバッグを有効にする必要があります 実機のバージョン、機種によって、設定箇所が異な ります。 ● Eclipseで、DDMSを選ぶとデバイスが繋がってい る場合は、デバイス一覧に名称が表示されます。 ● DDMSでは、デバイス内のファイルを見ることも可 能です。
  26. 26. USB デバッグを有効にする ● [設定|開発者向けオプション]で[USB デバッグ] オプションをオンにします。 ● Android 4.2 以降では、[開発者向けオプション]が デフォルトで非表示になっています。 ● [設定|<デバイス種別>情報]を開き、下部の[ビ ルド番号]を 7 回タップすると、[設定|開発者向 けオプション]が使用可能になります。 ● [スリープしない]オプションをオンにした方が開発 しやすい。
  27. 27. Javaの基礎 ● Javaを使って、Androidアプリを作成するため。 ● Javaの基礎を学ぶ。 ● よく使いそうな部分だけ、抜粋して説明。
  28. 28. Javaの基礎 ● Androidアプリ用に、準備した開発環境で、Javaの 基礎を学ぶために、コンソールアプリで試す。 ● コンソールアプリは、ちょっとしたコードを試すの に、便利です。 ● Androidアプリを開発するときも、小さい機能を試 すときに、コンソールアプリで試すことは、よくあり ます。
  29. 29. Javaの基礎 ● Androidアプリ用に、準備した開発環境で、Javaの基礎を 学ぶために、コンソールアプリで試す。 ● コンソールアプリは、ちょっとしたコードを試すのに、便利で す。 ● Androidアプリを開発するときも、小さい機能を試すとき に、コンソールアプリで試すことは、よくあります。 ● Javaの基礎のサンプルコードは、以下のURLのLesson1 からLesson8までです。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  30. 30. Eclispeでコンソールアプリ ● Eclipseを起動します ● ファイルメニューの新規で、Javaプロジェクトを選択 します。(Androidアプリの場合とは異なります) ● Javaプロジェクトの作成画面が開きます ● プロジェクト名を入力(任意の名称) ● 完了をクリック ● プロジェクトを選択して、右クリックメニューから 新規を選び、その中のクラスを選択 ● クラスの作成画面が表示されます
  31. 31. Eclispeでコンソールアプリ ● 名前(クラス名)を入力します(任意の名前) 説明をわかりやすくするため、「Sample」としておき ましょう。 ● public static void main()の欄にチェックを入れる ● Sample.javaというファイルが作成され、 ファイル内には、Sampleクラスがあり、メソッドとし て、main()ができています。main()次の中カッコの 中に、プログラムを書いていきます。
  32. 32. 最初のプログラム ● main()の下にある、todoの次の行に、プログラムを 書いていきます。 ● 「syso」と入力して、CTRL+スペースを押してくださ い。(コード補完のショートカット) ● System.out.println()というコードが書かれます ● System.out.println()の()の中に、文字を書きま す。””で囲った中に好きな文字を入力してくださ い。名前などで構いません。 ● メニューの実行から、実行を選びます。 ● 文字が、画面下のコンソールに出力されます。
  33. 33. 最初のプログラム ● 問題がなければ、文字が出力された思います。 ● 問題があった場合は、エラーとなっています。 ● エラー原因を取り除いて、再度、実行しましょう。 ● 下部の問題というタブを除くとエラー要因が書かれ ています。 ● エラーの修正は、慣れるまでは、とても大変な作業 です。
  34. 34. エラーの修正のコツは(重要!) ● 1行目のエラーに注目すること。 2行目以降のエラーは、1行目が原因で出ているこ とがあるので、1行目を無視してはいけない。 ● 小さく作って、小さく試す。 たくさんのコードを一度にコンパイルすると、エラー が多すぎて、探しにくいです。 ● 行数の多いコードのエラーを見つけるには、2分探 索を用いると早く原因にたどり着けます。 ● エラー内容をコピーして、googleで検索。
  35. 35. 変数とは ● 値を入れる箱のようなもの ● 型がある。箱のサイズ、種類が決まる ● とりあえず、int型とboolean型を覚えよう。 ● プリミティブ型(基本的な型) ● intは、整数を扱う型。 (-2147483648~2147483647) ● booleanは、ture(真)かfalse(偽)
  36. 36. 変数の使い方1 ● 宣言方法 型名 変数名; ● 変数名は、AからZ、aからz、0から9、アンダーバー (_)が使える。但し、先頭に数字は使えない。 任意の名前をつけることができる。 わかりやすい名前をつけた方が後で読みやすい。 ● 例 int abc01; boolean a_flag;
  37. 37. 変数の使い方2 ● 変数に値を代入する ● 例 int temp; temp = 10; boolean flag; flag = false;
  38. 38. 変数の使い方3 ● 変数の値を表示してみる ● 最初に使ったSystem.out.println()を使って。 int temp = 100; System.out.println(temp); ● 上記を先ほど書いたプログラムのmain()の中に書 いて動かしてください。 ● 以下の文を追記して、動かしてください。 System.out.println(“Valude = “ + temp); int temp = 100;
  39. 39. 演算子 ● コンピュータなので、当然計算ができます。 ● 計算の時に使うのが演算子です。 四則演算+剰余の演算。 ● + 足し算 ● - 引き算 ● * 掛け算 ● / 割り算 ● % 剰余
  40. 40. 演算子を使う ● 以下の演算で、temp3の値がどうなるか試すこと。 ● int temp1 = 100; int temp2 = 30; int temp3 = 0; temp3 = temp1+temp2; temp3 = temp1-temp2; temp3 = temp1*temp2; temp3 = temp1/temp2; temp3 = temp1%temp2;
  41. 41. 制御構文(if文) ● 分岐をするための構文 int money = 100; if(money >= 120){ System.out.println(“缶ジュース”); } else {   System.out.println(“購入不可能”); } moneyの値を変えて、「缶ジュース」を表示してくだ さい。
  42. 42. 制御構文(for文) ● 繰り返しを行うための構文 for(int i=1;i<=10;i++) { System.out.println(“繰り返し:” + i); } ● Money >= 120、i<=10は、条件式 ● >=、i<=は、比較演算子。等しいは、== ● if文、for文ともに、入れ子可能
  43. 43. 演習 ● 二つの変数(int)を準備し、大きい方の数を if文で判定し、表示しなさい。 (数値の値を変えても動作が正しいこと) ● 1から100までの奇数を表示 (forとifの組み合わせ) 奇数の判定は、剰余を使うと簡単。
  44. 44. 関数 ● 入力を与えて、出力を得る ● 入力のことを引数という ● 出力を戻り値という ● function(x,y)=x+yは、 int plus(int x,int y){ return x+y; }
  45. 45. 関数 ● 前のページのままでは、コンパイルが通りません。 public static int plus(int x,int y){ return x + y; } ● この関数の呼び出しは int a = 10; int b = 90; int answer = plus(a,b);
  46. 46. 関数 ● 関数の定義 型名 関数名(型名 仮引数名) { // 処理 } ● 関数の呼び出し 関数名(実引数名); ● 戻り値がない場合は、型名をvoidとする。その場合 は、returnが不要となる。
  47. 47. 演習 ● 割引計算関数 discount();を作成 ● 引数に元の値段を与えて、値引き後の値段を得る (割引率は30%)(*整数演算だけで行う) 元の値段が100なら、値引き後は、70が得られ る。 Int result = discount(100); ● 割引率を2つめの引数として関数を作成。 *割引率も整数
  48. 48. オブジェクト指向 ● クラス 変数定義(フィールド)とメソッド定義からなる設計 書。(レシピのようなもの) ● メソッド 関数定義と同様。 ● インスタンス生成 クラス(設計書)を元に、実体を作ること。 (レシピを見て、実際の料理を作るイメージ)
  49. 49. オブジェクト指向 ● クラス 変数定義(フィールド)とメソッド定義からなる設計 書。(レシピのようなもの) ● メソッド 関数定義と同様。 ● インスタンス生成 クラス(設計書)を元に、実体を作ること。 (レシピを見て、実際の料理を作るイメージ)
  50. 50. クラスの書き方(例:Dogクラス) class Dog { private String Name; // Stringは、文字列型 public void setName(String n){ Name = h; } public void showProfile(){ System.out.println(“名前は、” + Name + “です”); } }
  51. 51. クラスの使い方 ● インスンタンスの生成 ● 先ほどのDogクラスを使ってみる // インスンタンスの生成 Dog myDog = new Dog(); myDog.setName(“たろう”); myDog.showProfile();
  52. 52. 演習 ● 例題のDogクラスに、次の内容を追加してください 年齢を保持するint型のフィールドを定義。 ● 年齢を設定するメソッド、SetAge。 ● ShowProfileメソッドで名前、年齢を表示するようにする。 ● 修正したDogクラスを使用して次のプログラムを作成しなさ い。 ● Dogクラスのインスタンスを作成する。 ● 名前、年齢を設定する。 ● プロフィールを表示する。
  53. 53. 配列とコレクションクラス ● 配列は、あまり使わずにコレクションクラスを使うこ とが多いので、あえてコレクションクラスを一緒に説 明します。 ● 配列とは、複数の変数を同じ名前でまとめて扱え るようにしたもの。 ● 例えば、Seito01,Seito02,Seito03,Seito04のよう に、4つ変数で4人分のデータを表現する代わりに ● int Seito[] = new int[4]; これで、4人分のデータを 定義できる。使い方は、Seito[0]、Seito[1]のよう に、カッコの中に数値を入れてアクセスする。
  54. 54. 配列の使いづらい点 ● int Seito[] = new int[4];のようにした場合 ● Seito[4] = 100; とすると配列の範囲をこえるので、 エラーとなる。(プログラムが落ちる) ● 最初の要素数を超えた場合、後で、要素数を拡張 しようとしてもできない。
  55. 55. コレクション(ArrayList)クラス ● 書き方 ArrayList<型> 変数名 = new ArrayList<型>(); ● 先ほどの配列をArrayListにしてみる ArrayList<Integer> Seito       = new ArrayList<Integer>(); ● 型は,プリミティブ型が使えない。 ● データの追加は、 Seito.add(10);
  56. 56. コレクション(ArrayList)クラス ● データの取得 int temp = Seito.get(0); ● 要素数の取得 int count = Seito.size(); ● 要素の検索 int index = Seito.size(100); ● 要素のさくじょ Seito.remove(1);  // 任意の場所 Seito.clear(); // 全ての要素のクリア ● ソート Collections.sort(Seito);
  57. 57. ● コード例 ArrayList<Integer> Seito = new ArrayList<Integer>(); Seito.add(300); Seito.add(250); Seito.add(400); Seito.add(100); Collections.sort(Seito); // Seito.remove(2); // Seito.clear(); for(int i=0;i<Seito.size();i++) { System.out.println(Seito.get(i)); }
  58. 58. Stringクラス ● 文字列を扱うクラス String temp = “ab,cde,fg”; ● 長さを取得 int len = temp.length(); ● 文字列の検索 int posi = temp.indexOf(“cde”); ● 文字列の分割 String temp2[] = temp.split(“,”);
  59. 59. ● コード例 String aaa = "ab,cde,fg"; System.out.println(aaa.length()); System.out.println(aaa.indexOf("cde")); String abc[] = aaa.split(","); for(int i=0;i<abc.length;i++) { System.out.println(abc[i]); }
  60. 60. ここまでの復習 ● 課題のコードは、以下のURLのExercise01です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  61. 61. Androidアプリの開発 ● ここから、Androidアプリの開発に入ります。 ● まず、動作確認のために作成したAndroidアプリで 生成されたファイル、フォルダを見ていきます。
  62. 62. 生成されたファイルについて ● 生成されたファイル、フォルダの中で、よく使うもの に限って、説明します。 ● srcフォルダ Androidアプリを作成するJavaのコードがある場所 ● resフォルダ レイアウトファイル、アイコンなどのリソースがある 場所 ● AndroidMnifes.xml アプリの設定を決めるファイル
  63. 63. とりあえず、動かしたい ● 主要コンポートの説明の前に、動かしている実感 が湧くアプリを書いてみましょう。 ● モチベーションを維持するために、とりあえず動し てみます。 ● プロジェクトの作成 Androidアプリケーション・プロジェクトを選択 ● 次のサンプルコードは、以下のURLのSample10です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  64. 64. 新規Androidアプリケーション アプリケーション名、プロジェクト名、パッケージ名 は、好きな名称をつけてください。 ● 最小必須SDKを、API 14  Android4.0(IceCreamSandwich)に設定。 ● テーマをNoneに設定。 ● それ以外は、初期値のまま完了まで進んでくださ い。 *最小必須SDKを、API 14したのは、余分なコー ドが作成されないようにするためです。
  65. 65. 余分なコードを消す ● onCreateOptionsMenu()を削除 ● onOptionsItemSelected()を削除 ● class PlaceholderFragment()を削除 ● if (savedInstanceState == null){のブロックを削除 ● setContentView()の引数をnullに。 ビルドが通ることを確認してください。 *このまま実行しても、動作しません。
  66. 66. Viewクラスの作成 ● クラスの作成機能を使って、Viewクラスを作成しま す。 ● クラス名は、「SampleView」としておいてください。 名前に意味はありません。説明をしやすくするため です。 ● スーパークラスをandroid.view.Viewにしてくださ い。(ここは、重要です) ● これで、作成してください。
  67. 67. SampleViewクラス ● SampleViewメソッドを追記してください。 public SampleView(Context context){ super(context); setBackgroundColor(Color.WHITE); } ● クラスと同じメソッドをコストラクタと言います。
  68. 68. SampleViewクラス ● onDraw()メソッドをオーバーライドしてください。 @Override public void onDraw(Canvas canvas){ canvas.drawText("Hello", 100, 100, paint); } ● フィールドに、次の変数を定義してください。 private Paint paint = new Paint();
  69. 69. ビルドと実行 ● それでは、再度ビルド、実行してください。 ● 「Hello」と表示されたはずです。 ● これでは、コンソールと変わらないので、次は、 ● テキスト表示の部分を図形に変えて見ます。 ● canvas.drawText()を削除。 ● canvas.drawCircle(100,100,5,paint);を記述。 ● 座標(100,100)に円の描画を実施 ● 実行して、円が表示されることを確認してください。
  70. 70. 描画を拡張 ● 円の色を変えてみます。 ● canvas.drawCircle()の前に、 paint.setColor(Color.RED);を記述 ● 実行して、赤い円が描かれることを確認してくださ い。 *座標の原点は、左上です。
  71. 71. タッチイベントの取得 ● onTouchEvent()をオーバーライドしてください @Override public boolean onTouchEvent(MotionEvent event) { } ● ビルドが通ることを確認
  72. 72. タッチイベント動作確認 ● タッチイベントの動作確認をします。 onTouchEvent()内に、 Toast.makeText(getContext(), "Touchされまし た", Toast.LENGTH_SHORT).show(); を記述してください。 ● 実行してください。タッチするたびに、画面に 「Touchされました」と表示されたと思います。
  73. 73. 円がタッチされたら、色を変える ● タッチイベントの判定 public boolean onTouchEvent(MotionEvent event){ int action = event.getAction(); if((action & MotionEvent.ACTION_MASK) == MotionEvent.ACTION_DOWN){ // タッチされたことを判定 } }
  74. 74. 座標を取得 // タッチされた座標 int ex = (int)event.getX(); int ey = (int)event.getY();
  75. 75. 円と点の衝突判定 円(bx,by,R)点(ex,ey) R:円の半径 ● if((bx - ex)*(bx - ex)+(by - ey)*(by - ey) <= R*R){ // 衝突 }
  76. 76. 円の色を変える ● colorというフィールドを定義 ● color = Color.RED; // Color.BLUE ● 円を描く際に paint.setColor(color); ● で色指定すること ● colorをセットしたら、 invalidate();を呼んでおくこと。再描画させるため
  77. 77. タイマーで、円を移動 ● MainActivityのフィールドに private Handler handler = new Handler(); を記述。 ● onCreate()でタイマー作成
  78. 78. タイマー作成 Timer timer = new Timer(false); timer.schedule(new TimerTask(){ public void run(){ handler.post(new Runnable(){ public void run(){ view.invalidate(); } }); } },0,30); // 30msec毎に、viewを再描画させる ● このコードが理解できたら、脱初心者です。 ● キーワード(抽象クラス、匿名クラス、インタフェース、スレッド間通信)
  79. 79. onDraw()で座標更新 ● 左端、右端、上端、下端に来たときの処理を記述。 ● 例)左端の処理 bx:円の中心 dx:移動量 (正で右へ、負で左へ移動) if (bx < 0 ) { dx = 2; } bx = bx + dx; // 座標更新
  80. 80. 線と矩形描画 ● 線の描画 ● canvas.drawLine(x1,y1,x2,y2,paint); ● x1,y1 始点座標 x2,y2 終点座標 ● 矩形描画 ● canvas.drawRect(x1,y1,x2,y2,paint); ● x1,y1 左上座標 x2,y2 右下座標
  81. 81. 画像描画 ● フィールドにビットマップ保存用の変数を定義 ● private Bitmap item; ● viewのコンストラクタで、ビットマップを読み込む ● Resources res = context.getResources(); ● item = BitmapFactory.decodeResource(res, R.drawable.ic_launcher); ● onDraw()で描画 ● canvas.drawBitmap(item, 100, 200, null);
  82. 82. 復習 ● ここで、Javaの復習 ● 継承、コンストラクタ、オーバーロード、 オーバーライド、superなどの要素が出てきたの で、コンソールアプリを使って、ひと通り説明しま す。
  83. 83. 応用 ● ここまでの要素を組み合わせれば、ブロック崩し、 インベーダー、テトリス、オセロなどが作成可能で す。 ● 何でも良いので、作ってみましょう。 ● 次は、Androidの主要コンポーネントについて ● アプリの作成方法は、レイアウトファイルを主体とし たやり方です。
  84. 84. 主要コンポーネント ● アプリの主要な機能を実現するためのコンポーネ ント ● Activity ・・・ ユーザーインターフェース ● Intent  ・・・ コンポーネント間通信 ● Content Provider ・・・ データアクセス ● Broadcast Receiver ・・・ イベントトリガー ● Service ・・・ バックグランド実行 *今回の勉強会では、ActivityとIntentを使いま す。
  85. 85. Activity(アクティビティ) ● 画面の元になるコンポーネント ● アクティビティの上にボタン、チェックボックスなどの部品を を配置して画面を作成する ● 基本的に1画面は、1つのアクティビティで構成される。 ● アクティビティは、実行中、一時停止などの状態を持つ。 (ライフサイクル) ● 次のサンプルコードは、以下のURLのSample11/12です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  86. 86. View(ボタン)を配置 ● アクティビティにViewを配置する まず、ボタンを配置してみる ● GUIデザイナで、ボタンを配置 ● XMLファイルに書かれる ● コードでは、XMLファイルを指定することで、View を指定することができる。
  87. 87. ボタンを使うコード ● コード上でボタンを呼び出す処理 findViewById() ● 取得したオブジェクトに設定を行う ● イベントを設定 トーストを表示するコード *トースト、画面上に短い間メッセージを表示する 仕組み。警告メッセージなどを表示する場合などに 使う。
  88. 88. ログ出力 ● コードが複雑になってくると、プログラムが思い通り 動いているか、検証したくなります。 ● 毎回、デバッガで動かすのも面倒なので、よく使う テクニックとして、気になる箇所にログを仕込みま す。 ● Log.d("TAG", "message"); ● ログレベルによって、「v/e/d/w/i」を使い分ける ● ログは、Logcatというツールで見ることができま す。
  89. 89. テキストViewを配置 ● GUIデザイナで、テキストViewを配置 ● ボタンが押されたイベントに、テキストViewに文字 を出力するコードを記述
  90. 90. エディットテキストを配置 ● GUIデザイナでエディットテキストを配置 ● ボタンクリックのイベントでエディットテキストから 文字列を読んで、テキストViewに出力するコードを 書いてみる
  91. 91. Activityのライフサイクル
  92. 92. ライフサイクルに関連するメソッド メソッド名 呼ばれるタイミング ● onCreate() Activityが初めて作られたとき ● onStart() Activityが開始されたとき ● onResume() Activityが表示されたとき ● onRestart() Activityが再度開始されたとき ● onPause() 別のActivityが表示されるとき ● onStop() Activityが表示されなくなったとき ● onDestroy() Activityがメモリから開放される直前
  93. 93. ライフサイクルの確認 ● ライフサイクルに関連するメソッドに、ログを仕込ん だアプリを使って、どのような順番で呼ばれのか、 調べてみましょう。 ● Androidで吐き出すログは、logcatというツールで 見ることができます。開発環境に含まれています。 ● このサンプルコードは、以下のURLのSample13です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  94. 94. Intent(インテント) ● コンポーネント間通信の仕組み ● ここでいうコンポーネントとは、アクティビィティ、 サービス、ブロードキャストレシーバ。 ● 具体例 アクティビィティ1からアクティビィティ2を起動(画面 遷移) 外部アプリのメールソフトを起動、ウェブブラウザを 起動など。
  95. 95. Intent(インテント) ● コンポーネント間通信の仕組み ● ここでいうコンポーネントとは、アクティビィティ、 サービス、ブロードキャストレシーバ。 ● 具体例 アクティビィティ1からアクティビィティ2を起動(画面 遷移) 外部アプリのメールソフトを起動、ウェブブラウザを 起動など。
  96. 96. Intentを試す ● ブラウザ起動 Intent intent = null; intent = new Intent(Intent.ACTION_VIEW, Uri.parse("http://google.com/")); startActivity(intent); ● このサンプルコードは、以下のURLのSample11/12です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  97. 97. Intentを試す ● メール送信 Uri uri=Uri.parse("mailto:test@test.com"); Intent intent=new Intent(Intent.ACTION_SENDTO,uri); intent.putExtra(Intent.EXTRA_SUBJECT,"タイトル"); intent.putExtra(Intent.EXTRA_TEXT,"本文"); intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK); startActivity(intent); ● このサンプルコードは、以下のURLのSample14です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  98. 98. 画面遷移 ● アクティビティを追加して、画面遷移を実現 1)クラスの追加(Activityを継承) 2)マニュフェストに新たなアクティビティを追記   <activity android:name=".SubActivity"    android:label="@string/app_name">   </activity>  *忘れるとアプリが落ちるので、注意。 3)メイン画面から、ボタンクリックで画面遷移するようにコード を記述。 ● このサンプルコードは、以下のURLのSample15です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  99. 99. 位置情報の取得 ● マニフェストにパーミンション記述が必要 <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> ● wifiで位置情報を取得するには、次が必要 <uses-permission android:name="android.permission.INTERNET" /> ● エミュレータで、擬似GPSを使うには、次が必要 <uses-permission android:name="android.permission.ACCESS_MOCK_LOCATION" /> ● このサンプルコードは、以下のURLのSample16です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  100. 100. LocationManager private LocationManager locationManager = null; locationManager = (LocationManager)getSystemService(LOCATION_SERVICE); ● //wifiから、位置情報取得 locationManager.requestLocationUpdates( LocationManager.NETWORK_PROVIDER, 1000L, 0,mLocationListener); ● //GPSから、位置情報取得 locationManager.requestLocationUpdates( LocationManager.GPS_PROVIDER, 1000L, 0,mLocationListener);
  101. 101. LocationListener ● LocationListenerを生成 private LocationListener mLocationListener = new LocationListener(){ ● LocationListenerのメソッドを記述 ● onStatusChanged/onProviderEnabled/onProvid erDisabledは、空。 ● onLocationChangedで、位置情報を取得
  102. 102. 緯度経度の取得 ● onLocationChangedで緯度経度を取得 String latitude = Double.toString(location.getLatitude()); String longitude = Double.toString(location.getLongitude());
  103. 103. 緯度経度をブラウザへ ● Yhoo地図を利用(「Yahoo!地図 パラメータ」で検索) String urlStrng = "http://map.yahoo.co.jp/maps? type=scroll&pointer=on&sc=2&lat="; urlStrng += latitude; urlStrng += "&lon="; urlStrng += longitude; Intent intent = null; intent = new Intent(Intent.ACTION_VIEW,Uri.parse(urlStrng));
  104. 104. 緯度経度をメールへ Uri uri=Uri.parse("mailto:test@test.com"); Intent intent=new Intent(Intent.ACTION_SENDTO,uri); intent.putExtra(Intent.EXTRA_SUBJECT,"ここにいます"); *全ページで作成したURLを本文にいれるだけ。 intent.putExtra(Intent.EXTRA_TEXT,urlStrng); intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
  105. 105. 装飾(背景を画像に) ● resのdrawableフォルダに、画像を追加 ● "background.png" ● RelativeLayoutの属性に以下を追加 ● android:background="@drawable/background"
  106. 106. ボタンに画像をつける ● 画像はアイコンを利用 ● Buttonの属性に以下を追加 ● android:drawableLeft="@drawable/ic_launcher"
  107. 107. 位置情報を使う ● 位置情報をつかって、最寄り駅の検索をしてみる ● Web上には、いろんな情報を取得できるサービス があります。 ● Webにアクセスして情報を取得すると更におもしろ いことができるようになります。 ● 今回は、緯度経度から最寄り駅を検索するサービ スを使ってみます。 ● http://map.simpleapi.net/
  108. 108. 位置情報を使う ● 位置情報をつかって、最寄り駅の検索をしてみる ● Web上には、いろんな情報を取得できるサービス があります。 ● Webにアクセスして情報を取得すると更におもしろ いことができるようになります。 ● 今回は、緯度経度から最寄り駅を検索するサービ スを使ってみます。 ● http://map.simpleapi.net/
  109. 109. Webにアクセスするには ● HttpClient/HttpGet/HttpResponseなどのクラスを 使ってアクセスします。 ● 問題なのは、Androidの規約で、Webアクセスする コードは、バックグランドで動かす必要があります。 ● バックグランドは、AsyncTaskというクラスを使って 実現します。これ以外にも、バックグランド処理の 実現方法は、ありますが、この方法が一番手頃な ので、これを紹介することにします。 ● このサンプルコードは、以下のURLのSample17です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  110. 110. AsyncTaskの使い方 ● Activityを継承したクラスの内部で、AsyncTaskクラ スを継承したクラスを宣言します。 protected class Task extends AsyncTask<String,String,String> ● Taskクラスの中で、doInBackgroundとonPostExecuteを オーバーライドします。 ● doInBackgroundメソッドには、実際にバックグランドで実 行する処理を書きます。今回は、Webアクセスの処理。 ● onPostExecuteは、doInBackgroundから渡された実行結 果をUIに表示する処理を書きます。 ● ここが重要です。onPostExecuteは、UIスレッドで動作して いるので、UIアクセスが可能。
  111. 111. AsyncTaskの使い方 ● Activityを継承したクラスの内部で、AsyncTaskクラ スを継承したクラスを宣言します。 protected class Task extends AsyncTask<String,String,String> ● Taskクラスの中で、doInBackgroundとonPostExecuteを オーバーライドします。 ● doInBackgroundメソッドには、実際にバックグランドで実 行する処理を書きます。今回は、Webアクセスの処理。 ● onPostExecuteは、doInBackgroundから渡された実行結 果をUIに表示する処理を書きます。 ● ここが重要です。onPostExecuteは、UIスレッドで動作して いるので、UIアクセスが可能。
  112. 112. Webアクセスのコード ● 手順は、下記のようなコードでアクセス可能です ● 実際には、エラー処理などが入るのでもう少し複雑です。 ● 実際のコードは、Eclipse上で説明します。 HttpClient client = new DefaultHttpClient(); HttpGet get = new HttpGet(URL); HttpResponse res = client.execute(get); StatusLine statusLine = response.getStatusLine(); byte[] result = EntityUtils.toByteArray(res.getEntity()); String data = new String(result, "UTF-8");
  113. 113. JSONを使う ● Webサービスは、JSONというデータ形式でデータ を返してくることが多いです。今回、使う最寄り駅検 索のサービスもJSONです。 ● でも、JSONを扱うクラスがちゃんと用意されている ので、簡単に使えます。JSONObject。 JSONObject jsonObj = new JSONObject(JSON文字列); ● のように記述すると、JSONObject生成されます。 ● そこから、データを抜き出すことになります。 実際のコードは、Eclipse上で説明します。 (面倒です。データ構造をちゃんと見極めることが重要)
  114. 114. 最寄り駅検索完成 ● 最寄り駅情報をJSONから取得できたら、後は、それをUI 上のTextViewに書いてやれば、完成です。 ● JSONを取得する部分は、先ほど出てきたonPostExecute の中に記述します。 理由は、データを抜き出した後で、TextViewにアクセスす る必要があるからです。 ● この機能を位置情報を取得するコードと合わせるとここに いますの情報に最寄り駅も入れることができるようになり ます。 ● 実は、Sample16には、天気を取得したり、現在住所を取 得するようなコードが書いてあります。
  115. 115. 更にブラッシュアップ ● 見た目も、機能もそれなりに整ってきたのですが、 更に本格的なアプリに近づけます。 ● 何が問題かというと、メールアドレスが直接書かれ ているので、送り先が書きかえできないのが欠点 です。 ● これを解消するために、アプリ内にメールアドレス を保存する機能をつけます。 ● プリファレンス(SharedPreferences)を使います。 ● このサンプルコードは、以下のURLのSample18です。 https://github.com/kami256/LearningAndroid/tree/master/LearningAndroid
  116. 116. SharedPreferences ● SharedPreferencesをフィールドに宣言。(sharedPref) ● onCreateで、インスタンスを取得 sharedPref =  PreferenceManager.getDefaultSharedPreferences(this); ● 読む場合 sharedPref.getString("mailaddress", "")) ● 書く場合 Editor editor = sharedPref.edit(); editor.putString("mailaddress", "書き込むデータ" ); editor.commit();
  117. 117. PreferenceActivity ● これを継承したクラス(Activity)を使うと、設定画面 が簡単に作成できます。 ● 必要なメソッドは、onCreateのみ作成 ● レイアウト用のXMLが必要 ● 新たなActivityを追加するので、マニフェストファイ ルに追記が必要 詳細は、Eclipse上で説明します
  118. 118. アプリ作成のまとめ ● 位置情報取得(Sample16) ● 最寄り駅取得(Sample17) ● プリファレンス(Sample18) これらの機能から必要なものを組み合わせて、最 終形に仕上げる。
  119. 119. Github ● ソーシャルコーディング ● コードを公開するための仕組み ● 有料なら、公開しないプライベートでの使用も可 能。 ● Gitは、Githubを使うためのソフトウェアであり、ソー スコードのバージョン管理のために作られたもので す。 ● その機能を利用して、外部へソースコードを公開す る仕組みをWeb上に展開したがGithub。
  120. 120. Githubで開発されているOSS ● Ruby On Rails ● node.js ● jQuery ● Symfony2 ● Bootstrap *有名なOSSが多く利用している
  121. 121. Gihubの利用方法 ● まず、GitがPCにインストールされていること ● 次に、Githubにアカウント作成する必要があります http://github.com にアクセス [Sign up for Github]をクリック ● Step1 Username・Email Address・Passwordを入力。 [Create an account]をクリック *Usernameが、公開される名前になります。
  122. 122. Githubの登録 ● Step2 フリープランが選択されていることを確認して、 [Finish sign up] をクリックします。 ● Step3 ダッシュボード画面が表示されていれば、完了
  123. 123. SSH Keyの設定 ● ssh-keygenというコマンドでSSH Keyを作成する 生成されたid_rsa.pubの中身を利用。 ● Githubの設定ボタン(Account Setting)(右上)をク リック ● 画面が表示されたら、メニューから、SSH Keysを 選択 ● Add SSH Keyをクリック Titleを入力してから、id_rsa.pubの中身をコピーし て、Keyに貼り付ける。その後、Add Keyをクリック
  124. 124. 確認・ポイント ● SSH Keyの登録が成功すると、登録したメールアドレス に、登録成功のメールが届きます ● Windowsの場合は、Gitと一緒にインストールされたSSH- Keygenを使うと良いです。 ***これで、準備が整いました***
  125. 125. リポジトリの作成 ● 右上の+記号の横をクリックするとメニューが ● 表示されるので、その中から、 ● [New Repository]を選択 ● Repository Nameを入力したら ● Initialize this repository with a READMEにチェッ ク ● [Create Repository]をクリック
  126. 126. リポジトリにアクセス ● https://github.com/ユーザー名/リポジトリ名 で作成したリポジトリにアクセスできます。 ● 作成したリポジトリをcloneする git clone https://github.com/ユーザー名/リポジト リ名.git *cloneするリポジトリのURLは、GitHubのリポジト リの上記の画面の右下にある[HTTPS clone URL]で参照できます。
  127. 127. ファイルを追加 ● cloneされたディレクトリに移動 ● 追加するファイルを置く(作成)(例:test.txt) ● git add test.txt ● git commit -m "File Add" *まだ、リモートには、登録されていない ● git push ユーザー名とパスワードを入力して完了 ● これで、ソースを公開することができます

×