I'm building a web application for Tablet. I code the css first myself. Now i added some widgets which use gwt-bootstrap. Well now i saw that gwt-bootstrap has some Methods like : setHideOn(Device.PHONE)
I'm trying now to added such a method to my whole app to make it responsive. How should i process?
Adding this to your *.gwt.xml file:
<set-property name="bootstrap.responsiveDesign" value="true"/>
Will enable responsive design.
The setHideOn(Device.PHONE) that you said is for hide/show specific widgets in specific cases.
Related
If a component is created, but a dialog.xml file isn't included within it, it will not show as available within the Sidekick, even if enabled in Design mode, and with a Component Group specified — why is this?
If you add a cq:editConfig node to the component it will show up in the sidekick, after being enabled in the design dialog of the parsys, without having a dialog.
As reference: http://dev.day.com/docs/en/cq/5-3/developing/components.html#Components and their structure
dialog boxes are meant for dynamically adding content to the components.
if there is no dialog box in a component there is no reason for component to display in sidekick .
u can directly hard code the component like this.
<cq:include path="par0" resourceType="/apps/...." />
Have you gone into the design portion to allow your component? I've often created a new component, and been unable to add it simply because I forgot to allow it in the design mode on that page.
EDIT
Good point - I do believe a dialog.xml file is required for it to show up in the sidekick. Otherwise you have to hard code the include of your component where you need it. I would suggest adding a dialog.xml file, even if it is only for the reason of showing it in the sidekick, so you can add it dynamically to different pages.
I just started learning Google Web Toolkit (GWT). How do I implement header, left navigation bar and footer in my GWT application?
How can i place the header and footer in one page and reuse the same in all other pages?
Please help me how can i achieve the above requirement?
I like using SplitLayoutPanel. Here you will basically only change the center panel and leave northe west etc alone.
You can find a very good overview here.
You can create a template in Ui:Binder with your basic layout, and use this template for all new pages.
Another option is to create a custom widget for you menu, header and footer. Then you again can use a template for new pages, but instead of including each button, label, etc., you just include your custom headerWidget, footerWidget and menuWidget.
As others already suggested, you use one of the LayoutPanels to organize your page. My favorite is LayoutPanel. You add your headerWidget, footerWidget, and menuWidget to this LayoutPanel and specify their position.
I recommend that you use a Ui:Binder for this: it's a more convenient way to do layouts, it's very visual (helps to cut on the number of mistakes), and much easier to maintain.
according to https://developers.google.com/web-toolkit/doc/latest/DevGuideUiPanels#Standards I 'm not suppose to use DockPanel, VerticalPanel, HorizontalPanel. But Those are the only panels that support hasverticalalignment and hashorizontalalignment. How am I suppose to align the widgets if I want to conform to the standards mode? Or should I keep the project in its current form using VericalPanel and HorizontalPanel, and ignore the warning eclipse gives me:
[INFO] [project] - GWT no longer supports Quirks Mode
(document.compatMode=' BackCompat').Make sure your application's
host HTML page has a Standards Mode (document.compatMode='
CSS1Compat') doctype,e.g. by using <!doctype html> at the
start of your application's HTML page.To continue using this
unsupported rendering mode and risk layout problems, suppress this
message by addingthe following line to your*.gwt.xml module
file: <extend-configuration-property
name="document.compatMode" value="BackCompat"/>
P.S.: I work in uibinder
Using tables for layouts is considered a bad practice by most UI experts. These layouts are rigid - they don't adjust well with the size of their contents.
You can build any layout you want without using these panels. Horizontal alignment is the easiest one: you simply add a CSS rule "text-align: center" (left, right) to the parent widget. For more interesting effects you can use "float: left" or "float: right". In some rare cases you may event want to use absolute positioning ("position: absolute", "left: 20px"; "top: 20px").
Vertical alignment is a little trickier, but generally you want your content to flow from top to the bottom. You can manage vertical positioning by using top and bottom margins or setting the line heights.
You can find many great resources on building fluid layouts on the Internet. Most suggested html and CSS solutions can be used with GWT, and Ui:Binder is a very convenien way to do so. You can also search StackOverflow for layout solutions to any problem you face.
I am currently trying to replicate the functionality of the Sticky application (fourth example under "samples") in my GWT application, specifically NoteView (see the class NoteView in SurfaceView.java in my personal repo or download Google App Engine's SDK, where you'll find it in appengine-java-sdk-1.5.1/demos/sticky).
However, as hard as I try, I just cannot find the place where Google put in the gripper bars on the bottom right hand corner of every note, and where their code allowed the user to resize the note. grepping for "resize" and "resizable" in their sticky dir was not fruitful, and the CSS "resize" functionality was not used either. Also, GWT Textareas are not automatically resizable in the way that these notes in GWT are, and I don't know how to enable this or set it up.
I'm sorry but it really just is a textarea, and your browser does the rest (most browsers make textareas resizable nowadays).
Using Firebug or a similar developer tool, can you tell which differences are there between the Sticky sample and what your code does?
I figured it out -- it was old crud css left over from a gxt implementation. As soon as I removed the css file, the textarea automatically had gripper bars.
I know there are many questions concerning this topic but after reading them all I'm even more confused.
I have an application that manages contacts. There are three pages:
Add contact
Show contacts
Modify contact
And now I have no idea what structure to give to my project: should I create three different modules? if so, what would be the best package structure? and how would I call other modules within a page? for example, from the 'add contact' page there should be a button to the 'show contacts' page, and from this one there should be button/links to 'modify contact' and 'add contact'.
would it be enough to add this line to the corresponding buttons event handlers?
Window.Location.assign("showcontacts.html");
(or just create a link to "showcontacts.html" if it's the case)?
GWT is not suited for applications with multiple pages. What you can do is
create a page with multiple div's. Create the links on the top of the page. When any of the link is clicked you can then show or hide divs as per your need. This is how I had done it for a different app.
Hope that helps
To allow multiple pages to be selectively displayed within a single module, I use one of two techniques:
use a SimplePanel or one of its
derivatives (e.g. LazyPanel,
ScrollPanel).Use setWidget to change
the page. Each "page" is a widget.
For example, I am doing a project
with a menubar. When "Home" menuitem
is clicked, the menu command
replaces the body of the simplepanel
by setting its widget to the Home
widget. Likewise for login, etc
menuitems.
A SimplePanel allows only one widget.
Therefore, you do not addWidget to it but setWidget to it.
use tab. Either TabLayoutPanel or
TabPanel. I prefer using the
TabLayoutPanel. You have to meticulously
set/design the CSS for TabLayoutPanel, otherwise
you would only see a blob of text hanging around.
I also try to encapsulate a "page" widget in a lazypanel (which is a derivative of a simple panel. That will prevent instantiation of any pages that may not be used in a module with a large number of "pages".
GWT is indeed suitable for ui presentation with multiple pages. In fact, one of the advantages of GWT over JSP is that you can change a page without a browser refresh/fetch flicker - one of the extremely strong reasons why you would want to use GWT for a web app with multiple pages.
Seems that GWT MVP framework suits your needs:
http://code.google.com/webtoolkit/articles/mvp-architecture.html