0

Custom Components

asked 2011-02-25 08:51:24 +0800

zakhrim gravatar image zakhrim
15

Hi everybody,
I'm very new to ZK and I'm trying to develop a new component that contains a Combobox and a Testbox.
I followed the tutorial I at this link but I'm not able to render the nested components (while a static text is rendered correctly => the component is loaded correctly and then rendered).

I've tried many things, below I paste the last version of my code (that obviously doesn't work :) )
My component class

package it.innove.zk.components.localization;

import it.innove.multilanguage.Multilanguage;
import it.innove.multilanguage.entities.Language;

import java.io.IOException;
import java.io.Writer;
import java.util.Collection;

import org.zkoss.zk.ui.HtmlBasedComponent;
import org.zkoss.zk.ui.sys.ContentRenderer;
import org.zkoss.zul.Combobox;
import org.zkoss.zul.Textbox;

public class LocalizationComponent extends HtmlBasedComponent
{
	private static final long serialVersionUID = 6756061395400419971L;

	private Combobox languages = new Combobox();
	private Textbox translation = new Textbox();

	/**
	 * @return the languages
	 */
	public Combobox getLanguages()
	{
		return languages;
	}

	/**
	 * @param languages
	 *            the languages to set
	 */
	public void setLanguages(Combobox languages)
	{
		if (languages != this.languages)
		{
			this.languages = languages;
			smartUpdate("languages", this.languages);
		}
	}

	/**
	 * @return the translation
	 */
	public Textbox getTranslation()
	{
		return translation;
	}

	/**
	 * @param translation
	 *            the translation to set
	 */
	public void setTranslation(Textbox translation)
	{
		if (translation != this.translation)
		{
			this.translation = translation;
			smartUpdate("translation", this.translation);
		}
	}

	/**
	 * @see org.zkoss.zk.ui.HtmlBasedComponent#renderProperties(org.zkoss.zk.ui.sys.ContentRenderer)
	 */
	@Override
	protected void renderProperties(ContentRenderer renderer)
			throws IOException
	{
		super.renderProperties(renderer);

		render(renderer, "languages", languages);
		render(renderer, "translation", translation);
	}

	public void initialize()
	{
		@SuppressWarnings("unused")
		Collection<Language> languages = Multilanguage.loadLanguages(null);
		return;
	}
	
	/**
	 * @see org.zkoss.zk.ui.AbstractComponent#redraw(java.io.Writer)
	 */
	@Override
	public void redraw(Writer out) throws IOException
	{
		super.redraw(out);
	}
}

The widget:

it.innove.zk.components.localization.LocalizationComponent = zk.$extends(
		zk.Widget, {
			_languages : null,

			_translation : null,

			getLanguages : function() {
				return this._languages;
			},

			setLanguages : function(languages) {
				if (this._languages != languages) {
					this._languages = languages;
					if (this.desktop)
						this.$n().innerHTML = zUtl.encodeXML(this._languages);
				}
			},

			getTranslation : function() {
				return this.translation;
			},

			setTranslation : function(translation) {
				if (this.translation != translation) {
					this.translation = translation;
					if (this.desktop)
						this.$n().innerHTML = zUtl.encodeXML(this.translation);
				}
			}
		});

The mold script

function (out) {
	out.push('<span', this.domAttrs_(), '>', this.getLanguages(), '</span>');
	out.push('<span', this.domAttrs_(), '>', this.getTranslation(), '</span>');
	out.push('<span', this.domAttrs_(), '>', "MY COMPONENT", '</span>');
}

Any suggestions?

Thanks,
Stefano

delete flag offensive retag edit

2 Replies

Sort by ยป oldest newest

answered 2011-02-25 09:51:05 +0800

mjablonski gravatar image mjablonski
1284 3 5
http://www.jease.org/

Hi,

if you're composing a new component simply out of existing components, I would recommend to use the "Composite"-approach:

http://books.zkoss.org/wiki/ZK%20Developer's%20Reference/UI%20Composing/Composite%20Component

Cheers; Maik

link publish delete flag offensive edit

answered 2011-02-25 09:58:35 +0800

zakhrim gravatar image zakhrim
15

Thanks Maik, I'll give it a try!

Actually, I managed to have combo and textbox displayed by adding them to the children of my component:

	/**
	 * @see org.zkoss.zk.ui.HtmlBasedComponent#renderProperties(org.zkoss.zk.ui.sys.ContentRenderer)
	 */
	@Override
	protected void renderProperties(ContentRenderer renderer)
			throws IOException
	{
                getChildren().add(languages);
                getChildren().add(translation);

		super.renderProperties(renderer);

		render(renderer, "languages", languages);
		render(renderer, "translation", translation);
	}

but your solution looks quite easier!

Bye
Stefano

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2011-02-25 08:51:24 +0800

Seen: 437 times

Last updated: Feb 25 '11

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More