Wednesday, January 22, 2014

Re: How to adjust a GWT frame height to get no scrollbars (100% of body content)?

Yeah, I'm sorry if I gave you false hope. I saw the content of the thread and thought maybe I could help. I've done quite a bit with mgwt scrolling and iframes separately, but putting them together is just problematic. I don't know any hacks to get it to work. I think your only practical options are:

1.) Use the scrolling behavior of the device. You may be able to mitigate the impact on user experience by styling the iframe and/or it's container to make it intuitive to the user when the experience is different in the frame.

2.) Try to get the content of the pages without the header, body tags etc and just inject it into an element. This is essentially how some web frameworks work. You could do this by working developers on the framed site or introducing your own intermediary service that tears apart the page. If you do this, you should get express permission from the site owners. The downside of this approach is your app will have to be a suitable home for the content (the right js css etc.). You should certainly be able to work this out if the site is produced by the same company, but it will be an uphill battle if you're trying to work against arbitrary external sites.

All that said, I wouldn't say I thinks it's completely impossible to get it to work like you want to but I don't see an expedient way that I think is likely to work. One possibility might be intercepting the events from the transparent frame like I made above, processing them for drags and sending the ones that aren't part of a drag to the frame beneath. I'm not at all sure that would ever work reliably on various platforms, but I guess it might be possible.

Sorry I couldn't be more help.

On Wednesday, January 22, 2014 5:37:50 AM UTC-6, marian lux wrote:
Thank you Wayne for the "FrameScrollerScreen.ui.xml".

The bad news is, the iframe underneath will not receive any events. In some extremely limited cases this might be okay.

In my use case it is very important that the user can interact (clicking on links) inside the iframe. On the other side, the scrolling inside the iframe is also important because the user should have always the same scrolling-experience (for all views of my application).

I also found this post form daniel (- the creator of mgwt):
https://groups.google.com/d/msg/mgwt/9P73HQc9fig/oDmy6vMjihoJ

Do you know an alternative solution or is there a hack available to handle scrolling an iframe inside a mgwt-scrollpanel (without blocking all events)?

Thank you in advance.
Marian

Am Mittwoch, 22. Januar 2014 04:25:19 UTC+1 schrieb Wayne Rasmuss:
Well, it's a mixed bag. After investigating more, I would probably recommend just letting the frames scroll themselves like you demonstrated earlier with your sample html file.

That said, I managed to come up with a hack for you that might work, but probably won't for your case. I'm hoping it might get you started on something that does work for you. I've attached a ui builder file, the associated class didn't do anything. So, it should be easy enough for you to just dump it in a new ui builder file. You could also translate it into "regular" code.

There are two problems, I think you've alluded to them both but I'll put them in my own words, maybe an alternate perspective will help. The first problem is iframes have no ability to adjust their size based to fit their content. This means that the mgwt scroll panel can't really scroll them. The only solution I can come up with for this is what is already in this topic. That is, figure out a way to adjust the height of the iframe after the contents have been loaded.

The other problem is once this is done, the iframe will eat all the events it gets. This makes sense because the iframe needs to deal with everything a browser needs to deal with. What I have attached here is a ui builder that overlays an invisible div over the iframe. This means that mgwt is able to receive the events and scroll that page, which happens to mean that it scrolls the iframe with the invisible div. The bad news is, the iframe underneath will not receive any events. In some extremely limited cases this might be okay.

Further research into how to get events to the containing page from the iframe might help.

I'll post any new ideas if the pop into my head. 

On Tuesday, January 21, 2014 3:07:13 AM UTC-6, marian lux wrote:
It  seems to be a mgwt problem?

I have three attachments:
.) working_mobile_scroll.html
displays a normal html with an iframe and I am able to scroll everywhere on mobile browser (e.g. on Android Google Chrome)

.) FrameViewGwtImpl.java
my View-Class where the gwt-frame-widget is defined

.) Bildschirmfoto ....
a screenshot of the dom when running in development-mode

=> I am always able to scroll with two fingers (touchpad) on desktop browser but one finger scroll on mobile browser only works on my test-html "working_mobile_scroll.html" and not in my mgwt-application.
In my mgwt-application: If i tap inside the frame and want to scroll, nothing happens. Only scrolling outside the frame on left or right side with one finger is working.

Am Donnerstag, 16. Januar 2014 18:59:56 UTC+1 schrieb Wayne Rasmuss:
You're right, there's no frames there, but you should be able to make them behave like other content I think.

I saw you are using mgwt. Are you using the mgwt scroll panel? It can probably work either way, but it would help to know.

Can you point me to a live url, or maybe capture the DOM using inspect element in chrome or something so I can see exactly what's going? Providing the GWT classes that are responsible for each element would be helpful too.

On Thursday, January 16, 2014 11:11:43 AM UTC-6, marian lux wrote:
Hi Wayne,

thank you! It would be very nice if you could help me with some CSS tweaks.
Your application has a good looking design and it is a good, innovative idea :-)

But I did not see any frames there, so I hope you can help me with my problem:
I want the same scrolling experience on my gwt-frame as with a gwt-html widget (scrolling with one finger on the content if it does not fit the client size - height)

Thank you in advance!


Am Donnerstag, 16. Januar 2014 14:18:16 UTC+1 schrieb Wayne Rasmuss:
Admittedly, I didn't look too closely at your use case, but I believe I've accomplished similar things using css with mgwt. You can check out my app at app.carellaborate.com.

One thing that hung my up was in mgwt the scroll panel has to be a direct child of touch panel, or something like that anyway.

If you like the idea of using css instead, I should have more time to help with an example later

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/groups/opt_out.

No comments:

Post a Comment