I am looking forward to customize the look of tabView component. I need to change the color of tab headers(& if possible, 2 different colors for 2 different headers). I tried to do so by specifying the CSS rules through styleClass attribute for tabView but failed to see desired results.
How I can achieve this ?
3.0.M2 has titleStyle and titleStyleClass attributes for tab component.
http://code.google.com/p/primefaces/issues/detail?id=892
Primefaces components get the look&feel from a css theme. You can either:
Build your own theme with the desired colors with Themeroller,
Change the style classes for your theme manually. Style classes for each Primefaces component are listed in the Primefaces documentation. Since the doc is not free for most recent Primefaces version 2.2 I can only help your with the classes from Primefaces 2.1: .ui-tabs, .ui-tabs-nav, .ui-tabs-panel. Notice that there might be more style classes applying to the tab view inherited from other components. Check html source of the tabView to get all applying classes.
Use the style or styleClasses attribute as described in your answer and overwrite the theme classes with the !important declaration
Related
Ok, I have been trying to find answer for two days now. I created new Web Application and added JSF framework to it. But when I opened a palette I can see only few tags to be dragged and dropped. I can see HTML, HTML Forms and JSF categories with only about five tags in each. Do I have to add some library or something? Thank you for help.
You better get rid of Netbeans JSF palette when adding components to your page. Writing directly on the page you will be more productive because you have code completion assistance. If you look at the JSF palette it is like a set of squeleton generators more than an exhaustive components set. So basically I would use, perhaps, only the JSF Data Table [From Entity] palette item.
I am not an expert on themes but i would like to know if it is possible to accomplish that:
Once i pull a panel into a facet i am hiding the panel by disabling the output tag and setting a special css class only for the designer client.
Has somebody tried to do that automatically in themes by checking if the panel is in a facet(Maybe ask for the key: property)?
I have tried to change the panel but i dont know how to set a certain style class based on a property of the panel.
To my best knowledge: A theme styles content rendered, not attributes that define if content gets rendered or not.
You have 2 options you could use:
create your own little extension library with controls you want to use everywhere. Add one 'containerPlaceholder' (or whatever you would call it) that doesn't render any own output, but only it's children.
use a snippet you simply paste into your source code.
don't use a panel or div, but add your custom controls to the callbacks. Makes your XPage more readable (that's what I do)
Hope that helps
I have searched across the web with no luck, I know there are some predefined names, such as 'header' and 'footer' associated with the dataTable, also 'first' inside the head tag to run first this metatag.
There are other predefined names I should be aware of?
Thanks,
-M
You cannot find a predefined names list for facets. because facets are related to components. Every components supports different facets. e.g. h:datatable supports header and footer. primefaces datatable supports header, footer and emptyMessage facets. best way to find supportted facets you should look source code of component renderers. Primefaces DatatableRenderer, Mojarra TableRenderer
In Java, I can specify the location of a (for example) button somewhere in a panel. Is there an equivalent way of doing this in JSF?
Rephrasing the question:
For some type of panel (JSF component), can I specify the X and Y cordinates of where components in the panel should be placed?
I saw in PrimeFaces there is a Layout component. I was trying to add a button to it, but can not figure out a way to set the X and Y position.
In general JSF is not responsible for positioning components, it simply creates HTML markup. With "in Java" you propably mean a Swing-GUI and more specific the NullLayout (?).
The standard way of positioning components directly in HTML (which JSF generates) is via CSS stylesheets and the "position" property (example: http://www.w3schools.com/cssref/pr_class_position.asp).
You can put these positions into a separate CSS file or attach them directly to your JSF (or HTML) tags via the "style" attribute.
The layout tag from Primefaces tries to give you something like a LayoutManager in Java-Swing, whose main aim it is to avoid having to position things individually.
NOTE: As with a lot of HTML and CSS things, this may not work on every browser.
How to extend the functionality of Richfaces components for example Data table with custom header and sorting techniques. i have seen extended data table but did not get much information from it. Please point me to an example if at it is available.
Thanks
Soma
Well, you can extend a JSF component with the regular java extension (extends). You will have to extend a number of classes, depending on the exact component:
UIComponentName/HtmlComponentName
HtmlComponentNameRenderer
ComponentNameTag
and you might need to register the renderer in faces-config.xml.
You can take a look at this thread, or google for "Extend JSF component" or "Create custom JSF component".