Canvas Layout Container in Flex4


 

Canvas Layout Container in Flex4

The Canvas layout Container is used for define a rectangular region in which the user can place child component or controls.

The Canvas layout Container is used for define a rectangular region in which the user can place child component or controls.

Canvas Layout Container in Flex4:

The Canvas layout Container is used for define a rectangular region in which the user can place child component or controls. The Canvas layout Container is a MX component. There is no spark component. You can use absolute layout of position of child components. The tag of Canvas Layout Container is <mx:Canvas>.

In this example the colored area shows the Canvas container.

Example:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx"

minWidth="955" minHeight="600">

<s:Panel title="Canvas Layout Container Example" width="253" height="301">

<mx:Canvas backgroundColor="#DBAAAA"

width="223"

height="245"

x="14" y="12">

<mx:LinkButton label="JAVA"

x="39" y="23"

click="navigateToURL(new URLRequest('http://www.roseindia.net/java'))"/>

<mx:Image

height="50" width="50"

x="100" y="10"

source="@Embed('C:/work/bikrant/flex4component/horizontallist/java.jpg')"

click="navigateToURL(new URLRequest('http://www.roseindia.net/java'))"/>

<mx:LinkButton label="iPHONE"

x="34" y="91&"

click="navigateToURL(new URLRequest('http://www.roseindia.net/iphone'))"/>

<mx:Image

height="/font>50" width="50"

x="100" y="75"

source="@Embed('/C:/work/bikrant/flex4component/horizontallist/iphone.gif')"

click="navigateToURL(new URLRequest('http://www.roseindia.net/iphone'))"/>

<mx:LinkButton label="FLEX"

x="46" y="153"

0

click="navigateToURL(

new URLRequest('http://www.roseindia.net/flex'))"/>

<mx:Image

1

height="50" width="50"

x="100" y="140"

source="@Embed('/C:/work/bikrant/flex4component/horizontallist/flex.jpg')"

2

click="navigateToURL(

new URLRequest('http://www.roseindia.net/flex'))"/>

</mx:Canvas>

3

</s:Panel>

&</s:Application>

Output:/h3>

4

Running Application:

To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.

Download this code

5

Ads