Skyline渲染引擎
最热问题- 全部
- 文章
- 问答
- 全部
- 文章
- 问答
置顶Skyline渲染模式下，不支持css的媒体查询吗？
/* 正常屏幕尺寸时 */ .card-container { display: flex; justify-content: center; width: 750rpx; height: 66.62vh; flex-grow: 1; margin-top: 2vh; } .icon-container { display: flex; justify-content: center; align-items: center; width: 750rpx; } /* 屏幕高度小于667px时 */ @media screen and (max-height: 667px){ .card-container { transform-origin: 50% 25%; transform: scale(0.906); display: flex; justify-content: center; width: 750rpx; height: 1000rpx; margin-top: 5vh; flex-grow: 1; } .icon-container { display: flex; justify-content: center; align-items: center; width: 600rpx; } 出现的问题是： 当我加了@media之后，发现所有手机尺寸的，都按这个样式生效了。 也就是说，相当于 @media screen and (max-height: 667px)这个筛选条件，并没有生效。 是skyline渲染引擎中不支持吗？ 如果不支持的话，我应该怎么实现匹配不同屏幕的样式？
2024-04-26置顶在skyline模式下 Swiper的skyline特有属性不生效？
使用的是官方文档的Swiper 增强特性示例代码，基础库和客户端版本都是推荐以上。[图片][图片]
2024-07-10置顶skyline页面，开发者工具样式显示异常，模拟器无法正常显示元素，真机正常
[图片] 点击页面的【showDialog】按钮，正常逻辑是，会弹出dialog，但是在模拟器，弹窗元素被置为透明不显示，css样式正常，没有透明度为0的样式 真机显示正常 另外，相同的代码，切换到webview模式正常
2024-05-13置顶Skyline模式下，swiper组件worklet动画穿透到 scroll-view组件！！！
此为Skyline模式 在使用官方的 Tab指示条，swiper的swiper-item内使用了scroll-view组件。 当滑动scroll-view组件时，在安卓机内swiper的worklet动画会穿透到scroll-view组件当中。导致tab下方的下划线动画异常 [图片] 官方的Tab指示条源码地址：https://github.com/wechat-miniprogram/awesome-skyline/tree/main/examples/tab-indicator 这是我的scroll-view代码： 这段代码是写在 swiper-item内的，希望官方能给出临时解决方案 <scroll-view scroll-y style="width: 100%; height: 100%;" type="custom"> <grid-view type="masonry" cross-axis-count="{{2}}" cross-axis-gap="{{10}}" main-axis-gap="{{10}}"> <image wx:for="{{gridList}}" wx:key="index" style="width: 100%; height: {{100 * item.sub}}px" src="https://picsum.photos/200/{{100 * item.sub}}?random={{item.id}}" mode="aspectFill"></image> </grid-view> </scroll-view>
2024-03-20置顶skyline模式下wxss @import无效
在 app.wxss 全局样式中通过 @import 引入其他公用样式，在wxml中使用无效，将公用样式直接写在 app.wxss 后样式生效 不使用@import [图片] 使用@import [图片] webview模式下正常 [图片]
2024-06-05置顶Skyline 渲染模式下，input 触发 worklet:onscrollupdate ？
Skyline 渲染的页面中，input 输入内容过长时，会触发 scroll-view 的 worklet:onscrollupdate 事件 并且返回的 evt.detail.scrollTop 也是错误的
2024-04-14置顶skyline模式下 swiper 设置 duration 过渡时间不生效
skyline模式下 swiper 设置 duration 过渡时间不生效，webview模式下正常，请问是为啥？
2024-03-07置顶skyline渲染模式下为什么不支持css margin-inline-start 等属性？
今天第一次使用skyline引擎，但很快发现控制台警告我部分css 代码不被支持，比如：margin-inline-start，margin-inline-end,padding-inline-start,padding-inline-end 等[图片]
2024-03-06置顶Skyline 不支持image为svg吗？
[图片] svg 已经通过svgomg优化过代码； 比如 ``` <svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" class="icon" viewBox="0 0 1024 1024"><path fill="#3462AD" d="M597.333 768H768V546.133l-256-256-256 256V768h170.667V597.333h170.666V768zM896 554.667h-42.667v298.666H170.667V554.667H128l384-384 384 384z"/></svg> ```
2024-02-06置顶skyline引擎scroll-view，下拉刷新事件会触发触底事件？
[图片] 预期效果应该是下拉事件，重置列表数组为空数组，分页为1，然后重新请求数据第一页分页数据。而不应该触发触底事件，如果触发了触底事件，则会每次触发page + 1，分页数据就会出现问题。 开发者工具版本：1.06.2402030微信ios客户端 8.0.47 也能复现代码片段 https://developers.weixin.qq.com/s/JDJWaEmN7CP4
2024-03-13置顶Skyline 真机image无法正确渲染SVG？
真机：IPhone 14 Pro Max 基础库：3.4.10 表现异常的地方是：真机上image的mode=scaleToFill是无效的。 由于代码片段不支持skyline模式运行，请官方人员复制以下示例到skyline项目里运行看看。 <image style="width: 200px;height: 200px;background: #eee" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%3E%3Cpath%20fill%3D%22%233f4945%22%20d%3D%22M240-200h120v-240h240v240h120v-360L480-740%20240-560v360Zm-80%2080v-480l320-240%20320%20240v480H520v-240h-80v240H160Zm320-350Z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E"></image>
2024-07-06置顶swiper滚动，this.setdata 动态刷新无效，skyline模式下？
swiper滚动，this.setdata 动态刷新索引 current 无效，skyline模式下？ <swiper class="recommend" current="{{current}}" indicator-dots="{{indicatorDots}}" indicator-type="worm" scroll-with-animation="{{scrollWithAnimation}}" autoplay="{{autoplay}}" circular="{{circular}}" vertical="{{vertical}}" interval="{{interval}}" duration="{{duration}}" cache-extent="3" previous-margin="{{previousMargin}}px" next-margin="{{nextMargin}}px" display-multiple-items="{{multiItems}}" bind:change="onChange" bind:transition="onTransition" bind:animationfinish="onAnimationfinish" worklet:onscrollstart="onscrollstart" worklet:onscrollend="onscrollend"> <block wx:for="{{dateList}}" wx:key="*this"> <swiper-item> <view>{{item}}</view> </swiper-item> </block> </swiper> data: { current:0 } onLoad(options) { this.setData({ current: 8 }) } 必现错误
2024-05-28置顶Skyline下 image无法使用云文件id加载svg
[图片] “剩余”前面是有一个svg图片的，我把“已存”前面的svg转成png就能显示 [图片]
2024-03-18置顶skyline渲染image组件
在开发工具中显示image是正常的，到了真机上就不显示了。图片链接是https地址。在webview 渲染下这个地址真机上也是正常的，浏览器也能访问到。就就是在skyline渲染下，真机出现了不显示问题？有没有大佬知道是什么情况吗？skyline渲染下会要求https需要什么特殊的协议吗？下图一个是在开发工具上的显示，一个是在手机上的显示。[图片][图片]
2024-10-17置顶微信小程序 skyline 模式下, 覆盖不了 Vant 组件的 样式?
skyline 模式下修改没有反应, 把 [图片][图片][图片] 把 sky渲染调试 去掉. 又可以... [图片]
2024-03-14置顶Skyline渲染模式下:nth-child选择器失效
Skyline渲染模式下:nth-child选择器失效，在开发者工具中表现正常，iOS真机为所有元素都加上了该样式
2024-09-20置顶input placeholder不居中？
input 设置height: 100% 也确实高度是22.4，但鼠标房东编辑器input组件里面还有个#input高度15，这可能就是placeholder不居中。 [图片][图片] 真机 oppo手机出现文字显示不全 [图片] 麻烦能不能把这种基础表单组件兼容性做好一点，基础的东西太说不过去了
2024-04-26置顶skyline模式下tabBar页面share-element下worklet:onframe失效？
<share-element key="se-key{{index}}" rect-tween-type="cubic-bezier(0.4, 0.0, 0.2, 1.0)" worklet:onframe="handleFrame" transition-on-gesture="{{true}}" style="width: 100%; height: 100%;">
2024-04-28置顶skyline 模式下input 高度调不了？
webview 模式都正常，转到Skyline 下就不好用了， 还有下面在webview 运行正常，skyline 也是报错了。 let query = this.createSelectorQuery(); console.log(query) query.select('#the-id').boundingClientRect(); 兼容性问题太严重了，之前运行好好代码，升级到skyline 都不好用了。
2024-05-08置顶skyline模式下，点击事件怎么无效了呀？
一个组件里的，赋予view的bindtap事件点击不了了，有大佬知道是咋回事呀？ 普通页面的view的bindtap也是点不了，求救 [图片][图片]
2024-05-22
小程序示例
交互动画 tab
media query 暂时还不支持。 可以先这样来做：
在 js 侧获取屏幕尺寸，然后 setData 给 wxml。 可以借助 less / sass 来简化 wxss
<view class="{{ largeScreen ? 'large' : 'small' }}"> <view class="foo"></view> </view> // wxss .large .foo { } .normal .foo { }