En Sencha Touch, un Decorator es un Componente que se encapsula alrededor de otro componente. El típico ejemplo de un Decorator es un Field. Un campo de captura (field) no es otra cosa que una capsula de otro componentes, dándole al campo una etiqueta con estilo extra y el campo haciendo que el componente se vea bien en pantalla.
Un Decorator puede verse como un Contenedor ligero, que únicamente tiene un solo hijo y no utiliza un layout. El look & feel de los decorators se establecen únicamente con estilos de CSS.
Otra cosa poderosa de un Decorator es que proporciona preconfiguraciones. Por ejemplo, todas las configuraciones de un Slider también existen en el Slider Field. El Slider Field únicamente preconfigura los correspondientes getters y setters a la actual instancia Slider . Reescribir todos estos setters y getters es una tarea tediosa y quizas perdida de tiempo.
Cuando creas una subclase de Ext.Decorator, todo lo necesario es especificar estas configuraciones que se quieren establecer en los componentes utilizando la propiedad especial 'proxyConfig'. Aquí un ejemplo de cómo se vería en tu propio Slider :
<pre name="code" class="javascript">
Ext.define('Mio.field.Slider', {
extend: 'Ext.Decorator',
config: {
component: {
xtype: 'slider'
}
},
proxyConfig: {
minValue: 0,
maxValue: 100,
increment: 1
}
// ...
});
</pre>
Una vez que se crea la clase Mio.field.Slider, tendrá todos los métodos setters y getters automáticamente generados de todas las propiedades listadas en proxyConfig
Opciones de configuración
• component : Object
Ext.field.Field
Field es la clase base para la mayoría de los campos de captura en Sencha Touch. Proporciona un conjunto de funcionalidades compartidas a las subclases, por ejemplo, etiquetas, validaciones simples, limpiar el campo, etc. Es raramente usado directamente, en lugar de ellos es preferible utilizar el conjunto de subclases comunes existentes en el framework:
xtype Clase
textfield Ext.field.Text
numberfield Ext.field.Number
textareafield Ext.field.TextArea
hiddenfield Ext.field.Hidden
radiofield Ext.field.Radio
checkboxfield Ext.field.Checkbox
selectfield Ext.field.Select
togglefield Ext.field.Toggle
fieldset Ext.form.FieldSet
Los Fields normalmente son usados dentro del contexto de un contenedor ya sea un form o fieldset.
Por favor revise la documentación de FormPanel y FieldSet para ejemplos de cómo acoplarlos juntos.
Si deseas extender esta clase, la mayoría de las veces es preferible extender de otras clases más abajo en la jerarquía, por ejemplo Ext.field.Text , proporcionando funcionalidad extra para manipulación de texto.
Opciones de configuración
• clearIcon : Boolean
• component : Object
• label : String
• labelAlign : String
• labelCls : String
• labelWidth : Number
• name : String
• required : Boolean
• requiredCls : String
• tabIndex : Number
• value : Mixed
Métodos
• getClearIcon( ) : Boolean
• getInputType( ) : String
• getLabel( ) : String
• getLabelAlign( ) : String
• getLabelCls( ) : String
• getLabelWidth( ) : Number
• getName( ) : String
• getRequired( ) : Boolean
• getRequiredCls( ) : String
• getTabIndex( ) : Number
• getValue( ) : Mixed
• isDirty( ) : Boolean
• reset( ) : Ext.field.Field
• setClearIcon( Boolean clearIcon )
• setInputType( String inputType )
• setLabel( String label )
• setLabelAlign( String labelAlign )
• setLabelCls( String labelCls )
• setLabelWidth( Number labelWidth )
• setName( String name )
• setRequired( Boolean required )
• setRequiredCls( String requiredCls )
• setTabIndex( Number tabIndex )
• setValue( Mixed value )
24
Ene 12
Twittear
Porqué es importante aprender a programar? ...
El éxito de las estimaciones de recursos en el Software ...
La programación dirigida por eventos también es un paradigma de programación
Consideraciones a tomar para llamarlo el mejor
Danos tus comentarios