在使用Towify制作小程序时，如何进行外边距的设置？

间距设置菜单用于调节组件之间的距离。您可以分别设置内外边距调节组件间距离，或组件内部元素到边框的距离。

外边距

margin属性用于设置外边距。 margin就是控制盒子和盒子之纯卖间的距离。

在Towify编辑器中，外间距设置可以改变组件间的距离，这里的外边距设置的是当前选中租价与父级元素的距离。

您可历裤败以在边距设置菜单中，选择上下左右任意外边距进行设置，外边距可以设置px，%（百分比），auto（自适应），以及unset（不做设置）四种。

当您对应的左右外边距，或者上下外边距都设置了自适应时，组件会在父级元素中水平居中，或者垂直居中。

外边距的调节有三种方式，您可以直接拉动数值滑块，设置外边距。

或者在数值条右肢颤侧的输入框直接输入对应数值。

若您选择单位为%（百分比），即相应的左右边距距离为父级元素宽度的百分比，上下距离为父级元素高度的百分比。

您也可以直接选择为您提前预设的外边距选项。

外边距可以进行重置，恢复到初始值。

微信小程序距离显示可以使用地理位置API来获取用户的经纬度，然后通过计算两点之间的距离来实现距离的显示。具体的实现方法如下升慧：

1. 首先，在微信答桐小程序的开发工具中，引入地理位置API，在app.json中添加"permission": { "scope.userLocation": { "desc": "你的吵举答位置信息将用于小程序位置接口的效果展示" } }，这样就可以在小程序中使用地理位置API了。

2. 接着，在小程序中调用wx.getLocation()方法来获取用户的经纬度，并将获取到的经纬度传入自定义函数中，用来计算两点之间的距离。

3. 最后，根据计算出来的距离，在小程序中显示出来。如果要显示未知的距离，可以在显示的时候添加一句“未知”，来表示距离未知。

对于iOS或者安卓同学来说，可能会觉得特别简单吧。OC里就有原生类CLLocation计算坐标点距离。当然，大多数时候我们都是直接使用第三方计算，比如百度SDK。

但是接触到微信小程序后，由于可能刚起步，许多API并不完善。像百度SDK关于微信小程序的就没有提供这样的接口去计算。 百度地图微信小程序JS API

仔细翻一番看看，在开发指南->获取地图数据 菜单下只看到4个最基本的功能（POI检索、POI检索热词联想、逆地址解析、天气查询），并没有看到关于计算距离的。看到这些还好，至少不会继续下去入坑了。

后来我就度娘了，第一条检索就是腾讯地图开放平台的内容。这也是为什么今天我要写这篇文章的原因，我入坑了。友情提示，使用腾讯地图确实可以计算两坐标距离，但是呢？只能是10km以内的距离。不然调用后返握帆回结果： status: 373, message: "起终点距离超长"

如果不在意只是10km以内距离的话，想要去集成腾讯地图SDK，文档在此  腾讯地图微信小程序JavaScript SDK

最终解决方案只能自段哪雹己算了，不用第三方了。

//计算两坐标点之间的距离

  getDistance: function (lat1, lng1, lat2, lng2) {

    lat1 = lat1 || 0

   缓首 lng1 = lng1 || 0

    lat2 = lat2 || 0

    lng2 = lng2 || 0

    var rad1 = lat1 * Math.PI / 180.0

    var rad2 = lat2 * Math.PI / 180.0

    var a = rad1 - rad2

    var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0

    var r = 6378137

    return (r * 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(rad1) * Math.cos(rad2) * Math.pow(Math.sin(b / 2), 2)))).toFixed(0)

  },

需要注意的是，该方法返回单位为米，如果想要转换成公里，除以1000即可。

---