1
0
forked from GitHub/gf-core

Somewhat nicer gwt client ui style.

This commit is contained in:
bjorn
2008-09-12 21:07:14 +00:00
parent 426b4e8a5b
commit becdc147d2
2 changed files with 43 additions and 22 deletions

View File

@@ -32,17 +32,21 @@ public class Translate implements EntryPoint {
private SuggestBox suggest; private SuggestBox suggest;
private List<String> fromLangs; private List<String> fromLangs;
private List<String> toLangs; private List<String> toLangs;
private Grid outputTable; private VerticalPanel outputPanel;
private void addTranslation(String text) {
Label l = new Label(text);
l.addStyleName("my-translation");
outputPanel.add(l);
}
private void translate() { private void translate() {
gf.translate(suggest.getText(), fromLangs, null, toLangs, new GF.TranslateCallback() { gf.translate(suggest.getText(), fromLangs, null, toLangs, new GF.TranslateCallback() {
public void onTranslateDone (GF.Translations translations) { public void onTranslateDone (GF.Translations translations) {
outputTable.resizeRows(translations.length()); outputPanel.clear();
for (int i = 0; i < translations.length(); i++) { for (int i = 0; i < translations.length(); i++) {
GF.Translation t = translations.get(i); GF.Translation t = translations.get(i);
outputTable.setText(i, 0, t.getFrom()); addTranslation(t.getText());
outputTable.setText(i, 1, t.getTo());
outputTable.setText(i, 2, t.getText());
} }
} }
}); });
@@ -66,7 +70,6 @@ public class Translate implements EntryPoint {
oracle = new CompletionOracle(gf); oracle = new CompletionOracle(gf);
suggest = new SuggestBox(oracle); suggest = new SuggestBox(oracle);
suggest.setWidth("50em");
suggest.setText("this cheese is warm"); suggest.setText("this cheese is warm");
suggest.addKeyboardListener(new KeyboardListenerAdapter() { suggest.addKeyboardListener(new KeyboardListenerAdapter() {
public void onKeyUp (Widget sender, char keyCode, int modifiers) { public void onKeyUp (Widget sender, char keyCode, int modifiers) {
@@ -102,21 +105,28 @@ public class Translate implements EntryPoint {
} }
}); });
HorizontalPanel hPanel = new HorizontalPanel(); HorizontalPanel settingsPanel = new HorizontalPanel();
hPanel.add(new Label("From:")); settingsPanel.addStyleName("my-settingsPanel");
hPanel.add(fromLangBox); settingsPanel.setVerticalAlignment(HorizontalPanel.ALIGN_MIDDLE);
hPanel.add(new Label("To:")); settingsPanel.add(new Label("From:"));
hPanel.add(toLangBox); settingsPanel.add(fromLangBox);
hPanel.add(translateButton); settingsPanel.add(new Label("To:"));
settingsPanel.add(toLangBox);
settingsPanel.add(translateButton);
outputTable = new Grid(0, 3); outputPanel = new VerticalPanel();
outputPanel.addStyleName("my-translations");
// CSS debug
// addTranslation("hello");
// addTranslation("world");
VerticalPanel vPanel = new VerticalPanel(); VerticalPanel vPanel = new VerticalPanel();
vPanel.setWidth("100%"); vPanel.setWidth("100%");
vPanel.setHorizontalAlignment(VerticalPanel.ALIGN_CENTER); vPanel.setHorizontalAlignment(VerticalPanel.ALIGN_CENTER);
vPanel.add(suggest); vPanel.add(suggest);
vPanel.add(hPanel); vPanel.add(settingsPanel);
vPanel.add(outputTable); vPanel.add(outputPanel);
RootPanel.get().add(vPanel); RootPanel.get().add(vPanel);

View File

@@ -1,12 +1,23 @@
/** Add css rules here for your application. */ /** Add css rules here for your application. */
.gwt-SuggestBox {
/** Example rules used by the template application (remove for your app) */ width: 70%;
.pc-template-btn { font-size: 150%;
display: block; margin: 1em 0 0.5em 0;
font-size: 16pt
} }
#pc-template-img { .my-settingsPanel * {
margin-top: 20px; margin: 0 0.4em;
}
.my-translations {
margin-top: 1em;
}
.my-translation {
border-width: 0 0 0 0;
border-style: solid;
border-color: silver;
padding: 0.2em;
font-size: 150%;
} }