SAPUI5 Beginners tutorial part 2

Lets go thru the next tutorial folks..

where to start?? Lets do start with explanation of part1

First and foremost thing after inclusion of meta tags is..”Including libraries and themes(data-sap-ui-libs= “sap.m” data-sap-ui-theme= “sap_mvi”)”. Lets begin with this for now..

What are libraries and why we should include?

A class library is a collection of prewritten class es or coded templates, any of which can be specified and used by a programmer when developing an application program. Once we include this library, then we can access those functions,methods etc that are defined in the library class.

Libraries in SAPUI5:

Most used libraries are sap.ui and sap.m

sap.ui : Lets exlpore the sap.ui here

sap.m : Exlpore sap.m here

The sap.ui namespace is the central OpenAjax compliant entry point for UI related JavaScript functionality provided by SAP.

Namespaces & Classes
base SAPUI5 base classes
***commons SAPUI5 library with most common controls. 
***core The SAPUI5 Core Runtime.
Device Device and Feature Detection API of the SAP UI5 Library.
layout SAPUI5 library with layout controls.
model The SAPUI5 Data Binding API.
richtexteditor SAPUI5 library with rich text editor.
***table SAPUI5 library with table controls.
unified SAPUI5 unified library
***ux3 SAPUI5 library with controls that implement the SAP User Experience (UX) Guidelines 3.0
vbm SAP UI library: sap.ui.vbm
Note: *** are important classes that used frequently in sapui5.
For controls in sapui5 clickhere

Explore themes..

SAPUI5 provides a number of themes. The theme used in this example is called ‘sap_platinum’. You can find other themes in the /resource/sap/ui/*/themes folders. Here are screenshots of the same page using the other themes (click the images to enlarge):

imageTheme: sap_goldreflection imageTheme: sap_ux
imageTheme: sap_hcb imageTheme: base

From: http://allthatjs.com/2012/02/23/getting-started-with-sapui5/

Explore screenshots of ui5 runtime folder now..For download clickhere

10-05-2014 14-34-04

ui5->resources

10-05-2014 14-34-25

ui5->resources->sap

10-05-2014 14-34-36

ui5->resources->sap->m

10-05-2014 14-35-09

ui5->resources->sap->m->themes

10-05-2014 14-35-23

Here you can see 4 themes that can be used in data-sap-ui-theme= “***”

ui5->resources->sap->ui

10-05-2014 14-35-39

Advertisements

One thought on “SAPUI5 Beginners tutorial part 2

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s