I would like to move the pagingnavigator created by wicket to the right of the screen. As you can see in the picture, I want it near the red circle.
I have a html file(BoatOverview.html) consisting of the panel:
<wicket:panel>
<p><table wicket:id="searchresult" class="searchresult"/></p>
</wicket:panel>
and a java file(BoatOverview.java) which starts off:
class TelledataPanel extends Panel {
*some existing code*
}
From what I have read, you often need to create a custom PagingNavigator to do things like this with wicket. This seems awfully complex when I just want a simple css fix, how do I go about this?
Assuming, you're working with a DataTable and assuming you're creating your PagingNavigator by using DataTable.addBottomToolbar(new NavigationToolbar(DataTable)), you could call add(new SimpleAttributeModifier("style", "float:right")) on your NavigationToolbar.
But since you didn't provide any relevant code, this is purely speculative.
Related
I am trying to use the Williams objectdraw library (http://eventfuljava.cs.williams.edu/library/objectdrawJavadocV1.1.2/index.html) to make a line on my drawing canvas. I am very new to Java and am unsure whether I am setting it up correctly. Attached is a screenshot of what happens when I run the code.
You have extended WindowController,i think you are suppose to extend Applet..
http://spot.colorado.edu/~cathyb/hiapplet.html have a look at this page it will be useful.
it's me again :)
I'm trying to extend the following behaviour of Tapestry Grid in the following way.
At the moment, I can select how many rows per page I want displayed like this:
<t:grid class="t-form-loop"
t:source="myGridDataSource"
t:model="myBeanModel"
t:row="myEntry"
t:encoder="myEncoder"
t:rowsPerPage="20"
t:pagerPosition="both"
t:rowIndex="currentIndex"
t:inplace="true">
I would like the part with rowsPerPage to be dynamically changeable, meaning user could click on one of the predefined amounts (10,20,50,100) or simply enter his own desired amount of rows displayed per page.
One dirty (and not smart way to do this) is to provide the links/imput for that and save it in a variable on my page, so the Grid could reference it like this:
t:rowsPerPage="myRowsPerPage"
However, assume I have, for example, 20-30 pages. Adding the same code on each and every one of them would be useless and stupid, so I'd assume I'd want to decorate the existing grid somehow. However, I would not like to do this globally, since on some pages I would like to offer this functionality and on some not.
So, given my limited knowledge of Tapestry, I'd assume I have 2 options:
Mixin that would add the following functionality to selected Grids
Extend Grid component in a way that is has the following 2 parameters:
a. t:rowsPerPageValues="10,20,50,100"
b. t:rowsPerPageInput="true"
Also, I'd like to know how many rows are currently displayed.
What is the best approach to this problem and could I have some help/tips with implementing them?
Edit: I'd like it to look something like this (sry for bad HTML): http://jsfiddle.net/ZST4E/1/
I think you should create a new component which has an embedded t:grid. You might find that publishParameters will help.
eg:
ExtendedGrid.java
public class ExtendedGrid {
#Component(id="grid", publishParameters="source,inplace,etc,etc")
private Grid grid;
#Property
private int rowsPerPage;
}
extendedGrid.tml
<t:container xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd">
<t:form zone="gridZone">
<t:select t:id="rowsPerPage" model="[10,20,50,100]" /> <t:submit />
</t:form>
<t:zone t:id="gridZone">
<t:grid t:id="grid" rowsPerPage="prop:rowsPerPage" />
</t:zone>
</t:container>
page.tml
<t:extendedGrid source="mySource" inplace="true" />
I have been writing some basic code for an application I am designing. I have learned the basics and gotten some simple database connection working with RPC calls etc. What I need to do now and am completely lost (as I am traditionally a c# developer with windows forms).
In c# if I wanted a new form I would just create it, and then call the show method.
How does one create multiple pages in GWT, and switch between them?
Thanks in advance,
Chris
The simplest way would be to
Make a new java class (GwtHome.java, GwtHelp.java etc)
Extend these classes by using the Composite class
Make the equivalent of a Master Page and add it to the rootPanel as a class with the appropriate headers, menu, footer and Content Placeholder (Could be any of the AbsolutePanel, VerticalPanel, HorizontalPanel objects provided by the GWT Framework)
By clicking on the menu clear the Placeholder and add the appropriate object of GwtHome, GwtHelp etc.
After getting aquanted with the above procedure, you might want to break up the code in many files using a design pattern as suggested by Andrei.
Simply clear the root panel (RootPanel.get().clear()) and add the widget for your new "page", the same way you added your first one.
If you're using LayoutPanels, do RootLayoutPanel.get().clear() instead.
Look at Activities and Places design pattern: https://developers.google.com/web-toolkit/doc/latest/DevGuideMvpActivitiesAndPlaces
I highly recommend it for a multipage GWT app. It explains pretty well how you create different "views", that are driven by their "activities", and tied to specific "places" (pages) that users can navigate.
Typically you use a LayoutPanel as your "page" container that occupies the entire available browser window. You split this LayoutPanel into 2-3 layers (zones), like top menu, side menu, main area. Each area contains one widget, usually a ScrollPanel, FlowPanel, or HtmlPanel. Then you use different widgets or HTML inside each of these widgets to display whatever you need. You may also create your own composite widgets that you can reuse in different pages.
Firstly I am no longer a student and doing this for other purposes, so don't hold back on the help ;)
I want to incorporate a simple program into my webpage. I want 4 buttons labelled right arm, left arm, activate voice and walk forward. There will be a box above these buttons showing an image of a robot and as the buttons are pressed by the user I want a different image to be loaded in the box.
So if the right arm button is pressed the image with the robot raising its right arm will need to be displayed.
So basically all I want the buttons to do is to load the image that belongs to each one. I am assuming java is the best choice? I have the open source Java package, would I need any other software when it comes to embedding it into a webpage? My webpage is done on dreamweaver and I am pretty good with html. Would appreciate it if someone could point me to the right direction.....Thanks
Don't use Java for this. Use JavaScript. Something like this:
HTML:
<img src="one.jpg" id="firstImage" />
<img src="two.jpg" id="secondImage" />
<button id="doSomething">Do Something</button>
<button id="doSomethingElse">Do Something Else</button>
CSS:
img {
display: none;
}
JavaScript:
var hideImages = function() {
$('#firstImage').hide();
$('#secondImage').hide();
};
$('#doSomething').click(function() {
hideImages();
$('#firstImage').show();
});
$('#doSomething').click(function() {
hideImages();
$('#secondImage').show();
});
What this essentially does is initially display no images, just buttons. Then as each button is clicked, the corresponding image is displayed. (And all other images are first hidden, since previous button clicks would have displayed previous images.)
This is an overly simple proof of concept, of course. At the very least you'll want to use better variable names :) This just demonstrates the idea of how you'd show/hide images in JavaScript in response to button clicks. (This also assumes the use of jQuery, which is a safe assumption these days. The easiest way to use that is to refer to a CDN link in your page, using a standard HTML script tag.) You can see this code in action here (though the images are broken, of course.)
If there are a lot of buttons and a lot of images, you may be able to re-factor the code to be less repetitive as well. Maybe store the images in an array and have a single button click handler which can associate the sending button with the correct array element, etc. That's up to you.
There are many technologies that could help you: javascript is one of them and it would be much simpler than using Java for such simple thing. You can use Java applet if you really want to use Java for that project.
I'm trying to get a simple layout working under GWT 2.0 using UiBinder. The layout I'm trying to get is one that mimic Java's BorderLayout in where you can specify different panels in the north, south, east, west and center directions; for that I'm using DockLayoutPanel. I would like to get a header and footer, both with fixed width. The remaining viewport space would be occupied by the widget assigned to the DockLayoutPanel center slot.
The current .ui.xml file I've got is:
<g:DockLayoutPanel unit='EM'>
<g:north size='2'>
<g:HTML>HEADER</g:HTML>
</g:north>
<g:south size='2'>
<g:HTML>FOOTER</g:HTML>
</g:south>
<g:center>
<g:HTML>
<div id='loginform'>Hello!</div>
</g:HTML>
</g:center>
</g:DockLayoutPanel>
The browser only renders HEADER at the top left corner. How can I achieve the layout I'm looking for? It seems that there's more CSS you've got to know before you can use GWT layout panels, but that kind of defeats the purpose of creating the UI with it.
This works for me with none of the hacks suggested by RaphaelO.
The Javadoc example on the DockLayoutPanel uses 192 as the width for West. This is wrong - the author probably thought he was using PX, but he was using EM. So if you zoom out, you'll see that Center is far to the right.
Have you checked your using Standards Mode? This is required for the DockLayoutPanel.
Also, forgot to mention that you should use RootLayoutPanel when you add the DockLayout in your entrypoint class - don't use RootPanel.
The use of the newly introduced Layout Panels is indeed quite confusing. There is a way to make the layout occupies the whole client area. It requires a little bit of Java code in addition to the ui.xml file.
In your EntryPoint class, add a UiBinder definition with a annotation to the ui.xml file which declares the layout:
#UiTemplate("LayoutDeclarationFile.ui.xml")
interface DockLayoutUiBinder extends
UiBinder<DockLayoutPanel, TheEntryPointChildClass> {
}
private static DockLayoutUiBinder uiBinder = GWT
.create(DockLayoutUiBinder.class);
in the onModuleLoad function, instantiate the UiBinder, retrieves its root and directly add it to the DOM:
public void onModuleLoad() {
DockLayoutPanel layout = uiBinder.createAndBindUi(this);
// Make sure we use the whole client area
Window.setMargin("0px");
// Add the panel to the DOM
RootLayoutPanel.get().add(layout);
}
I tried your code block as well as the the sample block on the javadoc page for DockLayoutPanel and I am getting similar results. Only the data in the North section of the DockLayoutPanel seems to be displayed. However when i search the page (using firefox and safari on Mac) the other elements are found but they are not showing anywhere. Seems like there might be a bug with this panel and the UiBinder.