YouTube

Got a YouTube account?

New: enable viewer-created translations and captions on your YouTube channel!

Japanese subtitles

← Width and Height

Get Embed Code
14 Languages

Showing Revision 3 created 10/04/2015 by Retired user.

  1. これまでパーティのお客リストを
    作ってきました
  2. - 誕生パーティ用のお客リストだね?
    - ええ
  3. 僕がリストに入ってるといいけど
  4. それは後で分かるわ
  5. 肩身が狭いなぁ
  6. 狭いと言えば
  7. 画面のビューのサイズの話をしましょう
  8. 固定の高さを使ったね
    dp だね
  9. ええ 幅と高さよ
  10. ビューに wrap_content も設定できるわ
  11. それは変な言い方だね
  12. ビューがコンテンツを包み込むって
  13. じゃコンテンツが大きくなれば
    ビューも大きくなり

  14. コンテンツが小さくなれば
    ビューも小さくなる
  15. 実は第3に match_parent というのもあるの
  16. それはちょっと変だね
  17. 片親たちの出会い系サイトみたいだ
  18. そうでもないわ
  19. match_parent の意味はビューの幅又は
    高さが親と同じになることよ
  20. じゃ分かる
  21. 僕はビューで 親がいて
  22. 僕の幅と高さが親と同じになるんだ
  23. その通りよ まとめると
  24. ビューのサイズに設定できる
    様々な値は 幅です
  25. 幅と高さの固定dp
  26. wrap_content もできる
  27. 次に試すのは
  28. match_parent です
  29. ここではいくつか例をあげ
    リニアレイアウトの子ビューに
  30. 色々な値を設定して
    最後のUI にどう影響するか見ましょう
  31. この例では各子ビューに
    200 dp の固定幅を設定します
  32. 各ビュー内のコンテンツが
    200 dp を超えると
  33. こんな風にコンテンツがいくらか
    切れる危険があります
  34. この例では各子ビューに
    幅の wrap_content を設定しました
  35. すると全コンテンツが表示されますが
  36. 各ビューの幅が その中のものに基づいて
    変わります
  37. この例では各子ビューの幅を
    match_ parent に設定しました
  38. 今度は各子どもの幅は
  39. その中のコンテンツに関わりなく
    親のビューグループと同じ幅になります
  40. それらの同じ値は各ビューの高さにも
    適用できます
  41. この例では この子テキストビューの
    高さを200 dp に設定しました
  42. その中のコンテンツがそれより高ければ
  43. コンテンツがいくらか切れる危険があります
  44. この例では子テキストビューの高さを
    wrap_content に設定しました
  45. こうすると画面に全コンテンツが表示されー
  46. 何も切れないでしょう
    なぜならテキストビューのサイズは
  47. その内部のコンテンツに依るからです
  48. この例では 子テキストビューの高さを
    match_parentに設定しました
  49. そうすると子ビューは
  50. その中のコンテンツに関わりなく
    親自身と同じ高さです
  51. では XML visualizer を開きー
  52. コードにある私達の親に
    もっと近づけなさい
  53. スターターコード付 XML Visualizer への
    リンクを
  54. 下の講師ノートにあげておきます
  55. この場合 リニアレイアウトは
    このレイアウトのルートビューです
  56. それは最初で最外部のビューだからです
  57. このルートビューの幅と高さに
    match_parent を設定しー
  58. これをアプリのメインレイアウトに設定すると
  59. このレイアウトは端末画面と
    同じ高さと幅になります
  60. このリニアレイアウトの背景を
    不透明色に設定して
  61. お見せしましょう
  62. このリニアレイアウトの背景を灰色に
    設定すると
  63. 灰色が端末の幅と高さのいっぱいに
    広がるのが分かります
  64. これらのテキストビューの幅か
    高さを match_parent に変えると
  65. どうなるでしょう?
  66. 各ビューの境界がはっきりするようにー
  67. ビューの各々に背景色を設定しますね
  68. ではこのテキストビューの高さを
    match_parent に変えます
  69. ところでmatch_parentと綴りなさい
  70. 今度はこのテキストビューが親の高さ
    いっぱいを占めるのがわかります
  71. 残念ながら これは他の全てを画面から
    押し出すので
  72. これは望みませんね
  73. だから wrap_ content に戻しましょう
  74. では 今度は幅をmatch_parent にして
    どうなるか見ましょう
  75. 今度は テキストビューの幅は
    親と同じ幅になり 同様に
  76. 端末画面と同じ幅になります
  77. 他のテキストビューも
    match_parent に変えると
  78. 親の幅いっぱいを占めて行くのがわかります
  79. もう一つ指摘しておきましょう
  80. layout_heightとかlayout_ widthのように
    毎回レイアウト下線で始まる属性を見ます
  81. これらは実はビューグループレイアウト
    パラメータです
  82. これらは親ビューグループに使われー
  83. これらのビューのサイズと位置を
    決めます
  84. 一方 背景 テキストサイズ
    テキストのような他の属性は
  85. それ自身のビューをスタイルする
    テキストビューによって処理されます
  86. しかしこれらのビューグループレイアウト
    パラメータは親によって処理されます
  87. では 様々な幅と高さの値にする
    あなたの番です
  88. スターターコード付きXML Visualizerへの
    リンクは
  89. 下の講師ノートを参照しなさい
  90. 各テキストビューの幅と高さの値を
    変えなさい
  91. 固定 dp 値か wrap-contentか
    match_parent を設定できます
  92. 各ビューで 幅と高さの値は一致する必要は
    ありません
  93. 終わったら
    ボックスにチェックして次へ行きなさい