YouTube

Got a YouTube account?

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

Chinese, Simplified subtitles

← Coding the Details Screen - Developing Android Apps

Get Embed Code
6 Languages

Showing Revision 8 created 07/04/2016 by Udacity Robot.

  1. 你是如何将 UI 拆分成更小的组件的?
  2. 你可能想到将其分为两列
  3. 但是这样就很难将元素放到这里
  4. 你可以在屏幕的高度范围内将它们居中垂直放置
  5. 但这样就无法与左侧气温视图
  6. 对齐了
  7. 相反 这样看起来更像水平线性布局
  8. 而剩余的元素可以通过垂直线性布局
  9. 进行布置
  10. 垂直线性布局包含六个子元素
  11. 第三个元素是水平线性布局 由两个子元素组成
  12. 第一个是一个垂直线性布局 包含两个文本视图
  13. 第二个则是另外一个垂直线性布局
  14. 由这两个元素组成
  15. 为使整个屏幕中的内容可以垂直滚动
  16. 我们将其放置在一个滚动视图中
  17. 在此处没有必要使用列表视图 因为我们不需要无限扩展
  18. 条目数量 而且不需要重复循环
  19. 屏幕上的字段数量是固定的
  20. 因此滚动视图是最佳选择
  21. 我可以向大家展示我们是如何实施 fragment_detail.XML 布局的
  22. 我们对布局中的某些数据进行了硬编码
  23. 使其在“设计”窗格中以预览形式呈现
  24. 在视图层级的根部是 ScrollView
  25. ScrollView 最多仅可拥有一个子元素
  26. 因此我们将其设置为垂直 LinearLayout
  27. 在该布局内 我们的 TextView 会依次显示一周的某天、
  28. 日历日期以及水平线性布局
  29. 接下来是湿度文本视图、
  30. 风力文本视图和气压文本视图
  31. 在 XMO 代码中 我们看到了此子线性布局滚动视图
  32. 我们将内边距设为 16 dip
  33. 这样内容就不会超出屏幕边缘了
  34. 然后是文本视图 之后是水平线性布局
  35. 我们将 Layout_marginTop 指定为 16 dip
  36. 使其与该文本视图底部隔开更多空间
  37. 在该水平线性布局中 我们设置了一个垂直线性布局
  38. 该布局的宽度为 0 权重为 1
  39. 另一个线性布局也是宽度为 0 权重为 1
  40. 也就是说 这两个子布局宽度相等
  41. 对于该线性布局 我们将重力方向指定为水平居中
  42. 也就是说 该布局中的内容采用水平居中的对齐方式
  43. 包括图标和天气预报文本视图
  44. 最后这些是其他天气详情的剩余文本视图
  45. 布局正常显示后 我们会更新 DetailFragment
  46. 此时 我们也会将其放入其本身的文件中
  47. 在 onLoadFinished 方法中
  48. 过去 我们常常通过调用 findViewById 方法来查找视图
  49. 现在 DetailFragment 提供了更多的视图
  50. 我们不想再继续在此添加更多的 findViewById 调用了
  51. 因为每次加载器刷新时
  52. 它都要遍历视图层级
  53. 我们修改了 onCreateView 方法
  54. Fragment 扩充后 我们便可
  55. 继续查找之后需要的所有视图的引用
  56. 我们将这些视图存储为类的成员变量
  57. 这也是名称以字母 m 开头的原因
  58. 在 onCreateLoader 方法中 我们确保内容提供器查询的
  59. Projection 包含所有必需的信息
  60. 这在文件顶部已得到声明
  61. 将其称作天气预报列之前
  62. 我们先将其重命名为详情列
  63. 而且我们还添加了更多列 因为我们现在
  64. 要在屏幕上显示更多信息
  65. 然后 在 onLoadFinished 方法中 我们获得了包含所需数据的光标
  66. 我们从光标中读取天气状况 ID
  67. 因为我们需要通过该 ID 来确定要显示的图片
  68. 但现在 我们可以使用占位符图标
  69. 我们继续从光标中读取日期、说明和
  70. 其他字段
  71. 要为用户正确地设置数据格式 我们还从 Gist 中复制了
  72. 字符串和工具方法