Search code examples
jsfmobilejsf-2primefacesprimefaces-mobile

PrimeFaces Mobile ImageSwitch not displaying properly


i am developing a JSF application with Primefaces Mobile (v5.0) running on a Wildfly (v8.0) Application Server. I have set the default render-kit in my faces-config.xml to PrimeFaces Mobile like this:

<default-render-kit-id>PRIMEFACES_MOBILE</default-render-kit-id>

I want to use the ImageSwitch component of PrimeFaces which is not mobile currently. With the render-kit set like above it is not showing properly, but if i delete the line from my faces-config.xml it works just fine.

This is my code for the ImageSwitch component:

<p:imageSwitch effect="fade" id="fadeEffect">
   <ui:repeat value="#{userBean.currentUser.images}" var="image" id="fadeEffectImages">
      <p:graphicImage name="/fileDb/#{image.filename}" id="image" />
   </ui:repeat>
</p:imageSwitch>

Is there any way to use this component with PrimeFaces Mobile? Or is there any other way to achieve a similar effect?


Solution

  • I was facing the same issue. The problem seems to be associated with the default render kit declaration in faces-config. I got it solved by using a 3rd party jQuery Plugin called Cycle2, which provides similar effects. As PrimeFaces has jQuery already included you just have to add one script to your xhtml page.

    Just have a look at the homepage http://jquery.malsup.com/cycle2/

    There is also a quite good documentation and some demos.

    Maybe this helps you, too.