Curso [2-4-2-1] Ext JS - Cross-Browser Rich Internet Application Framework
Contenido Capítulo 1 : Temas Varios
1.1. (1) Visor de feeds : Lector de feeds RSS ejemplo de aplicación que cuenta con un diseño de panel lector intercambiables.
1.2. (2) Escritorio web : Muestra cómo se puede construir una computadora de escritorio en el navegador utilizando componentes de Ext incluyendo un sistema de plugins módulo.
1.3. (3) Portal demo : Un diseño de página con varias extensiones personalizadas para proporcionar una interfaz de portal web.
1.4. (4) Ext JS 3 y 4 en una sola pagina : Este ejemplo demuestra Ext JS 4 el comportamiento de caja de arena que le permite ejecutar Ext JS 3 y 4 en la misma página.
1.5. (5) Forum Browser : Foro aplicación de navegación para los foros Sencha.
1.6. (6) Visor de Imágenes : DataView y el ejemplo que demuestra TreePanel arrastrar elementos de datos de un DataView en una TreePanel.
1.7. (7) Visor de Temas : Ver y probar todos los componentes Ext. contra el paquete de temas ext.
Capítulo 2 : Accesibilidad
2.1. (8) Vista de alimentador desde el teclado : Muestra Ext JS 4 de soporte de teclado completo para usuarios que tienen dificultades para utilizar un dispositivo señalador
2.2. (9) Enlazando una grilla con un formulario : Una red incrustado dentro de un FormPanel que utiliza el tema de accesibilidad.
Capítulo 3 : Grillas
3.1. (10) Grilla Básica basada en arreglos : Una base de sólo lectura cuadrícula repleta de datos de la matriz local que demuestra el uso de la costumbre columna funciones de render.
3.2. (11) Grilla XML : Una simple lectura única red de carga de datos XML.
3.3. (12) Paginamiento : Una grillacon la paginación, entre dominios de carga de datos y la costumbre-hizo fila cuerpos ampliable.
3.4. (13) Paginador deslizante : Una demostración de la integración de los Slider con la barra de herramientas de paginación con un complemento personalizado.
3.5. (14) Agrupador : Una grilla de agrupación básica que muestre grupos de datos plegables que se pueden personalizar a través del "Grupo A" del menú de cabecera.
3.6. (15) Conectores para grilla : Las grillas de múltiples personalizado a través de plugins: filas de expansión, la selección de casilla y numeración de las filas.
3.7. (16) Filtramiento de Grilla : Característica de la red proporcionando los datos de filtrado personalizado menús que soportan varios tipos de datos.
3.8. (17) Enlace de datos en grillas : El enlace de datos una cuadrícula a un panel de vista previa de los detalles a través de RowSelectionModel de la cuadrícula.
3.9. (18) Enlace de datos en grillas ( avanzando ) : Refactorización de los datos básicos ejemplo obligatorio utilizar un modelo de aplicación basado en la clase de diseño.
3.10. (19) Ordenamiento múltiple : Un ejemplo que muestra a varios niveles de clasificación en un panel de cuadrícula.
3.11. (20) Edición de una celda : Un ejemplo que muestra la edición de células en un panel de cuadrícula.
3.12. (21) Encabezados de grillas agrupadas : Una grillade agrupación básica que muestre grupos de datos plegables que se pueden personalizar a través del "Grupo A" del menú de cabecera.
3.13. (22) Agrupamiento de grillas con resumen : La grilla de agrupación avanzada que permite edición de la celda e incluye cálculos de resumen personalizado dinámico.
3.14. (23) Grillas con 50,000 filas : Muestra que la grilla de forma dinámica las cargas de 50.000 filas.
3.15. (24) Grillas con capacidad de búsqueda : La grillacon capacidad de búsqueda en vivo.
3.16. (25) Grillas con capacidad de bloqueo : Una extensión de ejemplo, que introduce la posibilidad de añadir columnas de bloqueo en la GridPanel.
3.17. (26) Agrupamiento con resumen remoto : Red de agrupación avanzada que permite edición de la celda e incluye de forma remota cargada cálculos resumen dinámico.
3.18. (27) Edición de una fila en una grilla : Una rejilla editable que permite al usuario realizar modificaciones a un registro completo de una vez.
3.19. (28) RESTful almacen con panel de grilla y editor de fila : Una tienda REST con JsonWriter que genera automáticamente CRUD peticiones al servidor.
3.20. (29) Grilla editable con almacenamiento escribible : Esta tienda utiliza escritor datos para generar automáticamente CRUD peticiones al servidor a través de un HttpProxy estándar.
3.21. (30) Buffered Scrolling : La nueva grilla utiliza un sistema de desplazamiento virtuales para gestionar conjuntos de datos potencialmente infinito sin ningún tipo de impacto en el rendimiento del lado del cliente.
3.22. (31) Vista de Lista : Ext. 4 sustituye Ext.ListView con la Ext.grid.Panel por defecto.
3.23. (32) Paginador de barra de progreso : Barra de progreso Pager extensión.
3.24. (33) Propiedades de grilla : Crear una cuadrícula de propiedades de un objeto.
3.25. (34) Marca desde grilla : Crear una red con de una tabla existente, HTML sin formato.
Capítulo 4 : Gráficas estadísticas
4.1. (35) Gráficos de áreas :
Pantalla de 7 conjuntos de datos aleatorios en una serie de la zona. Actualizar los datos al azar a generar un nuevo conjunto de datos en la tienda.
4.2. (36) Cartas personalizadas Area :
Mostrar las tendencias de uso del navegador en una serie de la zona. Este gráfico utiliza degradados personalizados para los colores y la leyenda es interactivo.
4.3. (37) Gráficos de barras :
Mostrar un conjunto de datos al azar de una serie de barras. Actualizar los datos al azar a generar un nuevo conjunto de datos en la tienda.
4.4. (38) Cartas personalizadas Bar :
Mostrando una serie de barras horizontales con un procesador de barras que modifica el color de cada barra.
4.5. (39) Panel de complejos :
Se muestra información las empresas en un tablero de instrumentos complejos. Editar la información de cada registro en el formulario para ver actualizaciones en vivo en los gráficos y la red.
4.6. (40) Consejos ricos :
Que muestra una serie de líneas con puntas de ricos. Consejos para mostrar información dinámica en la tabla de componentes Grid y Pie.
4.7. (41) Cartas temáticas de línea :
Con el tema de 3.x. La visualización de gráficos múltiples y gráficos mezclados con el ratón sobre y haga clic en la interacción.
4.8. (42) Gráficos de columnas :
Mostrar un conjunto de datos al azar de una serie de columnas. Actualizar los datos al azar a generar un nuevo conjunto de datos en la tienda.
4.9. (43) Gráficos de líneas :
Pantalla de 2 conjuntos de datos aleatorios en una serie de líneas. Actualizar los datos al azar a generar un nuevo conjunto de datos en la tienda.
4.10. (44) Columna de fondo personalizadas :
Un gráfico de columnas con el tema personalizado y transiciones de animación
4.11. (45) Gráfico de la serie mixta :
Pantalla de 3 conjuntos de datos aleatorios usando una línea, un bar, y una serie de dispersión. Actualizar los datos al azar a generar un nuevo conjunto de datos en la tienda.
4.12. (46) Gráficos circulares :
Mostrar 5 conjuntos de datos aleatorios con un gráfico circular. Actualizar los datos al azar a generar un nuevo conjunto de datos en la tienda.
4.13. (47) Cartas personalizadas Pie :
Mostrar 5 conjuntos de datos aleatorios con un gráfico circular. Un procesador se ha creado a cambiar de forma dinámica la longitud y el color de cada sector sobre la base de los datos.
4.14. (48) Los gráficos radiales :
Pantalla de 3 conjuntos de datos aleatorios en una serie de radar. Tenga en cuenta este ejemplo se utiliza un eje radial.
4.15. (49) Lleno de gráficos de radar :
Pantalla de 3 conjuntos de datos aleatorios de una serie radial relleno. Haga clic o flotar sobre los elementos de leyenda para poner de relieve y eliminarlos de la tabla.
4.16. (50) Gráficos de dispersión :
Pantalla de 2 conjuntos de datos aleatorios en una serie de dispersión. Un procesador se ha creado a cambiar dinámicamente el tamaño y el color de los elementos de base de datos sobre ella.
4.17. (51) Gráficos de barras apiladas :
Mostrando películas por género tomando como muestra un gráfico de barras apiladas. Filtro de las pilas, haga clic en los elementos de leyenda.
4.18. (52) Vivir gráfico actualizado :
Mostrando una serie de acuerdo con los datos de actualización a intervalos regulares.
4.19. (53) Vivir Gráfico animado :
Que muestra una serie de líneas con transiciones suaves en los datos de actualización a intervalos regulares.
4.20. (54) Medidor Gráfico :
Mostrar tres cartas de calibre personalizado obligado a diferentes almacenes de datos con diferentes opciones de configuración y easings.
4.21. (55) Bar agrupados :
Pantalla de 3 conjuntos de datos aleatorios en una serie de columnas agrupadas.
4.22. (56) Actualizar Gráfico :
Visualizar un ejemplo gráfico de columnas que anima al actualizar el conjunto de datos
Capítulo 5 : Tabuladores
5.1. (57) Tabuladores básicos :
La funcionalidad de la ficha Básico incluyendo autoHeight, las fichas de marcado, la carga de Ajax y eventos ficha.
5.2. (58) Tabuladores avanzados :
Las características avanzadas incluyendo la ficha desplazamiento de las etiquetas, fichas de programación y la adición de un plug-in del menú contextual.
5.3. (59) Pestaña del menú de desbordamiento :
Demuestra el desbordamiento TabPanel extensión del menú, lo que hace que la gestión de un gran número de pestañas más fácil
Capítulo 6 : Ventanas
6.1. (60) Variaciones ventana :
Una colección de Windows en configuraciones diferentes, que muestran los encabezados de adjuntar a cualquier lado de la ventana.
6.2. (61) Diseño de la ventana :
Una ventana que contiene un BorderLayout básicas con anidadas TabPanel.
6.3. (62) De mensaje :
Diferentes estilos incluyen confirmar, el progreso de alerta, del sistema, y esperar y también apoyar los iconos personalizados.
Capítulo 7 : Arboles :
7.1. (63) Arrastrar y soltar Reordenamiento :
A TreePanel carga de forma asíncrona a través de un TreeLoader JSON que muestra arrastrar y soltar con el desplazamiento de contenedores.
7.2. (64) Varios árboles :
Arrastrar y soltar entre dos diferentes TreePanels ordenados.
7.3. (65) TreeGrid :
El componente TreeGrid
7.4. (66) Compruebe árbol :
Un ejemplo que muestra la selección simple casilla en un árbol.
7.5. (67) Árbol XML :
Una implementación TreeLoader personalizado que muestra la carga de un árbol de un documento XML.
Capítulo 8 : Gestores de Esquemas
8.1. (68) Diseño Browser :
Completo escaparate de los administradores de diseño estándar, así como la costumbre de varios diseños y combinación y ejemplos de combinación.
8.2. (69) Diseño de la frontera :
Una implementación BorderLayout complejo que muestra anidación de múltiples componentes y sub-diseños.
8.3. (70) Diseño de acordeón :
Un diseño de acordeón básicos dentro de un BorderLayout.
8.4. (71) Diseño de anclaje (formulario)
Un simple ejemplo de campos de formulario que utiliza un diseño de anclaje en una ventana para cambiar el tamaño de forma flexible.
8.5. (72) Diseño de anclaje (Panel) :
Un ejemplo de los paneles anclados en la ventana del navegador.
8.6. (73) Columna Diseño :
Un ejemplo de los paneles administrados por un diseño de columna.
8.7. (74) Tabla de diseño :
Un ejemplo de los paneles administrados por un diseño de tabla.
8.8. (75) HBox Diseño :
Diseño interactivo que ilustra la capacidad del diseño de caja horizontal.
8.9. (76) VBox Diseño :
Diseño interactivo que ilustra la capacidad del diseño VBox.
8.10. (77) Diseño complejo :
Un ejemplo de diseño complejo.
Capítulo 9 : Dibujo
9.1. (78) Puede cambiar el tamaño del logotipo Sencha :
Independiente de la resolución Sencha logo en un componente de tamaño variable.
9.2. (79) Logos navegador :
Independiente de resolución de los logotipos de todos los navegadores populares.
9.3. (80) Tigre :
El clásico de SVG Tiger en un componente flotante, que pueden arrastrarse. Escalable a cualquier tamaño, totalmente independiente de la resolución.
9.4. (81) Girar el texto :
Crear un texto en un componente de dibujar que se puede girar fácilmente en cualquier navegador.
Capítulo 10 : Arrastrar y soltar
10.1. (82) La red de Grid DnD :
Muestra el número de filas puede ser fácilmente arrastrar y soltar entre dos o más redes
10.2. (83) La red de forma DnD :
Permite al usuario arrastrar un registro de la red y colocarlo en un formulario, donde se pueden editar
10.3. (84) Campo a la cuadrícula DnD :
Demuestra arrastrando un valor de un campo a una celda de la cuadrícula
10.4. (85) Arrastrar y soltar personalizado :
Un ejemplo de arrastrar y soltar completamente personalizado que muestra DnD entre un DataView y una cuadrícula
Capítulo 11 : Barras de herramientas y menús
11.1. (86) Barra de herramientas básicas :
Barra de herramientas y menús que contienen varios componentes como selectores de fecha, selectores de color, sub-menús y mucho más.
11.2. (87) Grupos Botón de la barra :
Botones se agrupan en la barra de herramientas.
11.3. (88) Barras de herramientas verticales :
Barras de herramientas vertical a la izquierda y la derecha. Combinado vertical y horizontal barras de herramientas.
11.4. (89) Ext Grid Acciones :
Obligar a la misma conducta de varios botones, barra de herramientas y elementos de menú utilizando la clase Ext.Action.
11.5. (90) Barra de herramientas reorderable :
Elementos dentro de una barra de herramientas se pueden reordenar uso de este plugin.
11.6. (91) Desbordamiento de la barra de herramientas :
Elementos dentro de una barra de herramientas se colocará en un menú de desbordamiento si la barra de herramientas es demasiado estrecha.
11.7. (92) La barra de estado :
A StatusBar simple que se puede caer en la parte inferior de un panel para mostrar el texto de estado e iconos.
11.8. (93) La barra de estado (Avanzado)
Personalización de la StatusBar a través de un plugin para proporcionar control automático de validación de formularios y el error de enlace.
11.9. (94) Ext Acciones barra de herramientas :
Obligar a la misma conducta de varios botones, barra de herramientas y elementos de menú utilizando la clase Ext.Action.
Capítulo 12 : Cuadros combinados
12.1. (95) ComboBox básicas :
Combos básicos, combos prestados a partir de marcado y trazado lista personalizada para proporcionar información sobre herramientas elemento.
12.2. (96) Plantillas ComboBox :
Combo personalizado con la representación de la lista basada en plantillas, carga remota y la paginación.
Capítulo 13 : Vista de datos
13.1. (97) DataView :
Este ejemplo muestra cómo utilizar un Ext.view.View
13.2. (98) Animados DataView :
Plugin transición de la animación aplicada a un objeto DataView estándar
13.3. (99) Multi-clase DataView :
Ejemplo que demuestra la capacidad de ordenar un DataView por clasificadores múltiples.
13.4. (100) Avanzada DataView :
DataView que permite filtrar y ordenar las imágenes.
Capítulo 14 : Formas
14.1. (101) Formularios dinámicos :
Diversas formas ejemplo que muestra fieldsets plegables, diseño de la columna, tabpanels anidados y mucho más.
14.2. (102) Ajax con formularios XML :
Ajax-cargados los campos del formulario de forma remota los datos XML y la validación de campos remotos en enviar.
14.3. (103) Formulario de Contacto :
Un ejemplo de un contacto común con nosotros la forma emergente.
14.4. (104) Buscar campos personalizados :
Una extensión de la búsqueda TriggerField combinado con un XTemplate para la representación de resultados personalizados.
14.5. (105) La vinculación de un Grid en un formulario :
Una red incrustado dentro de un FormPanel que se carga automáticamente los registros en la forma de selección de filas.
14.6. (106) Tipos de campo :
Este ejemplo muestra todos los tipos de campo disponibles en Ext JS en un montón de configuraciones diferentes.
14.7. (107) Casilla de verificación / Radio Grupos :
Ejemplos que muestran la casilla de verificación y diferentes configuraciones de grupo de radio.
14.8. (108) Carga de archivos de campo :
Una demostración de cómo dar de archivos subidos por el usuario estándar de un poco de estilo Ext. utilizar una clase personalizada.
14.9. (109) Número de campo :
Un ejemplo del campo de número, con y sin una ruleta.
14.10. (110) MultiSelect y ItemSelector :
Ejemplo de controles para seleccionar una lista de elementos en las formas.
14.11. (111) Formulario de inscripción :
Un formulario de registro de la cuenta, con la costumbre de mostrar un mensaje de error global.
14.12. (112) Compras Realizar Pedido :
Un ejemplo de un carrito de la compra común forma de pago.
14.13. (113) Slider de campo :
Ejemplo del uso de un Ext.Slider para seleccionar un valor numérico en un formulario.
14.14. (114) Formas con el diseño vBox :
Ejemplo del uso de la disposición vBox con las formas. Una ventaja añadida es que el plugin FieldReplicator.
14.15. (115) Formas con el diseño hbox :
Ejemplo del uso de la disposición hbox con un formulario. Incluye el ajuste automático de mensajes de validación.
14.16. (116) Los contenedores de campo :
Ejemplo de uso de la FieldContainer colocar varios campos en una fila única forma.
14.17. (117) Forma con la disposición absoluta :
Un simple ejemplo de campos de formulario que utiliza un diseño absoluto en una ventana para cambiar el tamaño de forma flexible.
14.18. (118) Campo de formulario personalizado :
Un ejemplo sencillo que muestra cómo crear un campo de formulario personalizado.
Capítulo 15 : Direct
15.1. (119) Directo :
Un ejemplo que demuestra Remoting y sondeo del servidor
15.2. (120) Forma directa :
Ext.Direct Remoting con un formulario
15.3. (121) Directa a red :
Ext.Direct Remoting con un Grid
15.4. (122) TreeLoader directa :
Ext.Direct Remoting con un árbol
15.5. (123) Directa los argumentos con nombre :
Ext.Direct argumentos con nombre
Capítulo 16 : MVC
16.1. (124) Feed Visor :
Una versión de la aplicación de la MVC ejemplo Visor de alimentación. Esta práctica mejor muestra de una pequeña aplicación
16.2. (125) Cargando anidadas :
Un ejemplo MVC que muestra una navegación sencilla y la carga anidadas con el paquete de datos
Capítulo 17 : Miscelanea
17.1. (126) Historia :
Un gerente de la Historia que permite al usuario navegar una interfaz de usuario a través del navegador Ext. atrás / adelante.
17.2. (127) Google Maps :
Una clase de Google Maps que permite visualizar envoltorio fácil de mapas dinámicos en los paneles y ventanas ext.
17.3. (128) Editor :
Un ejemplo que demuestra la facilidad de uso de la clase Ext.editor para modificar los elementos DOM
17.4. (129) Slider :
Un componente deslizante que soporta el modo vertical, ajuste, información sobre herramientas, estilos personalizados y los pulgares múltiples.
17.5. (130) QuickTips :
Información sobre herramientas diversas y rápidas opciones de configuración de punta, incluida la carga Ajax y el seguimiento del ratón.
17.6. (131) Barra de progreso :
Uno de los componentes básicos de la barra de progreso se muestra en varias configuraciones y estilos personalizados.
17.7. (132) Paneles :
Un ejemplo básico panel plegable.
17.8. (133) De tamaño variable :
Ejemplos de lo que cualquier elemento puede cambiar de tamaño, con diferentes opciones de configuración.
17.9. (134) Botones :
Muestra los botones en muchas de sus configuraciones posibles
17.10. (135) Foco :
Una utilidad para enmascarar todo excepto un solo elemento de la página para resaltar visualmente.
17.11. (136) Exploración con el teclado :
Muestra una navegación con el teclado personalizado mediante la clase KeyNav
17.12. (137) Localización (estática) :
Demuestra plenamente la localización de una forma mediante la inclusión de un script de configuración regional personalizada.
17.13. (138) Localización (dinámico) :
Dinámicamente hacer varios componentes de Ext en lugares diferentes, seleccionando de una lista local.
17.14. (139) Navegador de administración de estado :
Un ejemplo de almacenar el estado de la aplicación.
17.15. (140) Básico de plantillas :
Un ejemplo básico de plantillas.
17.16. (141) Grupo de burbujas :
Esta es una interfaz de usuario de panel personalizado para lograr un aspecto diferente, aunque no modifica la apariencia predeterminada de un Ext.Panel.