- Sencha Touch - Home
- Sencha Touch - Overview
- Sencha Touch - Environment
- Sencha Touch - Naming Convention
- Sencha Touch - Architecture
- Sencha Touch - MVC Explanation
- Sencha Touch - First App
- Sencha Touch - Build Application
- Sencha Touch - Migration Steps
- Sencha Touch - Core Concepts
- Sencha Touch - Data
- Sencha Touch - Theme
- Sencha Touch - Device Profile
- Sencha Touch - Dependencies
- Environment Detection
- Sencha Touch - Events
- Sencha Touch - Layout
- Sencha Touch - History & Support
- Sencha Touch - Upload & Download
- Sencha Touch - View Components
- Sencha Touch - Packaging
- Sencha Touch - Best Practice
Sencha Touch - Draw
Description
This is used to create different types of simple charts such as circular and/or rectangular.
Syntax
Following is the simple syntax to add form.
Ext.create("Ext.draw.Component", {})
Example
Following is a simple example showing the usage.
<!DOCTYPE html>
<html>
<head>
<link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
<script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all.js">
</script>
<script type = "text/javascript">
Ext.application({
name: 'Sencha',
launch: function() {
Ext.create("Ext.draw.Component", {
fullscreen: true,
sprites: [
{
type: 'circle',
fillStyle: '#ff8',
strokeStyle: 'black',
lineWidth: 3,
radius: 100,
x: 100,
y: 100
}
]
});
}
});
</script>
</head>
<body>
</body>
</html>
This will produce following result −
sencha_touch_view_components.htm
Advertisements