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

This is normal text that you can select

This is normal text that you can select

import com.google.gwt.core.client.GWT;
import com.google.gwt.dom.client.Style.BorderStyle;
import com.google.gwt.dom.client.Style.Overflow;
import com.google.gwt.event.dom.client.LoadEvent;
import com.google.gwt.event.dom.client.LoadHandler;
import com.google.gwt.user.client.Timer;
import com.google.gwt.user.client.ui.Frame;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.HasText;
import com.google.gwt.user.client.ui.Widget;
import com.googlecode.mgwt.dom.client.event.tap.TapEvent;
import com.googlecode.mgwt.dom.client.event.tap.TapHandler;
import com.googlecode.mgwt.ui.client.widget.Button;
import com.googlecode.mgwt.ui.client.widget.HeaderButton;
import com.googlecode.mgwt.ui.client.widget.HeaderPanel;
import com.googlecode.mgwt.ui.client.widget.LayoutPanel;
import com.googlecode.mgwt.ui.client.widget.RoundPanel;
import com.googlecode.mgwt.ui.client.widget.ScrollPanel;
import com.googlecode.mgwt.ui.client.widget.WidgetList;

public class FrameViewGwtImpl implements FrameView {

private Presenter presenter;

private LayoutPanel main;
private HTML title;
private HeaderButton backButton;
private HTML subTitle1;
private HTML subTitle2;

private RoundPanel round;
private Frame frame;


private LayoutPanel layoutPanel;
private ScrollPanel scrollPanel;

public FrameViewGwtImpl() {
main = new LayoutPanel();


HeaderPanel headerPanel = new HeaderPanel();
main.add(headerPanel);


scrollPanel = new ScrollPanel();
main.add(scrollPanel);
layoutPanel = new LayoutPanel();
scrollPanel.add(layoutPanel);

title = new HTML();
headerPanel.setCenterWidget(title);

backButton = new HeaderButton();
backButton.setBackButton(true);
headerPanel.setLeftWidget(backButton);

WidgetList list = new WidgetList();
layoutPanel.add(list);

subTitle1 = new HTML();
list.add(subTitle1);

subTitle2 = new HTML();
list.add(subTitle2);

frame = new Frame(GWT.getHostPageBaseURL() + "ClientData/Hotelinfos.html");


frame.getElement().getStyle().setBorderStyle(BorderStyle.HIDDEN);
frame.getElement().getStyle().setOverflow(Overflow.AUTO);


frame.setWidth("100%");
frame.getElement().setId("ohaframe");

frame.addLoadHandler(new LoadHandler() {

@Override
public void onLoad(LoadEvent event) {
optimizeFrameSize("ohaframe");
scrollPanel.refresh();
final int k = 0;
final Timer timer = new Timer() {
int t = k;
public void run() {
scrollPanel.refresh();

if(t==1){
this.cancel();
}
t = t+1;
}
};
timer.run();
timer.schedule(1000);

}
});

round = new RoundPanel();
round.add(frame);
layoutPanel.add(round);




private void bind(){
backButton.addTapHandler(new TapHandler() {

@Override
public void onTap(TapEvent event) {
presenter.onBackButtonClicked();

}
});
}


@Override
public HasText getTitle() {
return title;
}

@Override
public HasText getSubTitle1() {
return subTitle1;
}

@Override
public HasText getSubTitle2() {
return subTitle2;
}

@Override
public HasText getBackButtonText() {
return backButton;
}

@Override
public Widget asWidget() {
return main;
}


@Override
public void setPresenter(Presenter presenter) {
this.presenter = presenter;

}

@Override
public void setFrame(String url) {
frame = new Frame(url);
}
}

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.