iPhone上的JavaFX - 应用阴影时的Laggy ListView滚动 [英] JavaFX on iPhone - Laggy ListView scrolling when applying shadow
问题描述
我正在使用JavaFXPorts在iOS上开发应用程序。我有一个Pane，它包含一个包含国家及其标志的ListView。我注意到当我在窗格上应用Drophadow效果时，ListView滚动是滞后的。正如您从下面的视频中看到的那样，没有效果滚动是非常流畅的，当通过CSS应用效果时，滚动开始变得迟钝。我想保持阴影效果，因为它使应用程序更美观。所以任何建议都非常感谢。
I am developing an app on iOS using JavaFXPorts. I have a Pane that holds a ListView with countries and their flags. I have noticed that ListView scrolling is laggy when I apply the dropshadow effect on the Pane. As you can see from the videos below, without the effect the scrolling is super smooth, whilst applying the effect through CSS, scrolls starts to get laggy. I would like to keep the shadow effect as it makes app more beautiful. So any suggestion is really appreciated.
我使用的CSS代码是：
CSS Code I am using is:
-fx-effect: dropshadow( three-pass-box, rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1);
请注意这是在iPhone 6上运行的。在iPhone 5上，结果更糟糕。
Please note that this is on iPhone 6 running. On iPhone 5 results are much worse.
推荐答案
添加效果，css，过渡，自定义控件和其他通常有效的复杂内容时在桌面上很好，移植到移动设备时可能会有很大的性能损失。
When adding effects, css, transitions, custom controls and other complex stuff that typically works fine on desktop, there could be a big loss in terms of performance when being ported to mobile.
效果
虽然效果使节点或窗格看起来很花哨，但它们对移动设备的性能影响最大。
While effects make nodes or panes look fancy, they have the highest negative impact on performance on mobile.
尽量避免将它们应用于节点更改很多，比如ListView，TableView或ComboBox控件上的单元格。
Try to avoid applying them to nodes that change a lot, like cells on ListView, TableView or ComboBox controls.
此外，如果您将它们应用于具有引用子项（ListView，...）的父级，如果孩子无效（滚动后或类似），父母（和效果）将一直呈现。
Also if you apply them to a parent with the referred children (ListView, ...), the parent (and the effect) will be rendered all the time if the children are invalidated (after scrolling, or similar).
如果你真的需要这个父母的效果，尝试拆分父母和子女。
If you really need the effect over this parent, try to split parent and children.
而不是：
parent (Pane with effect)
|-- ListView
你可以这样做：
parent (StackPane without effect)
|-- Pane (with effect)
|-- ListView
由于窗格不会有太大变化，您可以使用Cache。通常，缓存策略通过渲染节点的图像（具有效果的窗格），而不是重新创建节点和该效果，因此它是一个快速的胜利：
Since the pane won't change much, you can use Cache over it. Typically, the cache strategy works by rendering an image of the node (pane with effect), instead of recreating all over again the node and that effect, so it is a quick win:
parent (StackPane without effect)
|-- Pane (with effect) and with Cache
|-- ListView
相反，不要在更改很多的节点上使用缓存（如ListView）。
On the contrary, don't use cache on nodes that change a lot (like the ListView).
CSS
复杂的CSS需要很长的CPU时间。尽量简化它。即使你可以删除整个CSS进行快速测试。然后决定你可以使用或不使用的内容。
Complex CSS requires long CPU time. Try to simplify it. Even you can remove the whole CSS for a quick test. Then decide what you may or may not use.
尝试用代码替换一些样式。
Try as well to replace some of the styling by code.
动画
动画也是如此：如果可能，请避免使用动画，过渡。
The same goes for animations: Avoid animations, transitions, if possible.
节点数和自定义控件数
节点数越多，性能越低，所以尽量保持不变至少（在可能的情况下用图片替换复杂的内容，画布）。
The higher the number of nodes, the lower the performance, so try to keep it to a minimum (replacing complex content with images, canvas when possible).
切换场景
移动屏幕较小，每个场景的内容比桌面上的内容更少。同样重要的是避免切换阶段或场景。而是使用不同的节点并在同一场景中替换它们。
Mobile screens are smaller and it is better having less content on each scene than on desktop. Also it is important avoiding switching stages or scenes. Instead use different nodes and replace them over the same scene.
Gluon Charm使用查看 节点，以及在不同视图之间切换的简便方法： MobileApplication.getInstance（）。 switchView（其他视图名称）。
Gluon Charm uses View nodes, and an easy way to switch between different views: MobileApplication.getInstance().switchView("other view name").
图片
最后，当使用从互联网下载或从文件加载的图像时，缓存策略是必须的。看看Gluon提供的那些 Charm Down 。
Finally, when using images either downloaded from internet or loaded from a file, cache strategies are a must. Have a look at those provided by Gluon Charm Down.
这篇关于iPhone上的JavaFX - 应用阴影时的Laggy ListView滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
