style css and gwt

83 views
Skip to first unread message

Assiya EL

unread,
May 2, 2012, 4:25:35 PM5/2/12
to google-we...@googlegroups.com


hello,

I would like to add the following html menu style http://css.mammouthland.net/menu-horizontal-en-css.php  in my menu in gwt


package com.ql.client;

import com.google.gwt.user.client.Command;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Window;
//import com.google.gwt.user.client.ui.Button;
//import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.RootPanel;
//import com.google.gwt.user.client.ui.Widget;
import com.google.gwt.user.client.ui.MenuBar;
import com.google.gwt.user.client.ui.MenuItem;


public class Menu implements EntryPoint, Command  {

  public void onModuleLoad() {
    
    //création de la barre du menu 
    
    MenuBar menu = new MenuBar();
    menu.setAutoOpen(true);

    MenuBar subMenu = new MenuBar(true);
   subMenu.addItem("<code>Code</code>", true, this);
    subMenu.addItem("<strike>Strikethrough</strike>", true, this);
    subMenu.addItem("<u>Underlined</u>", true, this);

    // les fils du premier parent 
    MenuBar menu0 = new MenuBar(true);
    menu0.addItem("More &#187;", true, subMenu);
    
    // les fils du 2 eme parent 
    MenuBar menu1 = new MenuBar(true);;
   menu1.addItem("<font color='#8BEE13'><b>D</b></font>", true, this);
    
    //les fils du 3 eme parent
    MenuBar menu2 = new MenuBar(true);
   
    menu2.addItem("<code>!!!</code>", true, this);
    
    //les fils du 4 eme parent
    MenuBar menu3 = new MenuBar(true);
    
    // les éléments parents du menu

    menu.addItem(new MenuItem("F", menu0));
    menu.addItem(new MenuItem("E", menu1));
    menu.addItem(new MenuItem("A", menu2));
    menu.addItem(new MenuItem("G", menu3));

    // le menu prend la totalité de la page
    menu.setWidth("100%");
 
//ajouter menu au panel root
    RootPanel.get().add(menu);
  }
  public void execute() {
    Window.alert("a menu item.");
  }  
}


thank you for help
--
 
Assiya EL
Master Qualité du Logiciel 



Plz consider environment - Only print this if necessary


mukarev

unread,
May 5, 2012, 11:58:02 AM5/5/12
to google-we...@googlegroups.com

hi assiya,

where's your problem?

You just need to add css styles to your menuitems.

You can do this like you prefer: Via UiBinder or via CSSResource or via plain old css styles refered by the setStyleName()- or addStyleName()-methods. You should add your costum style to every instance of a MenuItem. Another possibility is to override or simply change the standard gwt styles - maybe in dark.css or what you prefer to use.

If this doesn't solve your problem, please tell again.

Greetz,
mukarev

Assiya EL

unread,
May 5, 2012, 12:13:04 PM5/5/12
to google-we...@googlegroups.com
hi ;

thank you for your reply 

my problem is that I can not know which menu item I have to add such a styleANNOUNCED a html tag in the example

I tried both methods and uibinder but not so much the same result 

2012/5/5 mukarev <muk...@googlemail.com>

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/Pn4qjsKvluEJ.
To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.

mukarev

unread,
May 5, 2012, 1:06:37 PM5/5/12
to google-we...@googlegroups.com
Hi,

I don't get your problem exactly - but here as an example:

MenuBar myMenu = new MenuBar();

MenuItem myMenuItem = new MenuItem();
myMenuItem.setStyleName("my-css-style");
//do some more stuff

myMenu.addItem(myMenuItem);

If you really want to add html tags to yur menu ( I cannot imagine why) and you want them to have your style, you could do it like this:

subMenu.addItem("<code class="my-css-style">Code</code>", true, this); 


This link may help you.

Greetz,
mukarev


Am Samstag, 5. Mai 2012 18:13:04 UTC+2 schrieb assiya:
hi ;

thank you for your reply 

my problem is that I can not know which menu item I have to add such a styleANNOUNCED a html tag in the example

I tried both methods and uibinder but not so much the same result 

2012/5/5 mukarev <>

To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to google-web-toolkit+unsub...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.

mukarev

unread,
May 5, 2012, 1:09:34 PM5/5/12
to google-we...@googlegroups.com
Ok, correct myself a little:

MenuBar menuBar = new MenuBar();
Command myCommand = new Command() {
@Override
public void execute() {
//do something when menuitem is clicked
}
};
MenuItem menuItem = new MenuItem("myText", myCommand);
menuItem.setStyleName("my-css-style");
menuBar.addItem(menuItem);

Am Mittwoch, 2. Mai 2012 22:25:35 UTC+2 schrieb assiya:
Reply all
Reply to author
Forward
0 new messages