2009-12-12 6 views
1

désolé pour la question stupide je suis nouveau à l'assurance-chômage en général et GWT spécifiquementles onglets de contrôlant la barre d'onglets dans GWT

  1. Comment puis-je contrôler les onglets largeur lors de l'utilisation des onglets dans le panneau GWT? comment
  2. comment puis-je savoir ce que les attributs css chaque widget a? je voudrais contrôler la couleur des onglets (sélectionnée et non sélectionné) et retirez le cadre onglets

grâce

Répondre

3

Si vous êtes nouveau à l'interface utilisateur en général, peut-être que vous ne connaissez pas [Firebug]. C'est un plugin Firefox qui vous permet (entre autres) d'inspecter chaque élément d'une page et de savoir comment les styles sont appliqués et même de les modifier en temps réel. C'est vital pour le développement de GWT. En outre, afin de contrôler séparément chaque style d'onglet, je pense que vous devrez insérer des étiquettes sur les onglets, en utilisant TabBar.addTab(Widget widget), et définir leurs styles.

+0

c'est ainsi que les gens savent quel contrôle gwt ajoute certains éléments html? une autre question: comment puis-je savoir quels attributs css peuvent être définis pour chaque widget gwt? sens comment savoir ce que je peux mettre. Gwt-DecoratedTabBar {} ?? merci beaucoup pour votre aide. – special0ne

+0

Je ne pense pas que cela soit documenté nulle part. Habituellement, les styles de base comme les couleurs et les polices fonctionnent bien. La plupart des éléments sont des Divs ou des Tables. Plus d'attributs "structurels", comme la largeur et le remplissage peuvent être plus compliqués. Je pense que, sauf si vous avez un concepteur qui crée les html pour vous, il est préférable de définir la disposition dans le code. – ciczan

1

Le javadoc pour les noms de style listes DecoratedTabBar vous pouvez utiliser aussi bien pour les onglets sélectionnés et non sélectionnés.

* .gwt-DecoratedTabBar { the tab bar itself } 
* .gwt-DecoratedTabBar .gwt-TabBarFirst { the left edge of the bar } 
* .gwt-DecoratedTabBar .gwt-TabBarRest { the right edge of the bar } 
* .gwt-DecoratedTabBar .gwt-TabBarItem { unselected tabs } 
* .gwt-DecoratedTabBar .gwt-TabBarItem-wrapper { table cell around tab } 
* .gwt-DecoratedTabBar .gwt-TabBarItem-selected { additional style for selected tabs } 
* .gwt-DecoratedTabBar .gwt-TabBarItem-wrapper-selected { table cell around selected tab } 
* .gwt-DecoratedTabBar .tabTopLeft { top left corner of the tab} 
* .gwt-DecoratedTabBar .tabTopLeftInner { the inner element of the cell} 
* .gwt-DecoratedTabBar .tabTopCenter { top center of the tab} 
* .gwt-DecoratedTabBar .tabTopCenterInner { the inner element of the cell} 
* .gwt-DecoratedTabBar .tabTopRight { top right corner of the tab} 
* .gwt-DecoratedTabBar .tabTopRightInner { the inner element of the cell} 
* .gwt-DecoratedTabBar .tabMiddleLeft { left side of the tab } 
* .gwt-DecoratedTabBar .tabMiddleLeftInner { the inner element of the cell} 
* .gwt-DecoratedTabBar .tabMiddleCenter { center of the tab, where the tab text or widget resides } 
* .gwt-DecoratedTabBar .tabMiddleCenterInner { the inner element of the cell} 
* .gwt-DecoratedTabBar .tabMiddleRight { right side of the tab } 
* .gwt-DecoratedTabBar .tabMiddleRightInner { the inner element of the cell} 
Questions connexes