Gone are the days to manually enter in hex codes to select colors.
<div class="card">
<h:form>
<h5 class="p-mt-0">Inline</h5>
<p:colorPicker value="#{colorView.colorInline}" mode="inline" />
<h5>Popup</h5>
<p:colorPicker value="#{colorView.colorPopup}" />
</h:form>
</div>
@Named
@RequestScoped
public class ColorView {
private String colorInline;
private String colorPopup;
public String getColorInline() {
return colorInline;
}
public void setColorInline(String colorInline) {
this.colorInline = colorInline;
}
public String getColorPopup() {
return colorPopup;
}
public void setColorPopup(String colorPopup) {
this.colorPopup = colorPopup;
}
public void onColorChange(AjaxBehaviorEvent e) {
ColorPicker picker = (ColorPicker) e.getComponent();
FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Color changed: " + picker.getValue(), null);
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void onPopupClosed(AjaxBehaviorEvent e) {
ColorPicker picker = (ColorPicker) e.getComponent();
FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Popup closed: " + picker.getValue(), null);
FacesContext.getCurrentInstance().addMessage(null, msg);
}
}