Professional Documents
Culture Documents
Module ABAP
SAPInteractiveFormsbyAdobe
Module Objectives
Introduction
Adobe LiveCycle Designer
Components of Adobe Application
Development Flow
Tips and Tricks
Adobe Application Portal
Output types
More on Layout Editor
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 6
Adobe LiveCycle Designer
Introducti Adobe LiveCycle DesignerES2 is a point-and-click graphical
on
form design tool that simplifies the creation of forms.
LiveCycle
Form recipients can fill a form online, submit the data, and
Designer
print it, or print and fill the form by hand.
Compone
nts You can design a form, define its logic, and modify it to match
paper counterparts or to meet strict legislative requirements.
Developm
ent These forms provide improved usability and reduced data
Flow entry errors.
Tips & With DesignerES2, you can integrate PDF documents into
Tricks
existing workflows by binding forms to XML schemas, XML
sample files, databases, and web services.
Adobe
Applicatio
Forms and documents that are created in DesignerES2 can be
n
Portal
merged with business data and rendered as a number of file
types, including Adobe PDF, HTML, SWF, and printing for PCL,
Output Adobe PostScript and Zebra (ZPL) printers.
4/30/17
types VACS Technology Pvt. 7
Components of Adobe Application
Introducti
on An independent unit of Adobe application consists of the
following
LiveCycle technical objects:
Designer
Adobe Interface
Compone
nts
Adobe Form and its generated function module
Developm
ent Driver Program
Flow
Data Dictionary Objects (Structures and Table Types)
Tips &
Tricks
Customization:
Adobe
Applicatio a) Output Type
n b) Output Determination Procedure
Portal c) Print Parameters
Output
4/30/17
types VACS Technology Pvt. 8
T-code
Introducti T-code for creating Adobe Forms is SFP
on
LiveCycle
SFP allows us access to Adobe Forms and Interfaces
Designer
Adobe Interfaces need to be created before the Adobe
Compone Form, which would then refer to it
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 9
Adobe Interface
Introducti Adobe Form Interface contains:
on
Output
4/30/17
types VACS Technology Pvt. 10
Adobe Interface
Introducti An Adobe Forms Interface is similar to that of Smart Forms
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 11
Application Overview
Introducti
on The Adobe Form Application has the following visibly
differentiable parts:
LiveCycle
Designer
1 Properties Set at the time of creating the
Compone Adobe Form
nts
2 Context Maps directly with Data View
Developm Tab providing data drag-drop
ent into the layout workspace
Flow
3 Layout Editor Layout editing
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 12
Components of Layout Editor
Introducti
on The Layout editor consists of the following parts:
Tips &
See link:
Tricks
http://help.adobe.com/en_US/livecycle/9.0/designerHelp/
index.htm?content=000001.html
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 13
Graphical View of Layout Editor
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 14
Layout Editor Palettes
Introducti The Layout Editor provides a effective and neatly arranged
on
interface with the following component hierarchy:
LiveCycle
Left Pane The left pane consists of two tabs:
Designer
a) Hierarchy
Compone
nts b) Data View
LiveCycle a) Object
Designer i) Field
ii) Value
Compone iii) Binding
nts
b) Data View
Developm iv) Size & Position
ent v) Margin
Flow vi) Caption
Tips &
c) Report
Tricks
d) Script Editor
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 16
Layout Editor Palettes
Introducti Data View
on
Data View is, as the name suggests, the data
LiveCycle
flowing into the
Designer
Adobe Form via the interface.
Compone
nts Only those data items will be visible under the
Data View Tab
Developm that have been pulled from the interface under the context
ent of the Adobe
Flow Form.
Output
4/30/17
types VACS Technology Pvt. 17
Layout Editor Palettes
Introducti Right Pane
on
a) Object (Field, Value, Binding)
LiveCycle b) Layout ( Size & Position, Margin, Caption )
Designer c) Border
d) Accessibility
Compone e) Library
nts
I. My Favorites
II. Standard
Developm
ent III. Custom
Flow IV. Barcodes
V. Form builder
Tips & VI. Webdynpro Activex
Tricks VII. Webdynpro Native
VIII. ISR Controls
Adobe IX. ISR Native Controls
Applicatio f) Font and Paragraph
n g) Drawing Aids
Portal h) Info
i) How to
Output
4/30/17
types VACS Technology Pvt. 18
Layout Editor Right Palettes
Introducti The Right Pane consists of the following palettes:
on
a) Object
LiveCycle b) Font Paragraph
Designer c) Library
d) How to
Compone
nts
Objects: this palette consists of the following tabs -
Developm
ent e) Object
Flow Object is the most important tab where we define Type,
Caption, Appearance, Value (validations) and most
Tips & importantly Binding
Tricks
b) Layout
Adobe Layout assists in positioning the UI elements (x coordinate,
Applicatio y coordinate, height, width, margins and caption
n positioning)
Portal
c) Border
Output
4/30/17
types VACS Technology Pvt. 19
Layout Editor Right Pane
Introducti The Objects palette
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 20
Layout Editor Right Palettes
Introducti Layout: Border: Accessibility:
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 21
Layout Editor Right Palettes
Introducti Borders
on Borders help in adding borders to UI elements, editing them
individually or
LiveCycle
Designer
together and applying styles to them.
Compone Font-Paragraph
nts It is Adobes inbuilt word processing tool assisting with
various fonts, sizes,
Developm
ent and other textual features. Paragraphs tab allows us to specify
Flow indentations.
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 22
Adobe Forms: Development Flow
Introducti Developing an Adobe Form consist of the following major
on
steps:
LiveCycle
Designer 1. Creating the Driver Program
This includes the retrieval and form display logic
Compone
nts
2. Creating Dictionary Structures and Table for passing data to
Developm Form Interface
ent
Flow 3. Creating Adobe Interface
Tips &
Tricks 4. Creating Adobe Form
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 23
Driver Program
Introducti Function modules and the sequence in which they are invoked
on
are as follows:
LiveCycle
1. FP_JOB_OPEN
Designer
Compone
2. FP_FUNCTION_MODULE_NAME
nts
3. fm_name
Developm
ent 4. FP_JOB_CLOSE
Flow
Here fm_name is the SAP generated function module
Tips & for the
Tricks developed Adobe Form and is passed as an importing
parameter to
Adobe FP_FUNCTION_MODULE_NAME
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 24
Adobe Interface
Introducti Creation of Interface
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 25
Adobe Interface
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 26
Adobe Form
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 27
Quantity and Currency Fields
Introducti Quantity and Currency Fields in interface parameters need to be
on referenced in the interface under the Quantity and Currency node.
LiveCycle If this is not done then a short dump is generated as shown below:
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 28
Quantity and Currency Fields
Introducti The following steps should be performed:
on
LiveCycle
Go to Quantity and Currency Fields node
Designer Declare reference variables of all currency and quantity
fields present in any of the importing tables or structures
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 29
Quantity and Currency Fields
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 30
Tips & Tricks
Introducti Opening Layout Editor
on
It is always better to invoke the layout editor by clicking on
LiveCycle
the layout button rather than on the layout tab.
Designer
Tips & Layout tab opens the layout editor integrated with the SAP
Tricks GUI main SFP screen
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 31
Tips & Tricks
Introducti As can be seen below the layout editor can be optimally used
on in terms of:
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 32
Tips & Tricks
Introducti The palettes are capable of being un-docked form the right pane or the
on left
pane. This can be done to have more space dedicated to viewing the
LiveCycle form
Designer development workspace.
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 33
Tips & Tricks
Introducti At any point of time the palettes can be docked back by navigating to the
on below menu item:
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Tip: In case the application slows down or becomes
unresponsive,
Output resetting palette location solves the issue.
4/30/17
types VACS Technology Pvt. 34
Adobe Forms via Portal
Introducti To access SAP Adobe Forms via Portal, we take the help of Webdynpro
on Application available in SE80. The following are involved in displaying
Adobe Forms via Webdynpro Portal:
LiveCycle
Designer
Go to transaction: SE80
Create a Webdynpro Component
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
Give a name and description to the component
n
Select radio button against Webdynpro Component
Portal
Provide a Window name
Output
4/30/17
types VACS Technology Pvt. 35
Adobe Forms via Portal
Introducti Save the Webdynpro Component
on Click on the View you just created under the Views Node
LiveCycle
Right-click on ROOTUIELEMENTCONTAINER
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 36
Adobe Application - Output Types
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 37
Adobe Application - Output Types
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 38
Adobe Application - Output Types
Introducti
on Partner functions:
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 39
Adobe Application - Output Types
Introducti
on Processing routines:
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 40
Adobe Application - Output Types
Introducti Output determination procedure:
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 41
Adobe Application - Output Types
Introducti
on Attaching it to applications:
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 42
Adobe Application - Output Types
Introducti
on Attaching it to applications:
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 43
Designing Form Layout
Introducti
on The left pane has two tabs:
1. Hierarchy (Sub-form hierarchy)
LiveCycle 2. Data View (Data Structures)
Designer
Compone
nts
Developm
ent
Flow
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 45
Adobe Form Data View
Introducti The Data View tab provides at a glance the data structures
on
flowing into the Adobe Form via the Adobe Interface. This
includes:
LiveCycle
Global Data
Designer
Form Interface Parameters
Compone
nts The data structures are available in the Data View only
after context-binding with the Adobe Form as shown below:
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 46
Designing Layout: Master Pages
Introducti
on Contents of Master Pages:
Output
4/30/17
types VACS Technology Pvt. 47
Designing Layout: Master Pages
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
The hierarchy of master pages consists of:
Flow
Pages in the first level
Tips &
Tricks
Content Areas in the second level
Adobe
Applicatio
Objects like Sub-forms, Logos, Header and Footer
n Texts etc. in
Portal the third level
Output
4/30/17
types VACS Technology Pvt. 48
Designing Layout: Content Area
Introducti
on
Content areas provide anchoring and layout management for
all the objects in a form, including sub-forms
LiveCycle
Designer Content areas cannot be selected or manipulated through the
Design View tab of the Layout Editor
Compone
nts If required, you can select, cut, copy, paste, move, delete, or
resize content areas through the Master Pages tab of the
Developm Layout Editor
ent
Flow
A rectangle on the master page delimits the area bounded by
a content area
Tips &
Tricks
The standard width provided in the Master Pages is 8.5 inches
Adobe
Applicatio The standard height provided in the Master Pages is 11
n inches
Portal
Output
4/30/17
types VACS Technology Pvt. 49
Designing Layout: Content Area
Introducti In general, Business Documents contain 3 sections broadly:
on
Header
LiveCycle
Header consists of the Letter Head
Designer
(i.e. Logo, Name of Business, Document Identification
Compone
Number, Title, Date, Statutory Information etc.)
nts
Body
Developm Body may be a simple table or might have nested
ent sections. In our case we will create a simple table to
Flow display Quotation item data
Output
4/30/17
types VACS Technology Pvt. 50
Designing Layout: Content Area
Introducti Header, Item and Footer Content Areas:
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 51
Designing Layout: Logo
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 52
Logo Context Mapping
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 53
Logo Upload
Introducti
on Logos can be uploaded using t-code SE78 (Administration of
Form Graphics)
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 54
Designing Layout: Addition of fields
Introducti The most effective way of populating your Layout with fields is by
on
dragging the data structures straight out of the Data View Hierarchy
and dropping them onto the Layout Workspace as shown below.
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 55
Data Structure Binding
Introducti
Entries having a red star adjacent to them should be verified carefully.
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 56
Data Structure Binding
Introducti
on The below entries are inherited from the data structure when
they are
LiveCycle dropped onto the layout workspace from Data View tab:
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 57
Tips & Tricks
Introducti
on For faster development it is better to multi-select UI Elements /
Objects
LiveCycle and key in the layout parameters as shown below:
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 58
Design View
Introducti Tip: To display any of the data structures imported into the
on
form, click on DATA VIEW tab and simply drag-drop the field,
structure or table onto the Design View or Master Pages. You
LiveCycle
need not create an element from scratch from Library
Designer
assigning its properties manually. When drag dropped from
Compone
DATA VIEW, all properties e.g. Technical attributes, label
nts etc. from Domain and Data Element are inherited
automatically
Developm
ent
Flow
The Design View is nothing but the placeholder for sub-form
Tips & hierarchy. This
Tricks is where the sub-form hierarchy is created
Output
4/30/17
types VACS Technology Pvt. 59
Tips & Tricks
Introducti While dragging and dropping data structures onto the editor
on
ensure that they
LiveCycle have proper labels. This makes it easy to locate one column or
Designer field out of many
from the hierarchy tab. Otherwise it would be difficult to pinpoint
Compone which field to
nts edit.
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 60
Sub-forms
Introducti Sub-forms are one of the most important elements in Adobe
on
Forms just like content areas and pages
LiveCycle
On of the biggest advantages of Adobe Forms is that layout
Designer
elements can be copy-pasted from one editor to another editor
Compone
which is not possible in Smart Forms
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 61
Sub-forms
Introducti Sub-forms are used to place UI Elements in content areas
on
Sub-forms can be of two types broadly:
LiveCycle
Designer
1. Positioned
A positioned sub-form allows the developer to place
Compone
nts content anywhere
within its boundaries
Developm
ent 2. Flowed
Flow Flowed sub-forms automatically pile up content one below
another like
Tips & a stack
Tricks
)If the parent sub-form is positioned then it allows changing
Adobe the position of the child sub-forms and UI elements by simply
Applicatio dragging it. If it is flowed the system stacks sub-forms and
n
doesnt allow changing position
Portal
)Parent sub-form / Sub-form at the top of the hierarchy has its
Output
4/30/17
types Pagination properties
VACSeditable
Technology Pvt. 62
Positioned Sub-forms
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 63
Flowed Sub-forms
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 64
Sub-forms
Introducti The field named Place
on determines
where the sub-form will be
LiveCycle placed:
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 65
Sub-forms: Values for Place
Introducti Following Previous
on
Places the sub-form after the previous object in the parent sub-
form
LiveCycle
Designer
In Content Area > [name_of_content_area]
Places the sub-form in the specified content area
Compone
nts
Top of Next Content Area
Developm Places the sub-form at the top of the next content area
ent
Flow Top of Content Area > [name_of_content_area]
Places the sub-form at the top of the specified content area
Tips &
Tricks On Page > [name_of_page]
Places the sub-form on the specified page (introduces a page
Adobe break if one does not occur naturally)
Applicatio
n
Top of Next Page
Portal
Places the sub-form at the top of the next page (introduces a
page break if one does not occur naturally)
Output
4/30/17
types VACS Technology Pvt. 66
Sub-forms: Values for Place
Introducti
on Top of Page > [name_of_page]
Places the sub-form at the top of the page, whenever the
LiveCycle specified page is rendered (introduces a page break if one does
Designer not occur naturally)
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 69
Sub-form: Overflow of data
Introducti In order to enable overflowing of content from current page to
on
subsequent pages following must be done:
LiveCycle
1. As discussed earlier, the main sub-form must be flowed
Designer
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 71
Tips & Tricks
Introducti
on If you want to alter the dimensions of a sub-form or add
another sub-form after everything has been set, make sure to
LiveCycle make the main sub-form positioned
Designer
Then proceed with the dimension alterations and addition or
Compone deletion of sub-forms
nts
This prevents the layout from being disturbed. Once the
Developm alteration is done, change the main sub-form to Flowed once
ent again
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 72
Assigning Place to Sub-forms
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 73
Tips & Tricks
Introducti The Main Form is the Parent form, therefore all content will be
on in this form
Place will always have Continue Filling Parent
LiveCycle In case of Flowed Sub-forms wrapping tables the height
Designer
property of the
sub-form gets disabled. This is controlled dynamically when the
Compone
nts
data starts flowing into the sub-form and you need not worry
whether data will fit into the sub-form or not
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 74
Headers and Footers
Introducti For having footer display on all pages, simply keep footers
on
on all master pages in its respective content area
CA_Footer_Page1 and CA_Footer_Page2 in our example
LiveCycle
Designer
We have already seen how header data can be displayed
Compone
across multiple pages
nts
Page Number can be added from Library -> Custom as
Developm shown below
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 75
Dynamic Adobe Forms
Introducti
on
LiveCycle
Designer
Compone
nts
Developm
ent
Flow
Tips &
Tricks
Adobe
Applicatio
n
Portal
Output
4/30/17
types VACS Technology Pvt. 76
4/30/17 VACS Technology Pvt. 77