一键报警练习

今天练习完成一键报警页面。其中主要遇到两个问题:

1.在引用本地图片设置页面背景时,在pc端调试的时候已经可以看到出现背景图片了,但是在真机调试的时候却发现没有背景图片,这是小程序的一个bug,所以通过百度总结了几种解决方法。

解决方法一:在使用背景图片的时候用网络图片,就是用外链的形式,比如你将这张图片放到你的服务器,如:https://xxxx/xxx.jpg;

解决方法二:将背景图片使用编码base64进行转换,可以在这个网址进行http://tool.css-js.com/base64.html 转换,如:background-image: url("转换后得到的编码文本"),如果多次使用的话可以将该值设置为全局变量,再在js文件进行引用即可;

解决方法三:使用image组件而去掉背景图片;

我使用的就是第二种方法,将图片转换后再引用。

2.由于pc上没有下载ps软件,所以不能直接ps一张理想的图片作为报警icon,(这其实是一种十分简便的自定义button样式的方法)。所以只能通过wxss样式来改变button。为了将button变成圆形的样式,新学会了一种方法,即把border-radius的值设置成50%。

报警功能效果图

在此基础上,后续还要完善当点击拨打电话的同时,还要实现获取位置信息并返回至后台的功能。

你可能感兴趣的:(一键报警练习)