I want to change GWT TabPanel behaviour, so it would allow me to set tab titles not directly in .ui.xml files, but in some kind of dictionary class.
Standard tabPanel looks like this:
<gwt:TabPanel ui:field="tabPanel">
<gwt:Tab text="Some tab title">
<gwt:VerticalPanel>
<!-- components -->
</gwt:VerticalPanel>
</gwt:Tab>
<gwt:Tab text="Other tab title">
<gwt:VerticalPanel>
<!-- components -->
</gwt:VerticalPanel>
</gwt:Tab>
</gwt:TabPanel>
I want to use external dictionary with all labels/titles, so I could get the label/title by it's dictionary key, e.g:
Tab.Title.some=Some tab title
Tab.Title.other=Other tab title
So my .ui.xml file should looks like this:
<gwt:TabPanel ui:field="tabPanel">
<gwt:Tab text="Tab.Title.some">
<gwt:VerticalPanel>
<!-- components -->
</gwt:VerticalPanel>
</gwt:Tab>
<gwt:Tab text="Tab.Title.other">
<gwt:VerticalPanel>
<!-- components -->
</gwt:VerticalPanel>
</gwt:Tab>
</gwt:TabPanel>
In all other cases (labels, table headers etc) I was able to extend component class and overload setText(String text) method. But for Tab there is only an interface and I'm not sure what to do with it to get desirable effect. Anyone knows the solution?
You should check out the i18n support for gwt this is probably exactly what you are looking for.
http://www.gwtproject.org/doc/latest/DevGuideUiBinderI18n.html
Related
I want to add Tab and tabPanel to specific page xxx.zul!
parentTabs = (Tabs) new Path("//root/lay/tabs").getComponent();
where root is ID for Page , lay is ID for BorderLayout and tabs is ID for Tabs Tag.
Note : Id don't have window tag in target page!
thanks
Oke you can add a zul page to an other zul page by doing this :
<?component name="details" macro-uri="../folder/myzul.zul" inline="true"?>
<window>
...
<details/>
...
</window>
the code to handle that part is in your MVVM of the main zul page. So if you do in the details an #bind(vm.list) you will need to have an getList and setList in your viewmodel.
Mine trick is that I write interfaces for those specific pages (you can implement multiple interfaces so multiple components are possible that way).
By that I know I will not forget any getter or setter that I need and they will remember me also on what variables I need to declare.
The visibility you can do with :
<tab label="tab2" visible=#load(vm.tab2Visible)/>
Hope this can help you.
I have component based application. All of the components are defined in XML. The components may be defined in different xml files.
<!-- filename: components.xml -->
<components>
<component type="x" name="y">
<property1 attribute="attr"/>
<property2 attribute="attr"/>
</component>
<component type="a" name="b">
<property1 attribute="attr"/>
…
</component>
</components>
<!-- filename: extra-components.xml -->
<components>
<component type="x" name="z" extends="x:y"> <!-- this extends component x:y -->
<property3 attribute="attr"/>
</component>
</components>
Right now I'm trying to write a plugin so that I can jump from the child components to parent component. In the example above, the component type 'x' and name 'z' extends component type 'x' and name 'y'.
Going throughs some of the source from different plugins, I was able to add a menu item and grab content under the caret.
Say, if my caret is under "x:y" in second component, I can garb x and y so at least I can know the component type and component name to look for.
But I want to underline the contents under extends i.e. "x:y" when I press ctrl and search for the component and jump to the declaration of the component when ctrl+click like we jump to declaration of class.
I want guidance like which class should I look, how should I go or similar implementation.
Thanks
I think what you are looking for is a reference contributor.
See this answer for more details on how to set up a contributor. Once this contributor is created, I think you'll have two ways to find which XML element x:y refers to:
parse every potential XML file and try to find a tag with the correct attributes, then return the corresponding PsiElement
create an index of every component tag, and lookup x:y in this index (requires much more work)
how to make a custom text box in Google web toolkit(gwt) having balloon feature of displaying error messages?
i am using Google web toolkit(gwt) in java on eclipse and i don't see any function providing this functionality.
You should implement your own "composite". To "compose" a "balloon"/tooltip with the inputs of your form.
Here is an example of the ui.xml for a text area using Gwt-bootstrap. (Doing the same in plain GWT is straightforward, if not, I'll be glad to convert this example).
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:g="urn:import:com.google.gwt.user.client.ui"
xmlns:b="urn:import:com.github.gwtbootstrap.client.ui">
<b:WellForm>
<b:Fieldset>
<b:ControlGroup>
<b:Label styleName="field_label" ui:field="label" />
<b:TextArea ui:field="myWidget"/>
<b:HelpInline ui:field="errorMessage" visible="false" />
</b:ControlGroup>
</b:Fieldset>
</b:WellForm>
If by "balloon" you mean "tooltip", then add a mouseOverHandler and a mouseOutHandler to display/hide the error message (HelpInline here, but could be any widget) when there is one to display.
If you are satisfied with this you should implement some inheritance mechanism to reuse everything around this tag
<b:TextArea b:id="textArea" ui:field="textArea"/>
for all kinds of widgets.
By using composite you can have a single line reused for all error messages ("balloons" or something else) for all your input widgets, and switch between HelpInline, Label, etc easily.
EDIT
The sample code with plain GWT
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:g="urn:import:com.google.gwt.user.client.ui">
<g:HorizontalPanel ui:field="widgetContainer">
<g:Label styleName="field_label" ui:field="label" />
<g:TextArea ui:field="myWidget"/>
<g:Label ui:field="errorMessage" visible="false" />
</g:HorizontalPanel>
I suggest using a HorizontalPanel to display the field's label (ui:field="label"), the input field itself (ui:field="myWidget") and the error message (ui:field="errorMessage") on one line, but other kind of panels are also possible, or you can use CSS to position the elements as you want.
My website has a consistant header and footer that I want on all pages.
What is the best way to do this?
The header will have some dynamic data also, based on the current view.
P.S Does freemarker have any sort of master page functionality? Where I can create a base template, then have other templates build upon the base?
Basically I want to design a template that has header and footer + a place holder for the main content area.
THEN, all other pages will inherit the main template (with header + footer), and then inject the action's render output into the templates main content area.
Define a macro like this in an import library:
<#macro page title>
<html><head><title>${title?html}</title></head>
<body>
<!-- header section -->
<#nested/>
<!-- footer section -->
</body></html>
</#macro>
and use the following template for all your pages:
<#import "common.ftl" as c/>
<#c.page title="custom page title">
<!-- custom page content -->
</#c.page>
You can find the spring-specific part in the spring reference and the freemarker part in the freemarker online docs
(It doesn't seem like Freemarker supports master pages, but through recursive use of include you can achieve a high level of code reuse)
Have a look at SiteMesh. I believe you will find it useful.
I need to create a reusable UI component that accepts a number of parameters (e.g. an image URL and some label text), similar to how JSP tags can accept parameters. The Pivot docs for the "wtkx:include" tag say:
The tag allows a WTKX file to embed content defined in an external WTKX file as if it was defined in the source file itself. This is useful for ... defining reusable content templates
I was hoping that I could define my component in a WTKX file using standard Pivot components (e.g. a TextInput) and pass it one or more parameters; for example my reusable template called "row.wtkx" might contain a row with an image and a text field, like this (where the ${xxx} bits are the parameters):
<TablePane.Row xmlns="org.apache.pivot.wtk">
<ImageView image="#images/${image_url}" />
<TextInput text="${title}" />
</TablePane.Row>
I could then reuse this component within a TablePane as follows:
<rows>
<TablePane.Row>
<Label text="Painting"/>
<Label text="Title"/>
</TablePane.Row>
<wtkx:include src="row.wtkx" image_url="mona_lisa.jpg" title="Mona Lisa"/>
<wtkx:include src="row.wtkx" image_url="pearl_earring.jpg" title="Girl with a Pearl Earring"/>
<wtkx:include src="row.wtkx" image_url="melting_clocks.jpg" title="Melting Clocks"/>
</rows>
I've made up the ${...} syntax myself just to show what I'm trying to do. Also, there could be other ways to pass the parameter values other than using attributes of the "wtkx:include" tag itself, e.g. pass a JSON-style map called say "args".
The ability to pass parameters like this would make the include tag much more powerful, e.g. in my case allow me to eliminate a lot of duplication between the table row declarations.
Or is "wtkx:include" not the right way to be doing this?