Question

将Gluon Mobile与JW Video Player集成的最佳方法是什么？这是一个非常受欢迎的插件。我知道Xamarin提供了整合它的方法，但我想知道如何使用Gluon Mobile这样做？

我花了最后几个小时尝试使用Maven导入：

https://developer.jwplayer.com/sdk/android/docs/developer-guide/getting-started/library-project-setup/

这导致依赖项中存在以下文件：

编译（主要）：显示.aar文件

编译（Android）：显示.aar文件和.jar文件

即使依赖项存在，我也无法导入JW Video Package。这是我的gradle文件：

buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'org.javafxports:jfxmobile-plugin:1.2.0'
    }
}

apply plugin: 'org.javafxports.jfxmobile'

repositories {
    jcenter()
    maven {
        url 'http://nexus.gluonhq.com/nexus/content/repositories/releases' 
    }
    maven {
            url 'https://mvn.jwplayer.com/content/repositories/releases/'
    }
}

mainClassName = 'com.konfamde.Konfamde'

dependencies {
    compile 'com.gluonhq:charm:4.3.0' 
    androidRuntime 'com.gluonhq:charm-down-core-android:3.1.0'
    iosRuntime 'com.gluonhq:charm-down-core-ios:3.1.0'
    desktopRuntime 'com.gluonhq:charm-down-plugin-display-desktop:3.1.0'
    androidCompile 'com.longtailvideo.jwplayer:jwplayer-core:+'
    desktopCompile 'com.longtailvideo.jwplayer:jwplayer-core:+'
    compile 'com.longtailvideo.jwplayer:jwplayer-core:+'
}

jfxmobile {
    downConfig {
        version = '3.2.0'
        // Do not edit the line below. Use Gluon Mobile Settings in your project context menu instead
        plugins 'barcode-scan', 'connectivity', 'display', 'lifecycle', 'position', 'statusbar', 'storage'
    }
    android {
        androidSdk = 'C:/Users/wjlax/AppData/Local/Android/sdk'
        compileSdkVersion = '23'
        manifest = 'src/android/AndroidManifest.xml'
    }
    ios {
        infoPList = file('src/ios/Default-Info.plist')
        forceLinkClasses = [
                'com.konfamde.**.*',
                'com.gluonhq.**.*',
                'javax.annotations.**.*',
                'javax.inject.**.*',
                'javax.json.**.*',
                'org.glassfish.json.**.*'
        ]
    }
}

有点解决方案

我不知道这是否真的适用于移动设备，但我创建了一个WebView并将iframe URL传递给它。我测试时，视频在我的桌面上成功显示。将WebView对象移植到iOS和Android是否可以与Gluon Mobile一起使用？

以下是我的webengine代码：

WebView web = (WebView)view.lookup("#webber");
WebEngine engine = web.getEngine();
engine.load("https://content.jwplatform.com/players/VIDEOLINKHIDDEN.HTML");

这个端口能有效地用于iOS和Android吗？另请注意，我需要找出一种方法让Gluon移动应用程序检测视频何时播放完毕。我知道WebEngine可以从Javascript调用Java代码，我有以下想法让它工作，但我不确定：

在Javascript中获取视频的长度，并使用另一个使用Java的线程创建一个计时器。
以某种方式从JW Player API获取on complete回调链接到Java中的JSObject。
在运行PHP的服务器上创建自己的REST调用，并在那里处理后端代码。因此，完全使用Javascript处理视频（包括对单独URL的AJAX调用），并使用WebEngine显示正在发生的事情。

Answer 1

好的，所以我找到了一个解决方法，但我不确定这是否会解决它，因为我还没有尝试将应用程序移植到移动设备上。我使用WebView / WebEngine并在视频结束时使用回调。

我不确定在Gluon Mobile中支持的JS回调有多好，所以我希望这适用于移动设备。它现在适用于我的桌面：

请注意，传递到getHTML方法的网址是JWPlayer网站上视频的网址

public WebView getWebEngine() {
    WebView web = new WebView();
    engine = web.getEngine();
    engine.loadContent(this.getHTML(this.video.getVideo()));
    return web;
}

public String getHTML(String videoUrl) {
    String videoElement = "<video width='320' height='240' id='myVideo' autoplay='true'>"
            + "<source src='" + videoUrl + "'/>"
            + "Your browser does not support the video tag."
            + "</video>";
    return "<html><body style='font-family:sans-serif';>" + videoElement + "</body></html>";
}

private void addEndingListener() {

    Document doc = engine.getDocument();

    Element el = (Element) doc.getElementsByTagName("video").item(0);

    EventListener listener = (Event evt) -> {
        this.reviewPane.setVisible(true);
    };

    if (el != null) {
        ((EventTarget) el).addEventListener("ended", listener, false);
    }

}

public void loadEngine(VBox container) {
    runLoop();
    this.reviewPane = getReviewPaneInstance();
    this.reviewPane.setVisible(false);
    container.getChildren().add(this.reviewPane);

    this.engine.reload();
    this.engine.getLoadWorker().stateProperty().addListener(
            new ChangeListener<State>() {
        @Override
        public void changed(ObservableValue ov, State oldState, State newState) {
            if (newState == Worker.State.SUCCEEDED) {
                addEndingListener();
            }
        }
    });
}

<强>更新

所以Javascript to Java将无效。但是，我能够通过将Javascript直接添加到Web引擎来解决这个问题，以处理我需要的所有内容。＆＃34; onended＆＃34;和＆＃34; onseeking＆＃34;内联事件监听器似乎工作（即使移植到移动设备）：

public String getHTML(String videoUrl) {
        String onSeek = "document.getElementById(\"container\").innerHTML = \"No fast forwarding allowed! Try again.\"";
        String onEnd = "document.getElementById(\"container\").innerHTML =" + this.codeGen;

        String videoElement = "<div id='container'><video id='video' width='320' height='240' id='myVideo' controls onseeking='" + onSeek + "' onended='" + onEnd + "'>"
                + "<source src='" + videoUrl + "'/>"
                + "Your browser does not support the video tag."
                + "</video></div>";
        return "<html><body style='font-family:sans-serif;'>" + videoElement + "</body></html>";
    }

有了这个，我已经能够在视频完成时输出一个令牌，用户必须输入该令牌才能说明该视频已被观看。我还阻止用户搜索，因为它完全删除视频元素并在搜索时输出消息。

Gluon Mobile和JW Video Player

1 个答案: