Developing the EMailEditor View (SAP Library

Developing the EMailEditor View

View Controller Context

In the context of the EMailEditor view, the value attributes EMailText, EmailAddress, and Greeting are to be declared.

Controller Context of the EMailEditor View
Context Element	Type	Properties	Value
EMailAddress	Value attribute	type	string
EMailText	Value attribute	type	string
Greeting	Value attribute	type	string

Layout of the View

The following table contains the hierarchy of the UI elements contained in the EMailEditor view. Properties linked to the value attributes are marked with the symbol This graphic is explained in the accompanying text in front of the path specification of the value attribute.

Layout of the EMailEditor View

UI Element Type	UI Element Name	Embedded in ... (Container Name)	UI Element Property	Value
Transparent Container	RootUIEelement Container		Properties of Transparent Container - layout	GridLayout
Transparent Container	RootUIEelement Container		Layout - colCount	1
TextView	HeaderText	RootUIElement Container	Properties of TextView – design	header1
			Properties of TextView – text	Greeting
			LayouData – paddingBottom	large
Label	EMailTextLabel	RootUIElement Container	Properties of Label – text	E-Mail Text:
Label	EMailTextLabel	RootUIElement Container	Properties of Label – labelFor	EMailEditorText
TextEdit	EMailEditorText	RootUIElement Container	Properties of TextEdit – cols	60
			Properties of TextEdit – rows	12
			Properties of TextEdit – value	EMailText
Button	SendEMailButton	RootUIElement Container
LinkToAction	LinkToForm	RootUIElement Container

Actions and Binding Events

In the view controller, define the two actions GoBack and SendEMail:

Controller of the EMailEditor View
Name of the Action	Text	Without Validation	Event Handler
GoBack	Go back to sample form	unchecked	onActionGoBack
SendEMail	Send E-Mail	unchecked	onActionSendEMail

Afterwards, link the onAction events of two UI elements to the two actions defined previously.

Linking Events to Actions in the EMailEditor View
UI Element Name	Event Name	Action
SendEMailButton	onAction	SendEMail
LinkToForm	onAction	GoBack

This graphic is explained in the accompanying text Now proceed with the definition of the navigation structure between the two views Form and EMailEditor!