If we use the FlowLayout layout, all the UI elements are displayed in a line. Byusing the property WRAPPING of the container into which the UI elements are going to be integrated, we can manipulate the modality of putting these UI elements on screen. In case this property is ABAP_TRUE, the UI elements that don’t enter in the first line are arranged bellow, in another line, to automatically adapt to the client window. In case of ABAP_FALSE, the UI elements are not automatically adapted to the client window.
For a better understanding, we create a Registration Form with three fields: first name, last name and date of birth. The WD component structure and the view layout are presented.
WD component structure and view layout
In View context, we create the same well-known STUDENT contextnode with the dictionary structure YSTR_PERSON.
ROOTUIELEMENTCONTAINER and Group UI element are both UI elements of container type, which have the FlowLayout layout in the default mode.Each UI element reference to a LayoutData object and every UI element inserted within a container must have the data layout that matches the respective container.
Layout and layout data
Runtime: wrapping ABAP_TRUE
As we can see, the UI elements are arranged in a line. Because the attributes of STUDENT context node are empty, the InputField’s UI elements bound to these attributes are not shown. After the user presses the Save Button, we show all the data that the user has entered in the InputField UI elements.In this case, all the UI elements don’t enter in a line anymore, because the client window is too small for that. The elements that don’t enter in the first line are arranged below in another line, to automatically adapt to the client window.
We can see that, for the layout data, we can set two properties: cellDesign that specifies the distance between rows and vGutter that specifies the additional distance to the left edge. The default of these values is cellDesign – padless (there is no distance between the row and the edges) and vGutter – none (no additional distance).In case the wrapping property is ABAP_FALSE, the UI elements that don’t enter in the first line are not arranged below in another line, they are not visible anymore.
Runtime: wrapping ABAP_FALSE
For a dynamic manipulation, we can use the runtime class CL_WD_FLOW_DATA to embedding the UI elements into the container that has a FlowLayout layout.An example of using this class we have seen in the wdDoModifyView example.
SAP ABAP Web Dynpro Related Tutorials
|SAP ABAP Tutorial|
SAP ABAP Web Dynpro Related Interview Questions
|SAP ABAP Interview Questions||SAP ABAP Web Dynpro Interview Questions|
|Sap Abap Hr Interview Questions||SAP ABAP Dictionary Interview Questions|
|SAP ABAP Enhancement Interview Questions||SAP ABAP Module Pool Interview Questions|
|SAP ABAP Report Developer Interview Questions||SAP ABAP Data Dictionary Interview Questions|
|SAP ABAP ALV Reports Interview Questions|
Sap Abap Web Dynpro Tutorial
Sap Easy Access
Designing A Web Dynpro Component
Context Nodes And Attributes At Design Time
Data Binding, Context Mapping And Interface Methods
View Controller Methods
Layout Ui Elements
User Interface Elements (ui Elements) Static And Dynamic Programming
Messages, Exceptions And Web Dynpro Abap
Writing Multilanguage Applications
Alv And Select Options
Integrating A Web Dynpro Application Into The Sap Netweaver Portal
Web Dynpro And Authorization
Web Dynpro Mind Map
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.