找一个 我这样的背景[图片] [图片]
自定义tabbar中间凸起部分的圆弧怎么做出来?[图片][图片] 自定义的tabbar,中间凸起部分的圆弧怎么做出来?如图二是想要实现的效果,图一中红色框的圆弧要怎么实现? wxml代码 <view class="tab-bar"> <view class="tab-bar-border"></view> <view class="tab-bar-item" wx:for="{{selectList}}" wx:key="index" data-index="{{index}}" data-path="{{item.pagePath}}" data-selected="{{item.selected}}" bindtap="onwidthTap"> <image class="cover-image" src="{{selected === item.selected ? item.selectedIconPath : item.iconPath}}"></image> <view class="cover-view" style="color:{{selected === item.selected ? selectedColor : color}}">{{item.text}}</view> </view> </view> <view class="indicator"> <view class="indicator-border"></view> <view class="indicator-item"> <image class="indicator-image" src="/images/jia.png"></image> </view> <view class="indicator-item-text">发布</view> </view> wxss代码 .tab-bar { position: fixed; bottom: 0; left: 0; right: 0; height: 120rpx; background-color: white; display: flex; padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 0 5rpx 0 rgba(0, 0, 0, 0.33); } .tab-bar-item { flex: 1; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; } .cover-image { margin-bottom: 40rpx; width: 44rpx; height: 44rpx; } .tab-bar-item .cover-view { font-size: 34rpx; position: absolute; bottom: 10rpx; color: #7A7E83; } .indicator { height: 70rpx; display: flex; flex-direction: column; align-items: center; } .indicator-border { position: absolute; left: 50%; top: -50rpx; transform: translate(-50%, -50%); border-radius: 50%; width: 80rpx; height: 80rpx; border: 7px solid #fff; box-shadow: 0 0 5rpx 0 rgba(0, 0, 0, 0.33); z-index: -1; } .indicator-item { position: absolute; left: 50%; top: -50rpx; transform: translate(-50%, -50%); background: #ff9f7f; border-radius: 50%; width: 80rpx; height: 80rpx; display: flex; flex-direction: column; justify-content: space-between; align-items: center; border: 7px solid #fff; z-index: 1; } .indicator-image { width: 80rpx; height: 80rpx; border-radius: 50%; } .indicator-item-text { font-size: 34rpx; z-index: 1; color: #7A7E83; position: absolute; bottom: 10rpx; }
星期三 10:43用自定义顶部导航栏,可以全局配置或单独需要的页面配置 全局"navigationStyle": "custom" [图片] 按需"navigationStyle": "custom" [图片] [图片]
顶部导航栏增加一个背景图片设置?现在小程序只有设置顶部导航栏的颜色,什么时候能增加一个设置顶部导航栏背景图片就好了,现在通过自定义顶部导航栏来实现,太麻烦
04-03<web-view> 的 ref 无法直接获取
给web-view设置了ref,但是无法获取到ref里面的值?<template> <view> <web-view ref="webDiv" src="https://www.baidu.com"></web-view> <audio ref="audiod" style="text-align: left" src="https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3" controls></audio> <image ref="asda3434333" style="width: 200px; height: 200px; background-color: #eeeeee;" src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg"></image> </view> </template> <script> export default { data() { return { title: 'Hello' } }, onLoad() { console.log(this.$refs.audiod) console.log(this) }, mounted() { // 也可以在 mounted 生命周期里获取引用 console.log(this.$refs.audiod) console.log(this) }, methods: { // webview向外部发送消息 handlePostMessage: function(data) { console.log("接收到消息:" + JSON.stringify(data.detail)); }, // 调用 webview 内部逻辑 evalJs: function() { this.$refs.webview.evalJs("document.body.style.background ='#00FF00'"); } } } </script> <style> </style>
03-28用腾讯地图的逆地址解析 https://https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/methodReverseGeocoder 使用案例: var QQMapWX = require('../../static/js/qqmap-wx-jssdk.min'); var qqmapsdk; Page({ onLoad: function () { // 实例化API核心类 qqmapsdk = new QQMapWX({ key: '申请的key' }); }, onShow: function () { let that = this wx.getLocation({ type: "gcj02", success(res) { that.reverseGeocoder(res.latitude,res.longitude) }, fail(err) { console.log(11111111); wx.hideLoading(); wx.showToast({ title: '定位失败', icon: 'none', duration: 1500 }) self.setData({ lastPage: false, isRefreshing: false }) } }) }, reverseGeocoder(lat, lng) { let that = this qqmapsdk.reverseGeocoder({ location: { latitude: lat, longitude: lng }, success: function (res) { //成功后的回调 console.log('reverseGeocoder:', res); that.setData({ }) }, fail: function (error) { console.error(error); }, complete: function (res) { console.log(res); } }) }, }) [图片]
小程序定位只能拿到经纬度吗?可以拿到地理信息不?我想拿到当前定位经纬度和地址描述 除了经纬度还需要 xxx路xx号 或者 xxx小区南门 或者xxx地铁站 怎么拿到详细信息呢?只能服务端用api解析吗?
03-04getLocation() { let that = this; wx.showLoading({ title: '正在获取当前位置...', mask: true, }); wx.getLocation({ type: 'wgs84', // 坐标类型 success: (res) => { console.log('位置信息', res); const { latitude, longitude } = res; this.setData({ location: { latitude, longitude }, // 更新页面数据 }); wx.showToast({ title: '位置获取成功', icon: 'success', }); wx.hideLoading(); }, fail: (err) => { console.error('获取位置失败', err); wx.showToast({ title: '无法获取位置,请检查权限或网络', icon: 'none', }); // 如果用户拒绝授权,引导用户开启权限 wx.getSetting({ success(res) { if (!res.authSetting['scope.userLocation']) { wx.showModal({ title: '授权提示', content: '定位失败,是否开启定位权限?', confirmText: '去开启', success(modalRes) { if (modalRes.confirm) { wx.openSetting({ success() { // 重新发起定位 that.getLocation(); }, }); } }, }); } }, }); }, }); },
公众号网页开发,如何在本地调试中调用wx.config接口?并使用wx.getLoaction方法?如何在本地调试中调用wx.config接口?并使用wx.getLoaction方法?
02-28参考这个文章可以申请成功,我之前申请很多次都没有成功,我参考这个审核通过了 https://blog.csdn.net/liuqinrui520/article/details/136702532
getLocation审核一直不通过?appId: wx0293b252425a6786 小程序主要面向企业内部员工,需要查看内部门店位置并前往,扫码需要拿到用户附近门店正在进行的活动。审核一直不通过,具体需要怎么做
02-19profitSharing的参数不是true或false吗,还有使用这个,你开通分账没有
微信统一下单添加"profitSharing":"Y"就会出现调起支付JSAPI缺少参数怎么解决?微信统一下单添加"profitSharing":"Y"就会出现调起支付JSAPI缺少参数:total_fee,这是啥问题 [图片]
02-19不可以
H5页面是否可以调用 微信运动的wx.getWeRunData()接口?公司期望能在H5页面获取到微信用户的微信运动步数,不知道是否可以直接在H5中调用而不是小程序中获取。
02-19什么意思,是文章修改之后,点进去没有变化吗
公众号编辑栏?公众号编辑栏的字号跟缩进怎么点击了文章的字体还是没有改变?
02-19这个你只能联系他们客服问问 [图片]
请问我的小程序为什么没有图二那么完整?没有会员积分,付款,店铺介绍,也没有商家动态功能。 [图片] [图片] [图片] [图片]
02-14