Difference between revisions of "Introduction to ZK WebUI"

From ADempiere
Jump to: navigation, search
This Wiki is read-only for reference purposes to avoid broken links.
(added intro)
Line 28: Line 28:
 
  import org.adempiere.webui.component.*;
 
  import org.adempiere.webui.component.*;
 
  import org.adempiere.webui.panel.ADForm;
 
  import org.adempiere.webui.panel.ADForm;
import org.compiere.util.CLogger;
 
import org.zkoss.zk.ui.event.EventListener;
 
 
import com.imedia.webui.advt.AdvTotalPage;
 
 
public class WSampleWebUIWindow extends ADForm implements EventListener {
 
 
  
 +
public class WSampleWebUIWindow extends ADForm {
  
 
/**
 
/**
Line 41: Line 35:
 
*/
 
*/
 
private static final long serialVersionUID = 7328729344548442180L;
 
private static final long serialVersionUID = 7328729344548442180L;
/** Logger. */
 
private static CLogger log = CLogger
 
.getCLogger(WComposeAdvertisement.class);
 
  
  

Revision as of 06:30, 21 March 2013

Introduction

Adempiere has adopted ZK as a standard to build thin client applicaiton. ZK is renowned for its "Ajax without JavaScript" approach since 2005, enabling developers to build rich Internet applications transparently without any knowledge of Ajax and JavaScript.

We can create custom window By using ZK Code in Adempiere instead of using swing based Window, Tab & Field.

These are the Steps to Create Custom Window

  • 1. First Create One Class to Write Window Configuration Code in this specified package org.adempiere.webui.apps.form.
  • 2. Now login as System/SystemAdministrator ,
    • a ) go to "Application Dictionary" and Find " Form " Window .
    • b ) Now create New Form , find for " class name " widget in "Form" window, there we can specify Class Location like org.adempiere.webui.apps.form.VendorPaymentBalance
    • c ) Save This Form.
  • 3. Create New Menu , In " Action " widget specity " form " , Now we get the " Special Form " Widget in Menu Widow. Here we specify form name that we have created in Step 2.
    • 4. Now we can add this Menu to the Specified Role to whom we are going to give access permission.

Now it will act as Adempiere window

In case it is not Visible after doing all the steps .login as System/SystemAdministrator

  • 1 . Open Role window , select Role to which we have given access permission
    • a ) For This Role select " form access " tab ,search for form that we have created if it is not there
    • b ) create new record in " form access" tab ,in special form add recently created form.

Now it will appear.

Sample Class

 package org.adempiere.webui.apps.form;

 import org.adempiere.webui.component.*;
 import org.adempiere.webui.panel.ADForm;

 public class WSampleWebUIWindow extends ADForm {

	/**
	 * Generated serial number
	 */
	private static final long serialVersionUID = 7328729344548442180L;


	@Override
	protected void initForm() {

        Button but = new Button("Test Button");
      
	this.appendChild(but );
	}
 }