Add inappbrowser reposition and resize attributes

[hamzasharuf]

Platforms affected

Android & IOS

Motivation and Context

Closes #668 This feature was required by some developers to make the InappBrowser positionable and resizable so that they have the flexibility to position the webview in a specific location on the screen. The feature was mentioned in issue #668

Description

The added feature allows the developers to add a custom position to the InappBrowser to be positioned in a specific x & y location on the screen as well as specifying the width and height with the ability to interact with any content beneath.

Checklist

• [x] I've run the tests to see all new and existing tests pass
• [ ] I added automated test coverage as appropriate for this change
• [x] Commit is prefixed with (platform) if this change only applies to one platform (e.g. (android))
• [x] If this Pull Request resolves an issue, I linked to the issue in the text above (and used the correct keyword to close issues using keywords)
• [x] I've updated the documentation if necessary

[PDLMobileApps]

Hi, have you tested this change with a page containing a form with several editable fields that triggers the keyboard and force the page to scroll? In PR#655 we had an issue with that scenario, as the keyboard would appear but the window would not resize (even if <activity android:windowSoftInputMode="adjustResize" /> was specified in the AndroidManifest.xml) causing some element in the page not to be visible.

We had to change the way we resize the iab window for it to work. The basic idea is within this code:

dialog.getWindow().setGravity(Gravity.TOP);
dialog.getWindow().setLayout(WindowManager.LayoutParams.MATCH_PARENT, windowHeight); 

[hamzasharuf]

@PDLMobileApps The changes were tested on a simple app with some different components behind the browser dialog to test the ability to interact with them while the browser is still visible.

When I tested it with the editable fields, I noticed this keyboard issue and it was fixed by adding the FLAG_NOT_FOCUSABLE which allows the dialog to receive touch events from the main webView. The changes don't affect the window's resizing behavior with the keyboard and it scrolls as usual.

window.setFlags(LayoutParams.FLAG_NOT_FOCUSABLE,LayoutParams.FLAG_NOT_FOCUSABLE);

However, for the gravity, it was assigned as follows

wlp.gravity = Gravity.TOP | Gravity.LEFT;

to make sure that the dialog's (X & Y) positions will start from the top left corner (not just from the top edge)

[AntonioStipic]

Any update on this PR?

[troelsvest]

Any update?

[monove]

@hamzasharuf 0dc9492 doesn't seem to work for me. Any ideas?

[hamzasharuf]

@hamzasharuf 0dc9492 doesn't seem to work for me. Any ideas?

I've tried it on multiple Android & IOS devices with different versions and it seems to work perfectly.

[prashant18-code]

@hamzasharuf could you please help with how to include x, y, width and height values in "option" string ? It doesn't seem to be working for me with the way i include these value as below : - const browser = this.iab.create("https://www.google.com/", "_blank", "location=yes, x=0, y=200,width=430,height=650,toolbar=no");

I also tried by adding insertCSS() method like below but that doesn't work either browser.on('loadstop').subscribe(event => { browser.insertCSS({code : "html{margin-top:40px;}"}); });

Dear Author - Basically, I would like to know whether I can resize the in-app browser in such a way that some part of my app-screen(e.g. header/footer) must stay as it is and in-app browser should just open in the app screen itself. -- is this possible ?

[vveil]

Are there any updates on this? Is this going to be merged soon? I would really like to use the new features!

[vveil]

@hamzasharuf 0dc9492 doesn't seem to work for me. Any ideas?

I've tried it on multiple Android & IOS devices with different versions and it seems to work perfectly.

I've just tried to reposition the IAB with the option y=60 on an Pixel 3a Emulator, but it doesn't seem to work. When I add any height to the options the y-option also works. I don't think that this is the wanted behavior. Only using the y-option works perfectly on an iOS-emulator.

[vveil]

@hamzasharuf 0dc9492 doesn't seem to work for me. Any ideas?

Doesn't seem to work for me neither. Keyboard just wont pop up, doesn't matter what I do. Did you get it to work? I'm kinda struggling.

Edit: Test Device: Pixel 4a, Android 11

[Topiya]

I am looking for a same thing. Any updates?