我可以将 HaxeUI 与 HaxeFlixel 一起使用吗？

Question

我尝试同时使用 HaxeUI 和 HaxeFlixel，但我得到的是白色背景上的 HaxeUI 界面，覆盖了下面的所有内容。此外，即使有可能使 HaxeUI 和 HaxeFlixel 一起工作，当 HaxeFlixel 中的状态改变时如何改变 HaxeUI 的 UI 也不清楚。这是我使用的代码：

private function setupGame():Void {

    Toolkit.theme = new GradientTheme();
    Toolkit.init();

    var stageWidth:Int = Lib.current.stage.stageWidth;
    var stageHeight:Int = Lib.current.stage.stageHeight;

    if (zoom == -1) {
        var ratioX:Float = stageWidth / gameWidth;
        var ratioY:Float = stageHeight / gameHeight;
        zoom = Math.min(ratioX, ratioY);
        gameWidth = Math.ceil(stageWidth / zoom);
        gameHeight = Math.ceil(stageHeight / zoom);
    }

    trace('stage: ${stageWidth}x${stageHeight}, game: ${gameWidth}x${gameHeight}, zoom=$zoom');
    addChild(new FlxGame(gameWidth, gameHeight, initialState, zoom, framerate, framerate, skipSplash, startFullscreen));

    Toolkit.openFullscreen(function(root:Root) {
        var view:IDisplayObject = Toolkit.processXmlResource("assets/xml/haxeui-resource.xml");
        root.addChild(view);
    });
}

我猜想，HaxeUI 和 HaxeFlixel 可能都有自己的主循环，它们的事件处理可能不兼容，但为了以防万一，有人能给出更明确的答案吗？

编辑：

其实用openPopup会好很多:

Toolkit.openPopup( { x:20, y:150, width:100, height:100 }, function(root:Root) {
            var view:IDisplayObject = Toolkit.processXmlResource("assets/xml/haxeui-naming.xml");
            root.addChild(view);
        });

可以与屏幕的其余部分进行交互（使用 HaxeFlixel 进行管理），但是使用 HaxeFlixel 进行管理的屏幕部分中的鼠标指针仍保留在 HaxeUI 用户界面元素下方。

Answer 1

当您使用haxeui打开全屏或弹出窗口时，程序流将被阻塞（您的update() 和draw() 函数将不会被调用）。您可能应该看看 flixel-ui。

Answer 2

根据我的经验，haxeflixel 和 haxeui 可以很好地协同工作，但它们是完全独立的项目，因此，flixel 状态和显示 UI 之间的任何协调都必须由编码人员添加。

我不记得有你提到的白色背景问题，除非 haxeui root sprite 有一个坚实的背景，否则它不应该发生，在那种情况下应该向 haxeui 项目维护者提出。

Answer 3

同时使用 Flixel 和 HaxeUI 时，几乎就像同时运行两个应用程序一样。但是，它们都依赖 OpenFL 作为后端，并且都将自己附加到其显示树。

我现在正在试验的一项技术是打开 Flixel 子状态，并在子状态内调用 Toolkit.openFullscreen()。在此内部，您可以将根背景的 alpha 设置为 0，这样您就可以透过它看到 Flixel 用来渲染的底层位图。

这是一个最小的例子，说明您如何 "embed" Flixel 子状态中的编辑器界面：

import haxe.ui.toolkit.core.Toolkit;
import haxe.ui.toolkit.core.RootManager;
import haxe.ui.toolkit.themes.DefaultTheme;

import flixel.FlxG;
import flixel.FlxSubState;

// This would typically be a Haxe UI XMLController
import app.MainEditor;

class HaxeUIState extends FlxSubState
{

    override public function create()
    {
        super.create();

        // Flixel uses a sprite-based cursor by default,
        // so you need to enable the system cursor to be
        // able to see what you're clicking.
        FlxG.mouse.useSystemCursor = true;

        Toolkit.theme = new DefaultTheme();
        Toolkit.init();
        Toolkit.openFullscreen(function (root) {
            var editor = new MainEditor();

            // Allows you to see what's going on in the sub state
            root.style.backgroundAlpha = 0;
            root.addChild(editor.view);
        });
    }

    override public function destroy()
    {
        super.destroy();

        // Switch back to Flixel's cursor
        FlxG.mouse.useSystemCursor = true;

        // Not sure if this is the "correct" way to close the UI,
        // but it works for my purposes. Alternatively you could
        // try opening the editor in advance, but hiding it
        // until the sub-state opens.
        RootManager.instance.destroyAllRoots();
    }

    // As far as I can tell, the update function continues to get
    // called even while Haxe UI is open.
    override public function update() {
        super.update();

        if (FlxG.keys.justPressed.ESCAPE) {
          // This will implicitly trigger destroy().
          close();
        }
    }
}

通过这种方式，您可以将不同的 Flixel 状态与不同的 Haxe UI 控制器相关联。（注意：它们不一定必须是子状态，这正是我的情况下最有效的。）

我可以将 HaxeUI 与 HaxeFlixel 一起使用吗？

Can I use HaxeUI with HaxeFlixel?

haxe

haxeflixel

haxeui