1

Multiline Messagebox updated

asked 2009-07-05 15:45:33 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

updated 2014-05-02 17:18:50 +0800

Hi all,

i have updated my Multiline Messagebox. See a picture Normal here Changed colour here. With long text here.

Have fun.

regards Stephan

multiLineMessageBox.zul

<?xml version="1.0" encoding="UTF-8"?>
<?page title="Multiline Messagebox" language="xul/html"?>

<window title="${arg.title}" border="none" width="300pt" closable="true"
    use="org.zkoss.zul.impl.MessageboxDlg">
                     <hbox>
                <div class="${arg.icon}" />
                <div sclass="z-messagebox" width="100%">
                    <label multiline="true" value="${arg.message}"
                        sclass="word-wrap" width="100%" />
                </div>
                <div width="10px" />
            </hbox>
    <separator bar="true" />
    <hbox style="margin-left:auto; margin-right:auto">
        <button id="btn1" identity="${arg.OK}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button" if="${!empty arg.OK}" />
        <button identity="${arg.CANCEL}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button"
            if="${!empty arg.CANCEL}" />
        <button identity="${arg.YES}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button" if="${!empty arg.YES}" />
        <button identity="${arg.NO}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button" if="${!empty arg.NO}" />
        <button identity="${arg.RETRY}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button"
            if="${!empty arg.RETRY}" />
        <button identity="${arg.ABORT}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button"
            if="${!empty arg.ABORT}" />
        <button identity="${arg.IGNORE}" sclass="z-messagebox-btn"
            use="org.zkoss.zul.impl.MessageboxDlg$Button"
            if="${!empty arg.IGNORE}" />
    </hbox>
</window>

or with color changes

<?xml version="1.0" encoding="UTF-8"?>
<?page title="Multiline Messagebox" language="xul/html"?>

<window border="none" width="300pt" closable="true"
    use="org.zkoss.zul.impl.MessageboxDlg">

    <style dynamic="true">
        .myMultiMessageBox .z-panel-header { background: #FC7A7C -1px;
        font-weight:bold; zoom: 1; border: 1px solid; line-height:
        15px;} .myMultiMessageBox .z-panel-body { border-style:none
        solid solid; border-width:0 1px 1px; overflow:hidden;
        padding:0px; }
    </style>

    <panel title="${arg.title}" border="normal"
        sclass="myMultiMessageBox">
        <panelchildren>
<hbox>
                <div class="${arg.icon}" />
                <div sclass="z-messagebox" width="100%">
                    <label multiline="true" value="${arg.message}"
                        sclass="word-wrap" width="100%" />
                </div>
                <div width="10px" />
            </hbox>
            <separator bar="true" />
            <hbox style="margin-left:auto; margin-right:auto">
                <button id="btn1" identity="${arg.OK}"
                    sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.OK}" />
                <button identity="${arg.CANCEL}"
                    sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.CANCEL}" />
                <button identity="${arg.YES}" sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.YES}" />
                <button identity="${arg.NO}" sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.NO}" />
                <button identity="${arg.RETRY}"
                    sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.RETRY}" />
                <button identity="${arg.ABORT}"
                    sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.ABORT}" />
                <button identity="${arg.IGNORE}"
                    sclass="z-messagebox-btn"
                    use="org.zkoss.zul.impl.MessageboxDlg$Button"
                    if="${!empty arg.IGNORE}" />
            </hbox>
            <separator></separator>
        </panelchildren>
    </panel>
</window>

MultiLineMessageBox.java

package org.myfirm.webui.util;

import org.zkoss.zul.Messagebox;

/**
 * Extended messagebox that can show multilined messages. <br>
 * Lines can be breaked with the \n . <br>
 * <br>
 * 
 * @author Stephan Gerth / Forsthaus Datentechnik
 * @email sge(at)forsthaus(dot)de
 * @changes 04.07.2009/sge extended for showing the icons <br>
 *          05.07.2009/sge added an empty line before and after the message. <br>
 *          08.07.2009/sge added for the EventListener
 * 
 */
public class MultiLineMessageBox extends Messagebox {

    private static final long serialVersionUID = 1L;
    // path of the messagebox zul-template
    private static String _templ = "/WEB-INF/pages/util/multiLineMessageBox.zul";

    public MultiLineMessageBox() {
    }

    public static void doSetTemplate() {
        setTemplate(_templ);
    }

    /**
     * Shows a message box and returns what button is pressed. A shortcut to
     * show(message, null, OK, INFORMATION). <br>
     * <br>
     * Simple MessageBox with customizable message and title. <br>
     * 
     * @param message
     *            The message to display.
     * @param title
     *            The title to display.
     * @param icon
     *            The icon to display. <br>
     *            QUESTION = "z-msgbox z-msgbox-question"; <br>
     *            EXCLAMATION = "z-msgbox z-msgbox-exclamation"; <br>
     *            INFORMATION = "z-msgbox z-msgbox-imformation"; <br>
     *            ERROR = "z-msgbox z-msgbox-error"; <br>
     * @param buttons
     *            MultiLineMessageBox.CANCEL<br>
     *            MultiLineMessageBox.YES<br>
     *            MultiLineMessageBox.NO<br>
     *            MultiLineMessageBox.ABORT<br>
     *            MultiLineMessageBox.RETRY<br>
     *            MultiLineMessageBox.IGNORE<br>
     * @param padding
     *            true = Added an empty line before and after the message.<br>
     * 
     * 
     * @return
     * @throws InterruptedException
     */
    public static final int show(String message, String title, int buttons, String icon, boolean padding) throws InterruptedException {

        String msg = message;

        if (padding == true) {
            msg = "\n" + message + "\n\n";
        }

        if (icon.equals("QUESTION")) {
            icon = "z-msgbox z-msgbox-question";
        } else if (icon.equals("EXCLAMATION")) {
            icon = "z-msgbox z-msgbox-exclamation";
        } else if (icon.equals("INFORMATION")) {
            icon = "z-msgbox z-msgbox-imformation";
        } else if (icon.equals("ERROR")) {
            icon = "z-msgbox z-msgbox-error";
        }

        return show(msg, title, buttons, icon, 0, null);
    }

    /**
     * Shows a message box and returns what button is pressed. A shortcut to
     * show(message, null, OK, INFORMATION). <br>
     * <br>
     * Simple MessageBox with customizable message and title. <br>
     * 
     * @param message
     *            The message to display.
     * @param title
     *            The title to display.
     * @param icon
     *            The icon to display. <br>
     *            QUESTION = "z-msgbox z-msgbox-question"; <br>
     *            EXCLAMATION = "z-msgbox z-msgbox-exclamation"; <br>
     *            INFORMATION = "z-msgbox z-msgbox-imformation"; <br>
     *            ERROR = "z-msgbox z-msgbox-error"; <br>
     * @param buttons
     *            MultiLineMessageBox.CANCEL<br>
     *            MultiLineMessageBox.YES<br>
     *            MultiLineMessageBox.NO<br>
     *            MultiLineMessageBox.ABORT<br>
     *            MultiLineMessageBox.RETRY<br>
     *            MultiLineMessageBox.IGNORE<br>
     * @param padding
     *            true = Added an empty line before and after the message.<br>
     * 
     * 
     * @return
     * @throws InterruptedException
     */
    public static final int show(String message, String title, int buttons, String icon, boolean padding, EventListener listener)
            throws InterruptedException {

        String msg = message;

        if (padding == true) {
            msg = "\n" + message + "\n\n";
        }

        if (icon.equals("QUESTION")) {
            icon = "z-msgbox z-msgbox-question";
        } else if (icon.equals("EXCLAMATION")) {
            icon = "z-msgbox z-msgbox-exclamation";
        } else if (icon.equals("INFORMATION")) {
            icon = "z-msgbox z-msgbox-imformation";
        } else if (icon.equals("ERROR")) {
            icon = "z-msgbox z-msgbox-error";
        }

        return show(msg, title, buttons, icon, 0, listener);
    }

}

sample

            // Show a error box
            String msg = "Hallo \n\nI'm a multi line Message.";
            String title = "E r r o r !";
            //String title = Labels.getLabel("message_Error");

            MultiLineMessageBox.doSetTemplate();
            MultiLineMessageBox.show(msg, title, MultiLineMessageBox.OK, "ERROR", true);

                        or

                MultiLineMessageBox.doSetTemplate();
            if (MultiLineMessageBox.show(message, title, MultiLineMessageBox.YES | MultiLineMessageBox.NO,       
                            MultiLineMessageBox.QUESTION, true, new EventListener()== MultiLineMessageBox.YES) {
                                ...}

sample long text:

    String longString1 = "Hello. I'm a long string\n\n Hello i'm the second line.\n hjdgf hgjhdgsfhsd jhgjd sfjgj gfdsfg\n\n kjdsds fjk jdsh fjdhfdjsh djsfh jkhjdsf jds jds f ";
        String longString2 = "Hello. I'm a long string\n\n Hello i'm the second line.\n hjdgf hgjhdgsfhsd jhgjd sfjgj gfdsfg ooiji ojre iorjioj girirjgijr griojgiorjg iorjgir ";
        String longString3 = "Hello. I'm a long string\n\n Hello i'm the second line.\n hjdgf hgjhdgsfhsd jhgjd sfjgj gfdsfg rok reok kre grigoirejg eopijsj jgioe gjiojg rei re";
        String longString4 = "Hello. I'm a long string\n\n Hello i'm the second line.\n hjdgf hgjhdgsfhsd jhgjd sfjgj gfdsfg rpokg orkeopkg ok rkropk gpor oprek grekopg kropkpor ";
        String longString5 = "Hello. I'm a long string\n\n Hello i'm the second line.\n hjdgf hgjhdgsfhsd jhgjd sfjgj gfdsfg rüplg reo ropekpo rekerop ok orek oprek porkeop re ";
        String longString6 = "Hello. I'm a long string\n\n Hello i'm the second line.\n hjdgf hgjhdgsfhsd jhgjd sfjgj gfdsfg pork oprkk opre opkrepok oprek kopre oprekpo rkeop rke ";
        String message = longString1 + longString2 + longString3 + longString4 + longString5 + longString6;
        String title = Labels.getLabel("message_Information");
        MultiLineMessageBox.doSetTemplate();
        MultiLineMessageBox.show(message, title, MultiLineMessageBox.OK, "INFORMATION", true);
delete flag offensive retag edit

19 Replies

Sort by » oldest newest

answered 2009-07-06 00:54:33 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

Hi,

Would you please write them into ZK How-Tos?
Thanks for the information.

/Jumper

link publish delete flag offensive edit

answered 2009-07-06 10:34:35 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

updated 2009-07-06 10:37:08 +0800

OK done here.

Stephan

PS: Perhaps, there is a spelling error in the MessageDialog.java
INFORMATION = "z-msgbox z-msgbox-imformation"

link publish delete flag offensive edit

answered 2009-07-07 00:51:58 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

Thanks, I'll fix it.

/Jumper

link publish delete flag offensive edit

answered 2012-04-11 14:41:57 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

Hi terrytornado

You always great and master . I have a question here. Can we customize the look and feel of the zk messagebox using css file.

I would like to change as follows for example
http://alkaspace.com/is.php?i=137599&img=Messagebox.jpg

Can you please help me

link publish delete flag offensive edit

answered 2012-04-11 20:28:08 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

updated 2012-04-11 20:30:14 +0800

Why not, I'm not the css specialist, but i mean you can set the address to an own css-file in the MultilineMessageBox.zul

<?xml version="1.0" encoding="UTF-8"?>
<?page title="Multiline Messagebox" language="xul/html"?>

<window border="none" width="300pt" closable="true"
	use="org.zkoss.zul.impl.MessageboxDlg">

    <style src="/pathToCss/MyStyle.css" ></style>

  . . .

best
Stephan

link publish delete flag offensive edit

answered 2012-04-12 04:48:10 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

Hi Stephan

Thank you very much

I am planning to be a CSS Specialist on ZK, I will try and post the code here later.

And also, i have one more question. Can you please look at my thread and reply
http://www.zkoss.org/forum/listComment/19205-Look-and-Feel-ZK-is-Great-Enjoy

Regards
Senthil M

link publish delete flag offensive edit

answered 2012-04-24 21:19:37 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

Hi Stephan

Actually i tried create the sample as you said. But for me, ok button is not visible . Here is the code

Mymessagebox.zul

<?xml version="1.0" encoding="UTF-8"?>
<?page title="Multiline Messagebox" language="xul/html"?>

<window title="${arg.title}" border="none" width="300pt" closable="true"
	use="org.zkoss.zul.impl.MessageboxDlg">
                     <hbox>
				<div class="${arg.icon}" />
				<div sclass="z-messagebox" width="100%">
					<label multiline="true" value="${arg.message}"
						sclass="word-wrap" width="100%" />
				</div>
				<div width="10px" />
			</hbox>
	<separator bar="true" />
	<hbox style="margin-left:auto; margin-right:auto">
		<button id="btn1" identity="${arg.OK}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button" if="$" />
		<button identity="${arg.CANCEL}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button"
			if="$" />
		<button identity="${arg.YES}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button" if="$" />
		<button identity="${arg.NO}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button" if="$" />
		<button identity="${arg.RETRY}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button"
			if="$" />
		<button identity="${arg.ABORT}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button"
			if="$" />
		<button identity="${arg.IGNORE}" sclass="z-messagebox-btn"
			use="org.zkoss.zul.impl.MessageboxDlg$Button"
			if="$" />
	</hbox>
</window>

Here is my MultiLineMessageBox

package org.myfirm.webui.util;

import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zul.Messagebox;

/**
 * Extended messagebox that can show multilined messages. <br>
 * Lines can be breaked with the \n . <br>
 * <br>
 * 
 * @author Stephan Gerth / Forsthaus Datentechnik
 * @email sge(at)forsthaus(dot)de
 * @changes 04.07.2009/sge extended for showing the icons <br>
 *          05.07.2009/sge added an empty line before and after the message. <br>
 *          08.07.2009/sge added for the EventListener
 * 
 */
public class MultiLineMessageBox extends Messagebox {

	private static final long serialVersionUID = 1L;
	// path of the messagebox zul-template
	private static String _templ = "Mymessagebox.zul";

	public MultiLineMessageBox() {
	}

	public static void doSetTemplate() {
		setTemplate(_templ);
	}

	/**
	 * Shows a message box and returns what button is pressed. A shortcut to
	 * show(message, null, OK, INFORMATION). <br>
	 * <br>
	 * Simple MessageBox with customizable message and title. <br>
	 * 
	 * @param message
	 *            The message to display.
	 * @param title
	 *            The title to display.
	 * @param icon
	 *            The icon to display. <br>
	 *            QUESTION = "z-msgbox z-msgbox-question"; <br>
	 *            EXCLAMATION = "z-msgbox z-msgbox-exclamation"; <br>
	 *            INFORMATION = "z-msgbox z-msgbox-imformation"; <br>
	 *            ERROR = "z-msgbox z-msgbox-error"; <br>
	 * @param buttons
	 *            MultiLineMessageBox.CANCEL<br>
	 *            MultiLineMessageBox.YES<br>
	 *            MultiLineMessageBox.NO<br>
	 *            MultiLineMessageBox.ABORT<br>
	 *            MultiLineMessageBox.RETRY<br>
	 *            MultiLineMessageBox.IGNORE<br>
	 * @param padding
	 *            true = Added an empty line before and after the message.<br>
	 * 
	 * 
	 * @return
	 * @throws InterruptedException
	 */
	public static final int show(String message, String title, int buttons,
			String icon, boolean padding) throws InterruptedException {

		String msg = message;

		if (padding == true) {
			msg = "\n" + message + "\n\n";
		}

		if (icon.equals("QUESTION")) {
			icon = "z-msgbox z-msgbox-question";
		} else if (icon.equals("EXCLAMATION")) {
			icon = "z-msgbox z-msgbox-exclamation";
		} else if (icon.equals("INFORMATION")) {
			icon = "z-msgbox z-msgbox-imformation";
		} else if (icon.equals("ERROR")) {
			icon = "z-msgbox z-msgbox-error";
		}

		return show(msg, title, buttons, icon, 0, null);
	}

	/**
	 * Shows a message box and returns what button is pressed. A shortcut to
	 * show(message, null, OK, INFORMATION). <br>
	 * <br>
	 * Simple MessageBox with customizable message and title. <br>
	 * 
	 * @param message
	 *            The message to display.
	 * @param title
	 *            The title to display.
	 * @param icon
	 *            The icon to display. <br>
	 *            QUESTION = "z-msgbox z-msgbox-question"; <br>
	 *            EXCLAMATION = "z-msgbox z-msgbox-exclamation"; <br>
	 *            INFORMATION = "z-msgbox z-msgbox-imformation"; <br>
	 *            ERROR = "z-msgbox z-msgbox-error"; <br>
	 * @param buttons
	 *            MultiLineMessageBox.CANCEL<br>
	 *            MultiLineMessageBox.YES<br>
	 *            MultiLineMessageBox.NO<br>
	 *            MultiLineMessageBox.ABORT<br>
	 *            MultiLineMessageBox.RETRY<br>
	 *            MultiLineMessageBox.IGNORE<br>
	 * @param padding
	 *            true = Added an empty line before and after the message.<br>
	 * 
	 * 
	 * @return
	 * @throws InterruptedException
	 */
	public static final int show(String message, String title, int buttons,
			String icon, boolean padding, EventListener listener)
			throws InterruptedException {

		String msg = message;

		if (padding == true) {
			msg = "\n" + message + "\n\n";
		}

		if (icon.equals("QUESTION")) {
			icon = "z-msgbox z-msgbox-question";
		} else if (icon.equals("EXCLAMATION")) {
			icon = "z-msgbox z-msgbox-exclamation";
		} else if (icon.equals("INFORMATION")) {
			icon = "z-msgbox z-msgbox-imformation";
		} else if (icon.equals("ERROR")) {
			icon = "z-msgbox z-msgbox-error";
		}

		return show(msg, title, buttons, icon, 0, listener);
	}

}

Here is sample index.zul

<?page title="Auto Generated index.zul"?>
<window title="Hello World!!" border="normal" width="600px">

	<label value="You are using: ${desktop.webApp.version}" />
	<button label="Warning" width="100px">
		<attribute name="onClick"><![CDATA[
	
	String msg = "Hallo \n\nI'm a multi line Message.";
	String title = "E r r o r !";
	//String title = Labels.getLabel("message_Error");
	
	org.myfirm.webui.util.MultiLineMessageBox.doSetTemplate();
	org.myfirm.webui.util.MultiLineMessageBox.show(msg, title, org.myfirm.webui.util.MultiLineMessageBox.OK, "ERROR", true);
]]></attribute>
	</button>
</window>

link publish delete flag offensive edit

answered 2012-04-24 21:22:05 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

Here is the output

http://alkaspace.com/is.php?i=138930&img=messagebox1.jpg

link publish delete flag offensive edit

answered 2012-04-24 21:22:31 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

link publish delete flag offensive edit

answered 2012-04-25 08:11:59 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

Hi

Even i put some height as 500pt in the window. But still ok button is not visible.

Can you please help me

Regards
Senthil
http://emrpms.blogspot.in/

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: 2009-07-05 15:45:33 +0800

Seen: 2,604 times

Last updated: May 02 '14

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