Liferay Android SDK for Mobile Application Development

Introduction

Liferay is very robust web portal in the market which follows JSR 168 and JSR 286 standards.

Liferay has introduced Liferay Android SDK to develop applications using Liferay portal web service.

Liferay is supporting JSON web service from which we can develop mobile applications.

Liferay have service builder tool for creating web services for liferay applications. We simple call this web service so that we can get dynamic data that we can display in Mobiles Applications. This is very useful when we develop dynamic mobile applications.

Liferay have SOAP and REST supported web services.

If we want used HTML5 Mobile apps for Cross platform then we can Use PhoneGap

PhoneGap is frame work from which we can design mobile apps using HTML5 and Java Script. These applications can run in any mobile platforms.

This phone gap provide flexibility to create Mobile Application for any mobile platform like Android, iOS, Black Berry and Firefox Mobile OS

We can use Ajax in HTML5 to consume Restful web services.

We already have very rich java script libraries for Ajax like Jquery, DOJO, YUI and AUI.

In any application only one thing is consuming web services.

The following is location where we can get more information about PhoneGap

http://phonegap.com/

The following is location you can get Liferay Android SDK and Sample Application

https://github.com/liferay/liferay-mobile-sdk

https://github.com/brunofarache/liferay-mobile-sdk-sample-android

The following is Liferay Android Tutorial

http://www.liferaysavvy.com/2012/11/liferay-android-application.html

The following is create web services and using liferay web services in other platforms

http://www.liferaysavvy.com/2013/11/liferay-custom-json-web-services-on.html

http://www.liferaysavvy.com/2012/11/exposing-liferay-custom-json-web_26.html

http://www.liferaysavvy.com/2012/11/java-client-to-consuming-liferay-json.html

http://www.liferaysavvy.com/2012/12/liferay-jersey-restful-web-services.html

http://www.liferaysavvy.com/2013/08/liferay-dwr-json-web-services-portlet.html

http://www.liferaysavvy.com/2013/08/liferay-dwr-portlet.html

Author

Meera Prince

http://www.liferaysavvy.com/

http://hk.linkedin.com/in/liferaysavvy

Read More

Simple Way to Use Forms in Liferay Web Content

Objective:

Use forms in liferay web content.

When we need any form submission we need to create form in portlet and later we need maintain this data in one place but this can be done by developer but administrator can’t this.

So for this reason we need to embed some forms in web content of liferay. Create forms and manage forms one place and using form in any web applications.

HubSpot is one application where we can create forms and manage forms. Once we create form we can embed this forms in anywhere in the application.

Steps to implement

1. Register with HubSpot and get 30 days trail account
2. Create form in HubSpot
3. Get Form Embedded Java Script from HubSpot
4. Use embed Java Script in Liferay Web Content
5. Manage From Submission Data in HubSpot

Register with HubSpot and get 30 days trail account

HubSpot one of the web applications so that we can create forms and manages forms. Internally it used Orbeon Form Builder Open Source for create forms and manage forms.

Go to following web site and click on Free Trail Account

http://www.hubspot.com/

The following screen is Home page of HubSpot

Once you click on registration screen then you will get screen will ask information as follows

Once you successfully created account you will get 30days free trail so that you can explore more here.

Here we will consider only one part that is Form Creation, Manage Forms and Using Form from HubSpot.

Create form in HubSpot

Once you get account we need to login to website as soon as we login we will navigate to our account home page and we have many menu option in navigation. We have dashboard there we can see all things at one place

The following is Dashboard Screen

Now go to Right side Vertical menu and click on Forms Option as follows

Once we click on form then we can navigate form build screen where we can create the forms.

The following is form builder screen

Now create form according to our requirement. We need to Click Create New Form button.

Once we click then we can see form builder so that it having many option to create forms. It also provides some default templates to ready use and we can customize.

Assume we will create one Contact from

Once we will click on create new form it will ask the form name as follows

Once we enter form name and we can select either form build from scratch or create from existed templates. Choice is up you.

 Assume we will select the option start from Templates.

The following screen is creating form using templates and we have two templates from which we have selected basic contact from. Once select then click on Create from

The following is screen show from creation from template

Once we selected template and click on create from then we can see form builder tool which have basic contact from template. Now we can add some new fields then we can save the form and we can publish the form.

We have different buttons Save, Preview and Actions

Once we design is completed then we need to save the form and before we can see the preview also.

Get Form Embedded Java Script from HubSpot

As of now we have designed the contact from now we need to get embedded java script code so that we can use this code in any application or any html page.

For those wee need click on Action button and we need select embed option from Actions

The following screen shows Action button and embed option

Once we click on embed option we will get Pop Up there you can see the Java Script Code. This code can be used in Html page or application.

The following screen shows form embed Java Script

Note:

We can give redirect URL so that after form submission it will navigate to specified web URL.

Use embed Java Script in Liferay Web Content

Now we already create the form in HubSpot and we also get the from embed Java Script then we will use this embed Java Script in liferay web content.

Now create web content in liferay using Web Content Display portlet

Login as Admin in liferay portal and go to add in the dock bar and add Web Content Display portlet to page.

The following screen shows after admin login into liferay portal.

The following screen is after add Web Content Display portlet to page

Now click on Add web content icon now we will get the CK Editor to design Content

The following is CK Editor to add web content in liferay

Now we will design the web content and we need to add Form Embed Java Script to this web content.

For this we need to choose CK Editor Source option so that we can see web content as HTML.

Once we choose Ck Editor Source now paste the Form Embed Java Script code in the HTML

The following is Add From Embed Java Script to Liferay Web Content.

Once we done click on save then form will be available in Web Content Display portlet then we can submit form.

The following screen is From in Liferay web content display portlet

Manage From Submission Data in HubSpot

Well we already done all the steps now where we can see the form data?

Now login into HubSpot in the top navigation select Contacts and then choose Lists

The following screen shows you List option in HubSpot.

Once we click on List we can see all froms that we designed. If we click on any for respetcive submissions you can see.

The following screen shows you list of forms

When we click on form then we can see all submissions as follows

When we click on individual item we can see the data of individual submission as follows

Note:

This is start point I just showed how use forms in liferay web content we can explore more and all the best.

We can use this Form Embed Java Script in any HTML page. This form helps us more in Static websites.

Important Points

HubSpot is application there we can create forms, manage form submission data and use forms in other applications.

We can use Form Embed Java Script in any HTML page so that we can submit the data. The submission data will be manages in HubSpot.

HubSpot uses the Orbeon from Builder tool for create and manage forms and it complete open source java based technology.

We can also integrate Orbeon from in Liferay for more details go to Orbeon website

http://www.orbeon.com/

Interesting one liferay also used HubSpot from in their website.

The following is link to see HubSpot forms in liferay.

https://www.liferay.com/products/liferay-portal/get-price-quote

Author

Meera Prince

http://www.liferaysavvy.com/

http://hk.linkedin.com/in/liferaysavvy

Read More

Using BLOB Data Type in Liferay Service Builder

Objective:

Use Blob data type in liferay service builder when we work with liferay Plugin portlet development.

Environment:

Liferay 6.2 +Tomcat 7.x+MySQL 5.1

Note:

The code will work for portal 6.2 version we can also try for other portal versions.

Download Blob Service Builder portlet from following location

You can find source and war file

https://sourceforge.net/projects/meeralferay/files/BlobServiceBuilderPortlet/

Portlet Screen:

Procedure for deploy portlet:

You can use war file and directly place in your portal deploy folder and test or you can also use source to deploy portlet.

Once portlet is deployed successfully you can see the portlet in sample category name as Blob Service Builder.

Blob is one of the data type in relation data bases which is used to store large amount of data in database.

Liferay service builder support the blob data type so that we can use this feature to add large amount of data in database. Generally we want store images or file content then we can use this blob data type in service builder.

When we blob data type in service builder it will generate Util classes and service builder generate SQL script that will execute when we deploy portlet in liferay portal.

Steps to implement blob in Service Builder

1. Create liferay MVC portlet using Liferay IDE in eclipse
2. Create service.xml file in portlet WEB-INF directory
3. Create entity and define blob column for entity
4. Run service builder check for auto generated java classes.
5. Create Persistence object and fill data in object
6. Add Persistence objet to database

Create liferay MVC portlet using Liferay IDE in eclipse

Create one Liferay MVC portlet using liferay IDE in eclipse. This pretty easy because this default portlet in liferay development.

Create service.xml file in portlet WEB-INF directory

Now create one service.xml file in portlet WEB-INF directory

Create entity and define blob column for entity

Once we create service.xml we need define our entity so that we can store data in the database.

And define columns for entity and choose one of the column data type BLOB.

Add following content in service.xml

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE service-builder PUBLIC "-//Liferay//DTD Service Builder 6.1.0//EN" "http://www.liferay.com/dtd/liferay-service-builder_6_1_0.dtd"> <service-builder package-path="com.meera.blobsb">             <author>E5410</author>             <namespace>meera</namespace>             <entity name="Photo" local-service="true" remote-service="true">                         <!-- PK fields -->                         <column name="photoId" type="long" primary="true" />                         <!-- Audit fields -->                         <column name="photoName" type="String" />                         <column name="owner" type="long" />                         <column name="data" type="Blob" />             </entity> </service-builder>

Note:

Observe above XML file we can see Blob data type for column

Run service builder check for auto generated java classes

Once we define entity in service.xml file now we have run service builder so that it will generate necessary java classes and SQL script which will required interacting with database.

It will generate all model and data base service util classes so that we can interact with data base table to store images or file content.

To run service builder go to ANT view in eclipse and double click on build-service.

From command prompt we can use ant build-service

The following is example screen for ant view in eclipse

Once we run service builder it will generate required java classes and SQL scripts. Here we will some service util classes to interact with data base table.

The following are example for generated java classes after run service builder.

The following is SQL script generated by service build in SQL directory in table.sql

Here our entity is Photo

Name Space is meera

When we create table service build always add name space before entity name which we provided in service.xml

Table Name:

meera_Photo (NameSpace_EntityName  )

create table meera_Photo (             photoId LONG not null primary key,             photoName VARCHAR(75) null,             owner LONG,             data_ BLOB );

Create Persistence object and fill data in object

Once we generate classes now we need to create Persistence object to require table and we need pass data to object. This code we have to write wherever you are going to add data to the table generally we will write in action class.

To interact with table we will use XXXLocalServiceUtil class which has many methods to interact with table.

Create Persistence object for entity and we need to set required data to object using persistence object.

Persistence object expect Blob as parameter so we need set Blob using setter method

Here we will get any image or content as file and we will convert to InputStream and then we will convert it to Blog object.

Finally The code as follows

UploadRequest uploadRequest=PortalUtil.getUploadPortletRequest(actionRequest); File photoImage = uploadRequest.getFile("photo"); String title=ParamUtil.getString(uploadRequest,"title"); InputStream fis =new FileInputStream(photoImage); OutputBlob dataOutputBlob = new OutputBlob(fis, photoImage.length()); Photo photo=PhotoLocalServiceUtil.createPhoto(CounterLocalServiceUtil.increment()); photo.setPhotoName(title); photo.setOwner(10153); photo.setData(dataOutputBlob); photo=PhotoLocalServiceUtil.addPhoto(photo);

Add Persistence objet to database

Once we ready with persistence object then we will add to database using XXXLocalServiceUtil java class

The following is code for add persistence object to table

Photo photo=PhotoLocalServiceUtil.addPhoto(photo);

The following screen shot of data base table after store data in table

Important Points

• Liferay serviced build is too to create database service to portlet.
• Liferay service build will generate necessary java classes and SQL script which we need to interact with database.
• Liferay service builder will provide Util classes so we can use those classes to do CURD operations on table.
• Liferay service builder generate classes which internally implemented from Hibernate and Spring frame works.
• Liferay service builder can do most of the data base operation in some case if requirement is beyond CURD operations then we have to implement ourselves and it provide some custom implementation feature so we can achieve our requirements at maximum level.

Related Links

http://www.liferaysavvy.com/2013/12/liferay-62-portal-development.html

http://www.liferaysavvy.com/2013/12/liferay-portal-development-introduction.html

http://www.liferaysavvy.com/2013/12/liferay-62-portal-installation_11.html

Author

Meera Prince

Read More