第七天学习日志

制作天气页面

一、获取城市地址

1. 在这个服务器中无法通过IP地址来获取城市的定位，所以可以用腾讯位置服务获取经纬度的方法来获取城市的位置

2.先在.js文件里面引入SDK核心类、实例化API核心类，再用微信小程序自带的getlocation的方法获取经纬度

3.然后进行逆向地址解析（坐标位置描述）

reverseGeocoder(options:Object)：本接口提供由坐标到坐标所在位置的文字描述的转换，输入坐标返回地理位置信息和附近poi列表，坐标系采用gcj02坐标系，其属性有：

（1）location：位置坐标

（2）coord_type：输入的locations的坐标类型，可选值为[1,6]之间的整数，每个数字代表的类型说明： 1 GPS坐标；2 sogou经纬度；3 baidu经纬度；4 mapbar经纬度；5 [默认]腾讯、google、高德坐标；6 sogou墨卡托

（3）get_poi：是否返回周边POI列表：1.返回；0不返回(默认)

（4）poi_options：用于控制Poi列表

（5）sig：签名校验

4.然后当在搜索框输入城市名字时调用finish方法，通过搜索框的e.detail.value获取查询城市的天气

二、完善数据

（一）七日天气的获取

1.用横向滚动来展现

2.scroll-view：可滚动视图区域，使用竖向滚动时，需要给scroll-view一个固定高度，通过 WXSS 设置 height，其属性有：

（1）scroll-x:允许横向滚动

（2）scroll-y：允许纵向滚动

（3）upper-threshold：距顶部/左边多远时，触发 scrolltoupper 事件

（4）lower-threshold：距底部/右边多远时，触发 scrolltolower 事件

（5）scroll-top：设置竖向滚动条位置

（6）scroll-left：设置横向滚动条位置

（7）scroll-into-view：值应为某子元素id（id不能以数字开头），设置哪个方向可滚动，则在哪个方向滚动到该元素

（8）scroll-with-animation：在设置滚动条位置时使用动画过渡

（9）enable-back-to-top：iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向

（10）bindscrolltoupper：滚动到顶部/左边时触发

（11）bindscrolltolower：滚动到底部/右边时触发

（12）bindscroll：滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}

3.横向滚动图的样式

（1）整个大的横向滚动图用white-space: nowrap;来规定段落中的文本不进行换行以便进行横向滚动

（2）滚定图里面的每一项设置宽、高和行内块元素

（3）然后在滚动图里面加数据