NativeContainer Widget

The NativeContainer Widget helps you develop, use, and add native UI widgets using the NativeFunction API. The widgets that are defined by the Android and iOS platforms are known as native UI widgets. Using the NativeFunction APIs, you can make use of the native widgets directly in your applications.

For example, you can add the Button Widget defined by the Android platform into your application. The NativeContainer widget allows you to add only native controls and widgets to it.

Adding Native widgets: You can add cross platform widgets and platform specific widgets that are specific to iOS or Android, into the NativeContainer and customize it. FlexContainer widget does not support native widgets. To learn more about adding the widget to a form, refer NativeContainer widget Basics.

The NativeContainer widget capabilities can be broadly categorized into the following:

• Layout
• UI Appearance
• Data Management
• 3D Touch
• User Input Handling
• Enabling RTL
• Miscellaneous
• Configurations Common To All Widgets

Layout

Properties	Description
anchorpoint	Specifies the anchor point of the widget bounds rectangle using the widget's coordinate space.

 

UI Appearance

Events	Description
onDidMoveToParentViewController	Invoked after the view controller is added or removed from the view controller container.
onLayoutSubviews	Using the callback, you can lay out all subviews.
onOrientationChange	Allows you to change the orientation of the form from portrait to landscape and vice versa.
onViewDidAppear	Invoked when the native layout view appears.
onViewDidDisappear	Invoked when the native layout view disappears.
onViewDidLoad	Invoked after the view is loaded.
onViewWillAppear	Invoked when the native layout view is about to appear on the screen.
onViewWillDisppear	Invoked when the native layout view is about to appear on the screen.
onWillMoveToParentViewController	Invoked just before the view controller is added or removed from the view controller container.

  

Data Management

Events	Description
onCreated	Helps you create and add native widgets/views to the NativeContainer Widget, which is passed as a parameter to the callback.
onCleanup	Using the onCleanup event, you can clear the views/widgets created using the onCreated event, when the form is being hidden.

 

3D Touch

Methods	Description
registerForPeekandPop	Registers a widget to enable 3D Touch peek and pop gestures.
setOnPeek	Sets and overrides the existing onPeekCallback for the widget.
setOnPop	Overrides the existing onPopCallback for the widget.
unregisterForPeekandPop	Unregisters a widget from 3D Touch peek and pop gestures.

 

User Input Handling

Methods	Description
addGestureRecognizer	Allows you to set a gesture recognizer for a specified gesture for a specified widget.
removeGestureRecognizer	Allows you to remove the specified gesture recognizer for the specified widget.
setGestureRecognizer	Allows you to set a gesture recognizer for a specified gesture for a specified widget.

 

Enabling RTL

Properties	Description
retainContentAlignment	Helps to retain the content alignment of the widget while applying RTL.
retainFlexPositionProperties	Helps to retain the left, right and padding properties while applying RTL.
retainFlowHorizontalAlignment	Enables you to change the horizontal flow of the widget from left to right.

Miscellaneous

Methods	Description
getBadge	Enables you to read the badge value (if any) attached to the specified widget.
setBadge	Enables you to set the badge value to the given widget at the upper, right corner of the widget.

 

Properties	Description
transform	Contains an animation transformation that can be used to animate the widget.
type	Denotes the type of the NativeContainer Widget in the JS layer.

Configurations Common To All Widgets

Properties	Description
isVisible	Controls the visibility of the NativeContainer Widget on the form.
id	id is a unique identifier of the NativeContainer Widget consisting of alphanumeric characters.

 

Methods	Description
convertPointFromWidget	Allows you to convert the coordinate system from a widget to a point (receiver's coordinate system).
convertPointToWidget	Allows you to convert the coordinate system from a point (receiver's coordinate system) to a widget.
getContainerView	Returns the NativeContainer layout view.
removeFromParent	Allows you to remove a child widget from a parent widget.
setEnabled	Specifies the widget that must be enabled or disabled.
setFocus	Specifies the widget on which there must be focus.
setVisibility	Use this method to set the visibility of the widget.

NativeContainer Widget Basics

Note: You cannot add any of the Kony widgets to the NativeContainer Widget.

In the Widgets palette, the NativeContainer Widget appears only after a NativeFunction is imported to the Kony Visualizer and when the respective native canvas is selected. For example, if you have imported the NativeFunction corresponding to the Android native, the NativeContainer Widget appears only when Android canvas is selected. For more information on importing the NativeFunction, see Importing NativeFunction.

You can place the NativeContainer Widget in the FlexForm, FlexContainer, FlexScrollContainer, and Master Flex/FlexScroll containers. You cannot add the NativeContainer widget to other container widgets like Tab and TabPane, and also in a template. Even a Master Widget containing a NativeContainer Widget cannot be placed in a template.

The NativeContainer Widget adheres to the flex container semantics as the NativeContainer can be placed in all the flex container widgets. The NativeContainer Widget supports all positional and dimensional properties. For more information on flex container semantics, see Flex Container Rules.

The actual layout view displayed on the screen is platform-specific. The platform-specific layouts differ from platform to platform and are displayed only for the respective platforms. For Android, RelativeLayout is used whereas for iOS, Auto Layout is used. The following links provide more information on the platform-specific layouts.

• RelativeLayout: http://developer.Android.com/reference/Android/widget/RelativeLayout.html
• Auto Layout: https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/AutolayoutPG/index.html#//apple_ref/doc/uid/TP40010853-CH7-SW1

All the APIs, constants, and properties of these layouts can be used on the Layout returned using the NativeContainer’s Events and Methods.

prem	Copyright © 2012 Kony, Inc. All rights reserved.

prem	Copyright © 2012 Kony, Inc. All rights reserved.