- The added line is THIS COLOR.
- The deleted line is THIS COLOR.
''[[MobileApp>Mobile Application 入門]]'' > ''[[Android>Android]]'' > ''Layout''
#freeze
''[[手机开发指南>手机开发指南]]'' > ''[[Android>Android]]'' > ''布局''
~
~
*レイアウトの概要 [#sb77194a]
ViewとViewGroupの組み合わせで、アプリに配置する部品のレイアウト設定が可能
ViewとViewGroupの組み合わせで、アプリに配置する部品のレイアウト設定が可能
~
~
**ViewとViewGroup [#y454ce88]
・Viewの集まりをViewGroupという~
・ViewGroupは複数のViewを含む~
・ViewGroupの中にViewGroupを含むこともできる~
・レイアウトはViewGroupを継承している~
※具体的なイメージは以下の継承図を参照。
・Viewの集まりをViewGroupという~
・ViewGroupは複数のViewを含む~
・ViewGroupの中にViewGroupを含むこともできる~
・レイアウトはViewGroupを継承している~
※具体的なイメージは以下の継承図を参照。
~
**ViewGroup を取り巻くクラス [#b370a8dc]
ViewGroupとその継承関係を以下に記述する
ViewGroupとその継承関係を以下に記述する
&ref(ViewGroup.gif,nolink);
~
*レイアウトの種類 [#k84d3564]
~
代表的なビューグループ(レイアウト)を以下に記述する
代表的なビューグループ(レイアウト)を以下に記述する
#style(class=table_left){{
|Ⅰ| absolute layout | 絶対座標指定の配置が可能 |
|Ⅱ| relative layout | 相対座標指定の配置が可能 |
|Ⅰ| Absolute layout | 絶対座標指定の配置が可能 |
|Ⅱ| Relative layout | 相対座標指定の配置が可能 |
|Ⅲ| Linear layout | 縦/横 指定の配置が可能 |
|Ⅳ| Table layout | 表形式の配置の配置が可能 |
|Ⅴ| Frame layout | ビューの重ね合わせが可能 |
|| 他色々 ||
~
**Ⅰ.Absolute layout [#ye06868a]
・部品の配置を 【絶対座標】 で指定するレイアウト。~
・SDK1.5から非推奨となった。(恐らく画面サイズの異なる複数のデバイスに対応できない為)
・部品の配置を 【絶対座標】 で指定するレイアウト。~
・SDK1.5から非推奨となった。(恐らく画面サイズの異なる複数のデバイスに対応できない為)
~
&ref(absolute.gif,nolink); &ref(absolute2.gif,nolink);~
&ref(absolute.gif,nolink); &ref(absolute2.gif,nolink);~
~
***絶対座標の指定 [#kd3b4e95]
layout_x ~
layout_y ~
layout_x ~
layout_y ~
~
***部品の幅・高さ指定 [#rbcc265f]
layout_width~
layout_height~
fill_parentは最大サイズ。wrap_contentは最小サイズ
layout_width~
layout_height~
fill_parentは最大サイズ。wrap_contentは最小サイズ
~
~
**Ⅱ.Relative layout [#t95a1616]
相対的な位置指定をするレイアウト。また,上端や下端にレイアウトするといった指定を行うことも可能~
相対的な位置指定をするレイアウト。また,上端や下端にレイアウトするといった指定を行うことも可能~
~
&ref(relative.gif,nolink);&ref(relative2.gif,nolink);~
&ref(relative.gif,nolink);&ref(relative2.gif,nolink);~
「基準の位置を変更すれば、それに伴いほかのウィジェットも自動的に位置が調整できる」「斜めや円形にも配置が可能」というメリットがある一方、「気軽にウィジェットを追加・削除できない」という点や、「どのようにリレーションさせているかが自分でも分からなくなってしまう」という点がデメリット。
「基準の位置を変更すれば、それに伴いほかのウィジェットも自動的に位置が調整できる」「斜めや円形にも配置が可能」というメリットがある一方、~
「気軽にウィジェットを追加・削除できない」、「どのようにリレーションさせているか分からなくなってしまう」という点がデメリット。
~
~
**Ⅲ.Linear layout [#j52dd8c3]
Liner Layoutは、縦向きまたは横向きに一直線にウィジェットを並べるレイアウト
Liner Layoutは、縦向きまたは横向きに一直線にウィジェットを並べるレイアウト
&ref(liner.gif,nolink); &ref(liner2.gif,nolink);~
&ref(liner.gif,nolink); &ref(liner2.gif,nolink);~
~
~
**Ⅳ.Table layout [#w8af4a08]
表形式に並べるレイアウト
表形式に並べるレイアウト
&ref(tablelayout2.png,nolink); &ref(tablelayout.png,nolink);~
Outline 画面~
&ref(tablelayout2.png,nolink); &ref(tablelayout.png,nolink);~
Outline 画面~
~
~
ボタンのレイアウト~
http://www.javadrive.jp/android/xml_layout/index7.html
参考:ボタンのレイアウト~
http://www.javadrive.jp/android/xml_layout/index7.html
画面の作り方~
http://www.techfirm.co.jp/lab/android/view.html
参考:画面の作り方~
http://www.techfirm.co.jp/lab/android/view.html
参考:Android Developer~
http://www.techdoctranslator.com/android/guide/ui/declaring-layout
Android Developer~
http://www.techdoctranslator.com/android/guide/ui/declaring-layout
[[次世代創造機構>http://www.xn--rhq6sw9f0w7aevaf9ak89m.jp/android/androidLecture/GuiTutorial/GuiTutorial.html]]
[[参考:次世代創造機構>http://www.xn--rhq6sw9f0w7aevaf9ak89m.jp/android/androidLecture/GuiTutorial/GuiTutorial.html]]
~
~
**Ⅴ.Frame layout [#p1539b7e]
Frame Layoutは、Viewを重ねる時に利用しやすいレイアウト~
例えば、画像を重ねる際に利用できる。
~
&ref(FrameLayout01.gif,nolink); &ref(FrameLayout02.gif,nolink);~
Outline 画面~
~
~
~
*応用 [#x63c4c9f]
**半分半分 [#ycf583ce]
&ref(hanbun.png);
~
半分半分にするときは、LinearLayoutを用いてlayout_widthを0にして、weightを1とする
~
~
レイアウトのxml例
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:text="前へ"
android:id="@+id/Button01"
android:layout_height="wrap_content" >
</Button>
<Button
android:layout_width="0dip"
android:layout_weight="1"
android:text="次へ"
android:id="@+id/Button02"
android:layout_height="wrap_content"
android:layout_alignParentRight="true">
</Button>
</LinearLayout>
~
~
~
~
*Viewのプロパティ [#tcf6cd7d]
[[参考 - Android Wiki>http://wikiwiki.jp/android/?UI%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8%2FView]]
[[参考 - Android Wiki>http://wikiwiki.jp/android/?UI%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8%2FView]]
・nextFoxusDown - フォーカスが下方向に遷移した時の遷移先Viewを定義~
・padding - 上下左右のパディングを設定~
・scrollbarAlwaysDrawVerticalTrack - スクロールバーを表示するかどうか
・nextFoxusDown - フォーカスが下方向に遷移した時の遷移先Viewを定義~
・padding - 上下左右のパディングを設定~
・scrollbarAlwaysDrawVerticalTrack - スクロールバーを表示するかどうか
~
**ViewGroupのプロパティ [#tcf6cd7d]
[[参考 - Android Wiki>http://wikiwiki.jp/android/?UI%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8%2FViewGroup]]
[[参考 - Android Wiki>http://wikiwiki.jp/android/?UI%A5%B3%A5%F3%A5%DD%A1%BC%A5%CD%A5%F3%A5%C8%2FViewGroup]]
~
~
~
~
**表現単位 [#ya5409d4]
レイアウト指定で利用可能な単位~
レイアウト指定で利用可能な単位~
#style(class=table_left){{
|px| ピクセル|
|dp| 密度非依存ピクセル|
|sp| 倍率非依存ピクセル|
|mm| ミリメータ|
|pt| ポイント数|
|in| インチ|
~
~
~
~
*縦向きレイアウトと横向きレイアウト [#z4bb8c77]
横向き画面には、"Layout-land"用フォルダを用意する。
横向き画面には、"Layout-land"用フォルダを用意する。
#ref(layout-land.jpg,nolink);
~
//*その他 [#t9aed44b]
//リソースマネージャで各解像度毎のレイアウトを切り替えが出来 るよう
~
''[[戻る>Android]]''