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模式下，全局样式在组件内部无效呢？
[图片] 如上图， Skyline模式下， 在组件内的 flex 和 items-center 样式，不起作用。 直接把组件内的代码放到页面就没问题。 ------------------------------------------------------------------------------------ 我是用的Uniapp开发的，附上解决方案： 修改 \node_modules\@dcloudio\uni-cli-shared\dist\json\mp\jsonFile.js 文件 function addMiniProgramComponentJson(filename, json) { // 方法中增加下面这一行，编译后会自动给组件里面加上 optons.styleIsolation 配置 json = Object.assign(json,{"styleIsolation": "apply-shared" }); jsonComponentsCache.set(filename, json); }
2023-11-01置顶skyline渲染模式下为什么不支持css margin-inline-start 等属性？
今天第一次使用skyline引擎，但很快发现控制台警告我部分css 代码不被支持，比如：margin-inline-start，margin-inline-end,padding-inline-start,padding-inline-end 等[图片]
2024-03-06置顶开启 skyline 渲染开发工具报错?
VM211 asdebug.js:1 [skyline-devtools] create skylineWindow 37 failed Error: Cannot find module 'sharedMemory/sharedMemory.node' Require stack: - C:\Program Files (x86)\Tencent\微信web开发者工具\code\package.nw/appservice/mainframe at Function.Module._resolveFilename (node:internal/modules/cjs/loader:951) at Function.Module._load (node:internal/modules/cjs/loader:791) at Module.require (node:internal/modules/cjs/loader:1023) at require (node:internal/modules/cjs/helpers:93) at self.require (<anonymous>:11:26) at Object.window.__global.safeSkylineRequire (<anonymous>:10:105116) at Object.a [as createWindow] (VM211 asdebug.js:10) at c (VM211 asdebug.js:10) at VM211 asdebug.js:1 at Set.forEach (<anonymous>)(env: Windows,mp,1.06.2208010; lib: 2.25.2) r @ VM211 asdebug.js:1 a @ VM211 asdebug.js:10 c @ VM211 asdebug.js:10 (anonymous) @ VM211 asdebug.js:1 f @ VM211 asdebug.js:1 g @ VM211 asdebug.js:1 (anonymous) @ VM211 asdebug.js:1 _ws.onmessage @ VM211 asdebug.js:1 VM211 asdebug.js:1 [skyline-devtools] create skylineWindow 38 failed Error: Cannot find module 'sharedMemory/sharedMemory.node' Require stack: - C:\Program Files (x86)\Tencent\微信web开发者工具\code\package.nw/appservice/mainframe at Function.Module._resolveFilename (node:internal/modules/cjs/loader:951) at Function.Module._load (node:internal/modules/cjs/loader:791) at Module.require (node:internal/modules/cjs/loader:1023) at require (node:internal/modules/cjs/helpers:93) at self.require (<anonymous>:11:26) at Object.window.__global.safeSkylineRequire (<anonymous>:10:105116) at Object.a [as createWindow] (VM211 asdebug.js:10) at c (VM211 asdebug.js:10) at VM211 asdebug.js:1 at Set.forEach (<anonymous>)(env: Windows,mp,1.06.2208010; lib: 2.25.2) r @ VM211 asdebug.js:1 a @ VM211 asdebug.js:10 c @ VM211 asdebug.js:10 (anonymous) @ VM211 asdebug.js:1 f @ VM211 asdebug.js:1 g @ VM211 asdebug.js:1 (anonymous) @ VM211 asdebug.js:1 _ws.onmessage @ VM211 asdebug.js:1 VM211 asdebug.js:1 Uncaught (in promise) Error: [skyline-devtools] create skylineWindow 37 failed at Object.r [as error] (VM211 asdebug.js:1) at Object.a [as createWindow] (VM211 asdebug.js:10) at c (VM211 asdebug.js:10) at VM211 asdebug.js:1 at Set.forEach (<anonymous>) at f (VM211 asdebug.js:1) at e.exports.g (VM211 asdebug.js:1) at VM211 asdebug.js:1 at Set.forEach (<anonymous>) at WebSocket._ws.onmessage (VM211 asdebug.js:1)(env: Windows,mp,1.06.2208010; lib: 2.25.2) r @ VM211 asdebug.js:1 a @ VM211 asdebug.js:10 c @ VM211 asdebug.js:10 (anonymous) @ VM211 asdebug.js:1 f @ VM211 asdebug.js:1 g @ VM211 asdebug.js:1 (anonymous) @ VM211 asdebug.js:1 _ws.onmessage @ VM211 asdebug.js:1 async function (async) c @ VM211 asdebug.js:10 (anonymous) @ VM211 asdebug.js:1 f @ VM211 asdebug.js:1 g @ VM211 asdebug.js:1 (anonymous) @ VM211 asdebug.js:1 _ws.onmessage @ VM211 asdebug.js:1 VM211 asdebug.js:1 Uncaught (in promise) Error: [skyline-devtools] create skylineWindow 38 failed at Object.r [as error] (VM211 asdebug.js:1) at Object.a [as createWindow] (VM211 asdebug.js:10) at c (VM211 asdebug.js:10) at VM211 asdebug.js:1 at Set.forEach (<anonymous>) at f (VM211 asdebug.js:1) at e.exports.g (VM211 asdebug.js:1) at VM211 asdebug.js:1 at Set.forEach (<anonymous>) at WebSocket._ws.onmessage (VM211 asdebug.js:1)(env: Windows,mp,1.06.2208010; lib: 2.25.2)
2022-08-11置顶微信小程序 swiper组件 skyline渲染模式 cache-extent属性在安卓机上不生效
swiper 里面的swiper-item 需要截图，使用的是snapshot，截图的时候发现cache-extent="1"，在iOS上表现预期正常，在Android上面，总是不能提前渲染下一屏，希望能够修复这个问题
2024-01-29置顶开发者工具无法调试skyline模式，真机预览正常，是什么原因？
如图： [图片]
2024-01-21置顶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吗？
[图片] 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渲染模式下text标签的pointerevents失效
在开启skyline渲染模式后，text标签的pointer-events无法设置成none，无论是上级标签，还是text本身的设置都没有效果。webview模式下正常，在所有平台上都存在有这个问题。与sdk版本无关，测试用最新版本3.1.4 案例链接： https://developers.weixin.qq.com/s/DNN8yamq7QMl
2023-10-23置顶input placeholder不居中？
input 设置height: 100% 也确实高度是22.4，但鼠标房东编辑器input组件里面还有个#input高度15，这可能就是placeholder不居中。 [图片][图片] 真机 oppo手机出现文字显示不全 [图片] 麻烦能不能把这种基础表单组件兼容性做好一点，基础的东西太说不过去了
2024-04-26置顶Skyline下 image无法使用云文件id加载svg
[图片] “剩余”前面是有一个svg图片的，我把“已存”前面的svg转成png就能显示 [图片]
2024-03-18置顶微信小程序 skyline 模式下, 覆盖不了 Vant 组件的 样式?
skyline 模式下修改没有反应, 把 [图片][图片][图片] 把 sky渲染调试 去掉. 又可以... [图片]
2024-03-14置顶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 真机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
小程序示例
交互动画 tab
media query 暂时还不支持。 可以先这样来做：
在 js 侧获取屏幕尺寸，然后 setData 给 wxml。 可以借助 less / sass 来简化 wxss
<view class="{{ largeScreen ? 'large' : 'small' }}"> <view class="foo"></view> </view> // wxss .large .foo { } .normal .foo { }