YouTube

Got a YouTube account?

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

Chinese, Simplified subtitles

← Width and Height

Get Embed Code
14 Languages

Showing Revision 4 created 09/28/2016 by Udacity Robot.

  1. 我们已经为派对写好了一个客户列表
  2. 等等 这是生日派对的列表 对吗 Catherine?
  3. 我真希望自己在列表里
  4. 我们来看看吧
  5. 我感觉它很小
  6. 说到小的话
  7. 我们讨论一下在屏幕上视图的尺寸
  8. 我们使用固定的高度值 就是 dp 对吗?
  9. 宽和高
  10. 我们也可以在视图中设置 wrap_content
  11. 对 一种奇怪的说法 这个视图将会根据
  12. 内容的多少来改变大小
  13. 内容变大
  14. 视图变大 内容变小 视图会变小
  15. 还有第三个 叫做 match parent
  16. 看起来有点奇怪
  17. 听起来像是给单身父母的相亲网站
  18. 并不是这样的
  19. Match parent 的意思是这个视图和它的父视图等宽或等高
  20. 也就是说
  21. 我是视图 我有一个父视图 我的宽和高
  22. 与我的父视图一样
  23. 确实 这是总结
  24. 你设置的一系列视图的不同值就是宽度
  25. 宽和高的固定单位是 dp
  26. 对 你也可以设成 wrap_content
  27. 下一个我们要尝试的是
  28. match_parent
  29. 这有一些关于如何在线性布局中设置子视图中不同宽
  30. 能影响最后的用户界面的例子
  31. 在示例中 我们设置每一个子视图的宽度为固定值 200dp
  32. 如果每个视图中的内容大于 200dp
  33. 你会有缺少某些内容的风险 像这样
  34. 在这个例子中 我们设置子视图的宽度为 wrap_content
  35. 现在所有的内容都显示出来了 但是
  36. 每个视图的宽度都是根据它里面的内容来改变的
  37. 在这个例子中 我们设置子视图的宽度为 match_parent
  38. 现在你能看到子视图的宽度和父 ViewGroup 的宽度一样
  39. 不管它里面的内容是什么
  40. 这些值同样适用于视图的高度
  41. 在示例中 我们设置每一个子视图的高度为固定值 200 dp
  42. 如果它的内容比这个高度值大
  43. 你就有缺少某些内容的风险
  44. 在这个示例中 我们设置子视图的高度为 wrap_content
  45. 所有的内容都会显示在屏幕上
  46. 而且不会有缺少的内容 因为 TextView 的大小
  47. 取决于里面内容
  48. 在这个示例中 我们设置子视图的高度为 match_parent
  49. 这种方式的话 子视图就会和父视图一样高
  50. 不管里面的内容是什么
  51. 现在我们打开 XML可视化工具
  52. 试试父视图中的代码
  53. 我们给你一个有起始代码的 XML 可视化工具的链接
  54. 在讲师注释下面
  55. 在这个例子中 LinearLayout 是这个布局的根视图
  56. 它是第一个和最外面的视图
  57. 如果我们把根视图的宽和高都设为 match_parent
  58. 并且我们把它设为应用的主要布局
  59. 这个线性布局和设备屏幕的大小是一样的
  60. 我给你展示一下设置线性布局的背景
  61. 为不透明颜色
  62. 如果在线性布局中 将背景设为灰色
  63. 然后你会看到 灰色延伸满整个设备屏幕
  64. 现在 如果我将这些视图的的宽和高
  65. 改为 match_parent 会发生什么?
  66. 为了使每个视图的边界更清晰
  67. 我会给每个视图设置一个背景颜色
  68. 现在 我将这个 TextView 的高设为 match_parent
  69. 顺便 你拼写一下 match_parent
  70. 你会看到这个 TextView 占据这个父视图的全部高度
  71. 不幸的是 它将屏幕上的其他东西都掩盖
  72. 我们不想这样
  73. 我们将它改回 wrap_content
  74. 我们将宽改为 match_parent 来看看它是什么样子
  75. 现在 TextView 的宽度和父视图一样
  76. 也就是说 和设备屏幕一样宽
  77. 如果我将其他的 TextView 也改为 match_parent
  78. 你会看到它也开始占据父视图的整个宽度
  79. 我想指出的还有一件事
  80. 每次你看到一个以 layout_ 开始的属性
  81. 像 layout_height 或者 layout_weight 它们实际上是 ViewGroup 的布局参数
  82. 父视图使用它们来决定
  83. 这些视图的大小和位置
  84. 同时 其他的属性 像背景 文字大小和文本
  85. 是由 TextView 就自己本身的样式来操作的
  86. 但是视图组参数是由父视图来操作的
  87. 现在 该你尝试设置不同的宽和高的值了
  88. 起始代码的 XML 可视化工具的链接
  89. 在教学笔记下面
  90. 试着改变每个 TextView 的宽和高的值
  91. 你可以设置固定 dp 值 wrap_content 或 match_parent
  92. 记住对于每个视图 当你做的时候 宽和高的值不必相称
  93. 点击这个复选框继续