Flutter flame 通过网络加载视差图像数据

huangapple go评论60阅读模式
英文:

Flutter flame loading parallax image data through network

问题

我正在尝试为我的Flutter Flame视差图层添加一个动态图像,但我卡在将ParallaxImage转换为稍后在加载ParallaxLayer中使用的ParallaxImageData的过程中。是否有任何方法可以实现这一点,或者我实际上是走错了方向?

图像变量是通过此帖子的建议加载的,该帖子使用了dart:ui包中的Image类。

我还尝试通过Sprite(image).image来获取flame/src/sprite Image类,但没有任何运气。

Flutter flame 通过网络加载视差图像数据

感谢您的亲切协助!

英文:

I am trying add a dynamic image for my parallax layer in the flutter flame, however I am stuck on converting the ParallaxImage to ParallaxImageData which will be used later in the loading of ParallaxLayer. Is there anyway to achieve this or I am actually on the wrong direction?

the var image are loaded through the suggestion of this post. which uses the Image class from dart:ui package.

I am also tried to achieve the similar by Sprite(image).image to get the flame/src/sprite Image class, without any luck.

Flutter flame 通过网络加载视差图像数据

Appreciate for your kind assistance!

答案1

得分: 1

ParallaxImage 是一个 ParallaxRenderer,它是 ParallaxLayer 在其默认构造函数中使用的内容。然后,你可以将该图层传递给 Parallax,再将其传递给 ParallaxComponent

ParallaxImage 中,你还可以设置它的 repeat 行为,alignment 对齐方式以及它如何填充到视差操作的大小(默认为全屏)。

这个 API 在发展过程中自然而然地支持了许多不同类型的视差效果,但由于不够用户友好,我们将来会对其进行重构。

你可以这样做,而无需扩展 ParallaxComponent

Future<void> onLoad() async {
  ...
  final parallaxImage = ParallaxImage(image);
  final parallax = Parallax([ParallaxLayer(parallaxImage)]);
  final component = ParallaxComponent(
    parallax,
    baseVelocity = Vector2(100, 0),
  );
  add(component);
}
英文:

The ParallaxImage is a ParallaxRenderer, which is what the ParallaxLayer takes in its default constructor. You can then pass in the layer to the Parallax, that you then pass to the ParallaxComponent.

In the ParallaxImage you can also set how it should repeat, its alignment and how it should fill the size that the parallax operating on (default is the full screen).

This API grew into this organically to be able to support many different types of parallaxes, we are going to refactor it in the future since this isn't very user friendly.

You can do this, without having to extend the ParallaxComponent:

Future&lt;void&gt; onLoad() async {
  ...
  final parallaxImage = ParallaxImage(image);
  final parallax = Parallax([ParallaxLayer(parallaxImage))];
  final component = ParallaxComponent(
    parallax,
    baseVelocity = Vector2(100, 0),
  );
  add(component);
}

huangapple
  • 本文由 发表于 2023年3月1日 15:35:19
  • 转载请务必保留本文链接:https://go.coder-hub.com/75600714.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定