第一回android training4desinger
TRANSCRIPT
自己紹介
名前: 鈴木 研吾 twitter: @kengoScal
2011~2014:セキュリティアナリスト@野村総研 2014年11月: マネーフォワード入社 2014年11月~2015年01月: iOS開発 2015年02月~08月:Android開発 2015年10月~ : セキュリティ某
2
gitでソース落とす
• terminal立ち上げ • spotlightからterminalとうてばおk
• mkdir ~/Desktop/workspace • cd ~/Desktop/workspace • git clone https://github.com/ken5scal/AndroidTraining4Designer.git
• cd AndroidTraining4Designer
9
Android Studio
• Android Studioを開く • 起動してる間に、Genymotionを開き、Google Nexus 6 -5.1.0 -API22を立ち上げる
• 立ち上がったら、プロジェクトをロード • File > open > デスクトップのworkspace > AndroidTraining… • > build.gradleをクリック
• ツールバー上の再生ボタンが押せるようになったらクリック • しばらくするとChoose Deviceというダイアログが出るので、その中のデバイスをクリック
• そうするとGenymotionでアプリが走り出す
10
View サマリー
• View: 画面を構成する要素となるパーツ • TextView • EditText • ImageView • Button • etc
• MyApplicationアプリの「非レイアウトView」を参照
11
Layout サマリー
• Layout: 配下のView(もしくは子Layout)をグルーピングする • Linear Layout • View を縦横に並べます
• Relative Layout • 相対的にViewを並べる
• FrameLayout • Viewを重ねる
• ScrollView, ListView, GridView, etc • MyApplicationアプリの「なんとか Layout Example」を参照
12
View, Layoutの共通パラメタ
• ID名 • パラメタ名 • android:id
• パラメタの値 • “@+id/[ID名]
• 外部から参照する際に指定するID • 例: RelativeLayout
• 参照しなくてもつけておいて損はない • なんのviewかわかりやすくなる
• 参照: activity_non_layout.xml • ※Android Studioでapp > res > layout内のファイルを参照
13
View, Layoutの共通パラメタ
• サイズ • パラメタ名 • android:layout_height -> 高さ • android:layout_width -> 横幅
• パラメタの値 (dp) • match_parent -> 親Viewと同じサイズ • wrap_content -> コンテンツを表示するのに十分なサイズに調整
• 参照: activity_non_layout.xml • ※Android Studioでapp > res > layout内のファイルを参照
14
View, Layoutの共通パラメタ
• パディング、マージン • パラメタ名 • android:padding, android:layout_margin • 全方面への余白調整
• paddingほげ, layout_marginほげ • ほげ: Top, Bottom, Right, Left • ほげに指定した方向への余白調整
• パラメタの値 (dp) • 参照: activity_non_layout.xml
15
View, Layoutの共通パラメタ
• 位置 • パラメタ名
• android:layout_gravity • View(Layout)そのものの位置を指定
• android:gravity • View(Layout)の中身の位置を指定
• パラメタの値 • center_horizontal: 水平方向の真ん中 • center_vertical: 垂直方方向の真ん中 • center: center_horizontal と center_vertical • right, top, bottom, start, end
• gravityパラメタを使えないViewもある (例: ImageView) • 参照: activity_linear_layout_example.xml
16
LinearLayout独自のパラメタ
• 整列方向: 子View(Layout)の並び方向を指定 • パラメタ名 • android:orientation
• パラメタの値 • horizontal • vertical
• デフォルトはhorizontal • 参照: activity_linear_layout_example.xml
17
LinearLayout独自のパラメタ
• 重み: 子View(Layout)が占有できる余白の割り当て比率 • パラメタ名 • android:layout_weight
• パラメタの値 • 1とか数字
• 注意: orientation方向のsizeパラメタを0dpにしなければいけない • 例: orientation: horizontalなら、width=“0dp”
• 画面一杯使って、うまくView(Layout)で分割したい時につかう • 参照: activity_linear_layout_example.xml
18
RelativeLayout独自のパラメタ
• 相対位置: 子View(Layout)の別のView(Layout)に対する位置 • パターン1 • パラメタ名 • android:alignParentなんちゃら: 親Viewに対する相対位置 • なんちゃら: Bottom, Left, Right, Top
• android:layout_centerなんちゃら: 同上 • なんちゃら: Horizontal, Parent, Vertical
• パラメタの値 • true/false
• 参照: activity_relative_layout_example.xml
19
RelativeLayout独自のパラメタ
• 相対位置: 子View(Layout)の別のView(Layout)に対する位置 • パターン2
• パラメタ名 • android:layout_alignなんちゃら: 指定した別の子View(Layout)に対する相対位置 • なんちゃら: Baseline, Bottom, Left, Right, Top, below, above
• android:layout_toなんちゃらOf: 指定した別の子View(Layout)の左か右に配置 • なんちゃら: Left, Right
• パラメタの値 • @id/ID名
• 参照: activity_relative_layout_example.xml
20
これらを組み合わせてレイアウトを作る
• じゃやってみるか • ということで実習
• 上記のバナー?みたいなのを作ってみましょう • activity_assignment.xml内の「ここから」「ここまで」の間を記入してください
21