主要实现功能
|
page{ height:100%; }.play{ height: 100%; display:-webkit-box; -webkit-box-orient: vertical; } |
.songname{ text-align: center; height: 100rpx; line-height: 100rpx; } |
.lyrics{ box-flex:1; -webkit-box-flex:1; text-align: center; width: 100%; }.progress{ height: 76rpx; display: flex; } .controls{ height: 200rpx; line-height: 200rpx; display:flex; } |
用的display:box就好用了。主要是垂直两头固定,中间自适应。
后来在群里看到是因为更新把page的高度百分百去掉了。
播放问题解决了,获取播放进度,然后用seek加上就行了,要注意获取播放进度一定要播放着歌曲才能获得,
我播放进度条是slider这个微信封装的组件,然后通过计时器,不断的更改playTime,把它填到slider的value里就实现了,
现在要做的是,有个时间进度,估计也会用到计时器,写在那里就好了,还要format下时间,在util里写就好了,方便以后调用,现在不想写,看会书,听会音乐。
2016.10.14
今天没什么活,可以尽情开发了,新建了一个user页,可以展示我的歌单列表。还包括下载音乐,最近播放。花了一上午把页面基本架构搭建出来,下一步写js。完善功能。
利用接口数据缓存 wx.getStorageSync(KEY) wx.setStorage(OBJECT) 这个分同步异步,看你需要,解决了如果点击相同音乐的话,就不会重新播放,而是继续播放
2016.10.17今天想写一个动画,点击我的歌单,下滑出来一堆歌单,简单的试了一下,很容易的出现了效果。但是现在遇到了一个问题,有关于数据存储,少量数据可以调用官方api,但是大量
的数据或者我想保存的用户信息如何访问我外界的数据库存起来呢。这个问题真的怎么搜也搜不到。
https://www.qcloud.com/doc/product/448/6404 还没来及看,貌似能解释上诉问题,
2016.10.18
今天遇到了target和currentTarget的坑,我想在“更多”【。。。】就是这个图片的单击事件中传入歌曲的id,俺的wxml结构是这样的
<block wx:for="{{music}}"> <view class="cell" bindtap="handleCell" data-id="{{index}}"> <view class="info"> <view class="name">{{item.name}}</view> <view class="author">{{item.author}}</view> </view> <view class="more" catchtap="handleMore" data-id="{{index}}"> <image style="width:100%; height: 100%;" src="resources/more.png"></image> </view> </view> </block> |
<action-sheet hidden="{{actionSheetHidden}}" bindchange="actionSheetChange"> <action-sheet-item class="item" bindtap="bindItemTap" data-currid="{{currentid}}">收藏到歌单</action-sheet-item> <action-sheet-item class="item" bindtap="bindItemTap" data-currid="{{currentid}}">下载</action-sheet-item> <action-sheet-item class="item" bindtap="bindItemTap" data-currid="{{currentid}}">分享</action-sheet-item> <action-sheet-cancel class="cancel">取消</action-sheet-cancel> |
</action-sheet>
我单击更多并得不到index,我用的是e.target.dataset,最后我改成 e.currentTarget.dataset 就好使了,也是碰到了死耗子,我并没有事先懂得原理改的,
而是碰巧试出来的,仔细想了一下,原来我点的是image,冒泡到view接收到了。新技能get。。。。
小坑:action-sheet放入block中直接给currid传index不就好了,非得那么麻烦。实则不然,牵一发动全身的hidden属性。我开始设想用数组来改变,遇到了一堆坑,我退却了,这么麻烦
肯定不是最优解。学会放弃,save time。
2016.10.19
今天开发的是添加新歌单这个功能,逻辑比较复杂。多思考就解决了。因为没有连外界,所以用的是本地存储存歌单。。。。对于{}判断有没有值学习到了。
然后写了把歌曲添加到歌单,今天至今没遇到坑。
2016.10.20
歌单详细列表的开发完毕。request接口并不知道去请求谁,一开始就打算的是本地的,但是还是想连上其他资源的。整的没有动力了,开发完也是个单机小demo,一点也不高大上。哎~~~~
prev遇到问题,不知是我逻辑错误还是相同url的问题,歌曲总是不重头播,好像播放了很多背景音乐
2016.10.24
大家程序员节快乐,可惜是苦逼的周一,今天学习到了动态删除对象中的属性。在我做歌单删除功能时遇到的。
var objtest = { prop: 'delete me' }; //或者这么声明的对象 var objtest = new Array(); objtest['prop'] = 'delete me'; //删除属性'prop': delete objtest.prop; //或者 delete objtest['prop']; //还可以删除任意变量 var numb = 17; delete numb; |