Hi Jeanne, You're definitely right! I wasn't too attentive. I just thought in one project's scope. But if one wants to ship a custom component in a jar, for use in multiple projects, then indeed skin-additions are needed.
In the case of only one project where you have custom skins (usually extending existing ones) it's enough to just use the skin-selectors in the custom skins and it will work. Regards, -- Cristi Toth ------------- Codebeat www.codebeat.ro On Fri, Mar 14, 2008 at 4:30 PM, Jeanne Waldman <[EMAIL PROTECTED]> wrote: > Hi Cristi, > I don't understand how if you wrote a custom component you wouldn't need > a skin addition. > Skin additions are a way for you to push your skinning into an existing > skin. > > Let's say there is the 'simple' skin and a 'suede' skin and they are > defined > with skinning for the existing Trinidad components. Now you create a new > component. > You want to 'push' your 'simple' skin implementation and 'suede' skin > implementation > into these skins, so a user can use the Trinidad components + your > component > in simple or suede skin. > > When developing a custom component, you jar up that component and the > skin information > (META-INF/trinidad-skins.xml and your skin info) > In trinidad-skins.xml, you'd add > <skin-addition> > <skin-id>simple.desktop</skin-id> > <style-sheet-name>yourCustomComponentsSimpleDesktop.css</ > </skin-addition> > <skin-addition> > <skin-id>suede.desktop</skin-id> > <style-sheet-name>yourCustomComponentsSuedDesktop.css</ > </skin-addition> > > Cristi Toth wrote, On 3/10/2008 1:28 PM PT: > > Hi Samba, > > > > Forget the skin-additions, you don't need them. > > The key of what you want to do relies in the renderer code > > and in the way you define and use the skinning selectors. > > > > 1. Define your custom skinning selectors to be similar to the trinidad > > ones: > > > > private static final String CUSTOM_SKIN_SELECTOR = > > "af|component::custom-style-class"; > > > > 2.In every renderer method you'll have the RenderingContext as a > > parameter. > > It provides a couple of methods for skinning purposes. > > - rc.getStyleClass(skinSelector) > > - rc.getIcon(skinselector) > > - rc.getTranslatedString(textBundleKey) > > - rc.getSkin().getProperty(skinProperty) > > > > The most commonly used are the first 2 > > > > For using a skin-selector as a CSS style class you have to do this: > > String styleClass = rc.getStyleClass(CUSTOM_SKIN_SELECTOR); > > renderStyleClass(context, rc, styleClass); > > > > > > In the base classes of any renderer you'll find this helper methods to > > render the style attributes: > > renderStyleClass(FacesContext context, RenderingContext rc, String > > styleClass); > > renderStyleClasses(FacesContext context, RenderingContext rc, String[] > > styleClasses); > > renderStyleAttributes(FacesContext context, RenderingContext rc, > > FacesBean bean, String defaultStyleClass); > > > > For using a skinning selector for rendering an icon: > > Icon icon = rc.getIcon(CUSTOM_ICON_SKIN_SELECTOR); > > String iconURI = icon.getImageURI(context, rc).toString(); > > and use the uri as you want or use OutputUtils.renderIcon(...) methods > > > > You can take the TreeRenderer or maybe other simpler renderers as an > > example. > > > > 3. After you customized the renderer you wanted (make sure it's > > specified in faces-config.xml) > > the use the skinning selectors you defined in your usual skin file. > > (no skin-additions needed) > > > > hope this helps > > > > Cheers, > > > > On Mon, Mar 10, 2008 at 1:35 PM, Samba <[EMAIL PROTECTED] > > <mailto:[EMAIL PROTECTED]>> wrote: > > > > > > hi! > > I'm trying to modify one of the trinidad Components to add a few > > missing features. > > I read that we can use the trinidad's Skinning capabilities to > > make custom components based on trinidad also skinnable for the > > custom skin selectors.... > > > > For doing this where should I define my skin selectors? for now > > I'm directly using the CSS class name in the renderer class. > > > > I tried defining the skin css classes in a custom skin which I > > treat as a default skin for the component and it is working fine... > > But I'm not able to extend the default skin for my component and > > provide a different look... > > > > The following is the trinidad-skin.xml > > > > > > <skins xmlns="http://myfaces.apache.org/trinidad/skin";> > > > > > > <skin> > > <id> > > sample.desktop > > </id> > > <family> > > sample > > </family> > > > > <extends> > > minimal.desktop > > </extends> > > > > <render-kit-id> > > org.apache.myfaces.trinidad.desktop > > </render-kit-id> > > <style-sheet-name> > > css/defaultSkin.css > > </style-sheet-name> > > > > </skin> > > > > <skin-addition> > > <skin-id>sample.desktop</skin-id> > > </skin-addition> > > > > > > <skin> > > <id> > > sample.custom > > </id> > > <family> > > sampledemo > > </family> > > > > <extends> > > sample.desktop > > </extends> > > > > <render-kit-id> > > org.apache.myfaces.trinidad.desktop > > </render-kit-id> > > <style-sheet-name> > > css/differentSkin.css > > </style-sheet-name> > > > > > > </skin> > > > > </skins> > > > > > > > > and trinidad-config.xml > > > > <trinidad-config xmlns="http://myfaces.apache.org/trinidad/config";> > > <debug-output>true</debug-output> > > <!-- Uncomment to switch back to ALERT style client-side > validation, > > or set to DISABLED to disable it altogether > > <client-validation>ALERT</client-validation> > > --> > > <accessibility-mode>false</accessibility-mode> > > <!-- you can use EL to get the skin. This allows the skin to > > change between > > requests. --> > > <skin-family>sampledemo</skin-family> > > <!-- > > <output-mode>portlet</output-mode> > > --> > > <!-- Uncomment any of these to enable them --> > > <!-- accessibility-mode>inaccessible</accessibility-mode --> > > <client-validation-disabled>false</client-validation-disabled> > > </trinidad-config> > > > > > > > > > > > > Regards... > > Samba. > > > > > > > > > > -- > > Cristi Toth > > > > ------------- > > Codebeat > > www.codebeat.ro <http://www.codebeat.ro> >
