我怎么能在叠加的PhoneGap的CordovaWebView在Android系统之上的原生的看法？ [英] How can I overlay a native view on top of PhoneGap's CordovaWebView in Android?

问题描述

我要建一个需要渲染上的PhoneGap提供的WebView之上的原生UI视图PhoneGap的插件。在iOS系统中，这是非常简单的，只需要创建一个视图，并把它添加到PhoneGap的的web视图的滚动视图。这将使得在web视图顶部的控制，并允许它以滚动的HTML内容（注意，这个例子使用一个UIButton，但我将被施加到这个自定义UI控制）：

I'm building a phonegap plugin which needs to render a native UI view on top of the WebView that PhoneGap provides. In iOS this is very simple, just create the view and add it to PhoneGap's webView's scrollView. This will render the control on top of the webView and allow it to scroll with the HTML content (note that this example uses a UIButton, but I will be applying this to a custom UI control):

-(void)createNativeControl:(CDVInvokedUrlCommand *)command
{
    NSDictionary* options = [command.arguments objectAtIndex:0];
    NSNumber* x = [options objectForKey:@"x"];
    NSNumber* y = [options objectForKey:@"y"];
    NSNumber* width = [options objectForKey:@"width"];
    NSNumber* height = [options objectForKey:@"height"];

    CGRect rect = CGRectMake([x floatValue], [y floatValue], [width floatValue], [height floatValue]);
    self._nativeControl = [UIButton buttonWithType:UIButtonTypeSystem];
    self._nativeControl.frame = rect;

    [self._nativeControl addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];
    [self._nativeControl setTitle:@"Click me" forState:UIControlStateNormal];
    [self.webView.scrollView addSubview:self._nativeControl];

    CDVPluginResult* result = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK];
    [self.commandDelegate sendPluginResult:result callbackId:command.callbackID];
}

我曾尝试做一些在Android的大致相当，但都没有成功。这是我最近一次尝试：

I have tried doing something roughly equivalent in Android, but have not had success. Here is my most recent attempt:

@Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
    System.out.println(String.format("%s action called", action));

    if ("echo".equals(action)) {
        String message = args.optString(0);
        this.echo(message, callbackContext);
        return true;
    } else if ("createNativeControl".equals(action)) {
        this.createNativeControl(callbackContext);
        return true;
    }

    return false;
}

private void createNativeControl(CallbackContext callbackContext) {
    // Find the frame layout parent and place the control on top - theoretically
    // this should appear on TOP of the webView content since the TextView child is
    // added later
    FrameLayout frameLayout = (FrameLayout) webView.getParent().getParent();

    TextView view = new TextView(frameLayout.getContext());
    view.setText("Hello, Android!");
    view.setVisibility(View.VISIBLE);

    frameLayout.addView(view, 100,100);
    callbackContext.success();
}

我怎样才能做到这一点在Android的？

How can I accomplish this in Android?

推荐答案

通过科尔多瓦的Andr​​oid 4.0.2，我可以添加一个视图在web视图的顶部，像这样的：

With Cordova Android 4.0.2, I was able to add a view on top of the webview, like this:

public class HVWMaps extends CordovaPlugin {

    @Override
    public void initialize(CordovaInterface cordova, CordovaWebView webView) {

        FrameLayout layout = (FrameLayout) webView.getView().getParent();

        TextView textView = new TextView(layout.getContext());
        textView.setBackgroundColor(Color.BLUE);
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(500, 500);
        params.setMargins(100, 100, 100, 100);
        textView.setLayoutParams(params);
        layout.addView(textView);
    }
}

这似乎对于 CordovaWebView 界面最近改变，所以这可能不是与旧版本。在这个例子中，你还需要添加＆LT; PARAM NAME =的onload值=真/＆GT; 的功能在plugin.xml使初始化（..）被调用：

It seems that the interface for CordovaWebView has changed recently, so this may not work with older versions. For this example, you'll also need to add <param name="onload" value="true" /> to the feature in your plugin.xml so that initialize(..) gets called:

<platform name="android">
    <config-file target="res/xml/config.xml" parent="/*">
        <feature name="YourPlugin" >
            <param name="android-package" value="com.your.plugin"/>
            <param name="onload" value="true" />
        </feature>
    </config-file>
</platform>

这不符合的WebView滚动正如你所提到的iOS不会，但我的项目，我并不需要它。

This doesn't scroll with the webview as you mentioned iOS does, but for my project I didn't need it to.

这篇关于我怎么能在叠加的PhoneGap的CordovaWebView在Android系统之上的原生的看法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！