Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / examples / draw / RotateText.js
diff --git a/examples/draw/RotateText.js b/examples/draw/RotateText.js
new file mode 100644 (file)
index 0000000..d1fc1b0
--- /dev/null
@@ -0,0 +1,73 @@
+Ext.onReady(function() {
+    Ext.create('Ext.draw.Component', {
+        renderTo: Ext.get('text-ph'),
+        viewBox: false,
+        autoSize: true,
+        height: 350,
+        padding: 20,
+        items: [{
+            type: 'text',
+            text: 'With Ext JS 4.0 Drawing',
+            fill: '#000',
+            font: '18px Arial',
+            rotate: {
+                degrees: 45
+            }
+        }]
+    });
+    
+    Ext.create('Ext.draw.Component', {
+        renderTo: Ext.get('text-ph'),
+        viewBox: false,
+        autoSize: true,
+        height: 350,
+        padding: 20,
+        items: [{
+            type: 'text',
+            text: 'Creating a rotated Text component',
+            fill: '#000',
+            font: '18px Arial',
+            rotate: {
+                degrees: 90
+            }
+        }]
+    });
+    
+    Ext.create('Ext.draw.Component', {
+        renderTo: Ext.get('text-ph'),
+        id: 'snappy',
+        viewBox: false,
+        height: 350,
+        width: 200,
+        padding: 20,
+        items: [{
+            type: 'text',
+            text: 'Is a snap!',
+            fill: '#000',
+            font: '18px Arial',
+            y: 50,
+            rotate: {
+                degrees: 315
+            }
+        }]
+    });
+    
+    Ext.create('Ext.slider.Single', {
+        renderTo: Ext.get('slider-ph'),
+        hideLabel: true,
+        width: 400,
+        minValue: 0,
+        maxValue: 360,
+        value: 315,
+        listeners: {
+            change: function(slider, value) {
+                var sprite = Ext.getCmp('snappy').surface.items.first();
+                sprite.setAttributes({
+                    rotation: {
+                        degrees: value
+                    }
+                }, true);
+            }
+        }
+    });
+});
\ No newline at end of file