Course (2-4-2-4) Sencha Architect 2
- 1. Getting Started and General
- 1.1. Guided Tour
- 1.1.1. Download, install, and launch Architect
- 1.1.2. Menu Bar
- 1.1.3. Toolbar
- 1.1.4. Toolbox
- 1.1.5. Log
- 1.1.6. Canvas
- 1.1.7. Flyout config button
- 1.1.8. Code view
- 1.1.9. Architect for Ext JS canvas
- 1.1.10. Architect for Touch canvas
- 1.1.11. Inspector
- 1.1.12. Config panel
- 1.1.13. Framework API documentation for detailed information
- 1.2. Project Basics
- 1.2.1. Project preliminaries
- 1.2.2. Set up a web server and create a projects folder
- 1.2.3. Set URL Prefix
- 1.2.4. Source Control
- 1.2.5. Other useful settings
- 1.2.6. Switching between Ext JS and Sencha Touch frameworks
- 1.2.7. Architect workflow
- 1.2.8. Adding components to an Architect project
- 1.2.9. How Architect stores a project
- 1.2.10. Previewing a project
- 1.2.11. Sharing projects
- 1.2.11.1. Project archives
- 1.2.12. Sharing and Reusing Top-Level Components
- 1.2.12.1. Save to Toolbox
- 1.2.12.2. Export to File
- 1.2.12.3. Import Component
- 1.2.13. Deploying projects
- 1.2.14. Adding resources
- 1.2.15. Simulating and packaging Sencha Touch projects
- 1.3. The Inspector
- 1.3.1. Changing the location of the Inspector
- 1.3.2. How the Inspector structures an application
- 1.3.3. A brief introduction to MVC
- 1.3.4. How to use the Inspector
- 1.3.5. Adding views
- 1.3.5.1. Add top-level views first
- 1.3.5.2. Adding child views
- 1.3.5.3. Rearranging views
- 1.3.6. Adding controllers, stores, and models
- 1.3.7. Adding resources
- 1.3.8. Parent components are separate classes
- 1.3.9. Deleting components
- 1.3.10. Configuring components
- 1.3.11. Reusing and moving components
- 1.3.11.1. Linked instances
- 1.3.11.2. Promoting a child component to a class
- 1.3.11.3. Transforming a component
- 1.3.12. Code view
- 1.4. Build Your First Desktop Application
- 1.4.1. Application description
- 1.4.2. Preliminary steps
- 1.4.3. Project setup
- 1.4.4. Loading data into a grid
- 1.4.4.1. Adding and configuring the grid view
- 1.4.5. Working with data: models and stores
- 1.4.5.1. Create model
- 1.4.5.2. Create store
- 1.4.6. Binding the grid to the store
- 1.4.7. Connect grid to a detail panel
- 1.4.7.1. Adding the detail panel
- 1.4.7.2. Updating the detail panel
- 1.4.8. Add a chart
- 1.4.8.1. Modeling ChartData
- 1.4.8.2. Adding the chart
- 1.4.9. Run the application
- 1.4.10. Files for this article
- 1.5. Build Your First Mobile App
- 1.5.1. Preliminary steps
- 1.5.2. Project setup
- 1.5.3. Build the UI with views
- 1.5.3.1. Application
- 1.5.3.2. Main navigation view
- 1.5.3.3. List view
- 1.5.3.4. Detail view
- 1.5.4. The model
- 1.5.5. The store
- 1.6. Config Panel
- 1.6.1. What's in the Config panel
- 1.6.1.1. Searching for configs
- 1.6.2. Documentation
- 1.6.3. Basic/advanced mode toggle
- 1.6.4. Setting configs
- 1.6.5. Changing config types
- 1.6.6. Custom properties
- 1.6.7. Template configs
- 1.6.7.1. Editing a template
- 1.6.7.2. Template member functions
- 1.6.8. Known Limitations
- 1.6.1. What's in the Config panel
- 1.7. Using Resources
- 1.7.1. Library resource
- 1.7.1.1. Library Options
- 1.7.1.2. Upgrading The Library
- 1.7.2. CSS resources
- 1.7.3. JS resources
- 1.7.4. Direct resource
- 1.7.5. Editing resources
- 1.7.6. Google Maps API (Sencha Touch only)
- 1.7.1. Library resource
- 1.8. Publishing, Packaging, and Simulating a Project
- 1.8.1. Publishing a Project
- 1.8.2. Packaging and Simulating a Sencha Touch project
- 1.8.2.1. Install Plug-ins
- 1.8.2.2. Prepare your project
- 1.8.2.3. Add a packageSettings
- 1.8.2.4. Notes
- 1.1. Guided Tour
- 2. Application Building Reference
- 2.1. Introduction to Views
- 2.1.1. Creating a UI with Architect
- 2.1.2. Typical first step: Add and build views
- 2.1.3. Add a view
- 2.1.4. Delete a view
- 2.1.5. Add more views
- 2.1.6. Configure views
- 2.1.7. Set layout
- 2.1.8. Set additional properties
- 2.1.8.1. Advanced users only: Add custom configs
- 2.1.9. Add events
- 2.1.10. Set the initial view
- 2.1.11. Advanced view config topics
- 2.1.12. View components in Architect
- 2.2. Ext JS View Components
- 2.2.1. Ext JS component categories
- 2.2.2. Containers
- 2.2.3. Charts
- 2.2.4. Form Fields
- 2.2.5. Grids
- 2.2.6. Menus
- 2.2.7. Standard
- 2.2.8. Toolbar
- 2.2.9. Tree
- 2.2.10. Views
- 2.3. Sencha Touch View Components in Architect
- 2.3.1. Sencha Touch view component categories
- 2.3.2. Containers
- 2.3.3. Form Fields
- 2.3.4. Media
- 2.3.5. Pickers
- 2.3.6. Standard
- 2.3.7. Toolbars
- 2.3.8. Views
- 2.4. Layouts
- 2.4.1. Basic container layouts
- 2.4.1.1. Auto
- 2.4.1.2. Absolute
- 2.4.1.3. Accordion
- 2.4.1.4. Anchor
- 2.4.1.5. Border
- 2.4.1.6. Card
- 2.4.1.7. Column
- 2.4.1.8. Fit
- 2.4.1.9. Table
- 2.4.1.10. HBox
- 2.4.1.11. VBox
- 2.4.1.12. Nested layouts
- 2.4.1.13. Flexible box layouts
- 2.4.2. Stretching components to fit
- 2.4.1. Basic container layouts
- 2.5. Controllers Reference
- 2.5.1. Working with controllers in Architect
- 2.5.2. Adding controllers
- 2.5.3. Main controller configs
- 2.5.4. Controller configs for Touch projects
- 2.5.5. Other available configs
- 2.5.6. Additional resources
- 2.6. Stores and Models
- 2.6.1. Stores
- 2.6.1.1. Adding stores
- 2.6.1.2. Configuring stores: basics
- 2.6.2. Models
- 2.6.2.1. Adding models
- 2.6.1.2. Configuring models: The basics
- 2.6.1.3. Additional model configs
- 2.6.2. Associating stores with models and views
- 2.7. Reusing Components
- 2.7.1. Linked Instance
- 2.7.2. Promote to Class
- 2.7.3. Save to Toolbox
- 2.7.4. Component export and import
- 2.8. Working With the Code Editor
- 2.8.1. Navigating code
- 2.8.2. Other options
- 2.8.3. Find/Replace
- 2.8.4. JSHint Validation
- 2.9. Application node configuration notes
- 2.9.1. Configuring the Application node in Ext JS projects
- 2.9.2. Configuring the Application node in Sencha Touch projects
- 2.1. Introduction to Views
- 3. Best Practices
- 3.1. Example Projects
- 3.1.1. Sencha Touch examples
- 3.1.2. Ext JS examples
- 3.2. Working with Layouts: Three Examples
- 3.2.1. Using the Card layout to create a wizard
- 3.2.1.1. Add and configure components
- 3.2.1.2. Add and configure buttons
- 3.2.1.3. Add content to each card
- 3.2.1.4. Three card wizard
- 3.2.2. Using HBox layout to create multiple columns
- 3.2.3. Using Border layout for a Viewport
- 3.3. Build Ext JS Forms in Architect
- 3.3.1. Building a simple form
- 3.3.1.1. Add and configure views
- 3.3.1.2. Add behavior
- 3.3.2. Form components
- 3.3.2.1. Containers
- 3.3.2.2. Fields
- 3.3.3. Controlling form layouts
- 3.3.3.1. Changing the width of form fields
- 3.3.3.2. Grouping fields with FieldSets
- 3.3.3.3. Groups of radio buttons or checkboxes
- 3.3.3.4. Arranging fields in multiple columns
- 3.3.3.5. Aligning fields horizontally
- 3.3.4. Populating a ComboBox
- 3.3.1. Building a simple form
- 3.6. Build Sencha Touch Forms in Architect
- 3.6.1. Building a simple form
- 3.6.1.1. View components
- 3.6.1.2. Behavior
- 3.6.2. Form components
- 3.6.2.3. Containers
- 3.6.2.4. Fields
- 2.6.2.5. Comments
- 3.6.1. Building a simple form
- 3.7. Building Menus
- 3.7.1. Create a menu bar with Toolbar, Button, Menu
- 3.7.2. Add interactivity with a controller
- 3.7.3. Other use of Menu view components
- 3.7.4. Menus in Touch projects
- 3.8. Events and Controllers: Adding Interactivity
- 3.8.1. Event bindings versus controller actions
- 3.8.2. Using an event binding
- 3.8.3. Using a controller
- 3.8.4. Converting an event binding to a controller action
- 3.9. Working With Stores: Three Examples
- 3.9.1. Example 1: Json store
- 3.9.1.1. Add and configure Json Store
- 3.9.1.2. Add and configure a model
- 3.9.1.3. Associate model and store
- 3.9.1.4. Load data
- 3.9.2. Example 2: Array store
- 3.9.2.1. Add and configure Array Store
- 3.9.2.2. Add and configure a model
- 3.9.2.3. Associate model and store
- 3.9.2.4. Load data
- 3.9.3. Example 3: XML store
- 3.9.3.1. Add and configure XML Store
- 3.9.3.2. Add and configure a model
- 3.9.3.3. Associate model and store, load data
- 3.9.4. Next steps: binding views and stores
- 3.9.1. Example 1: Json store
- 3.10. Using Navigation View in Mobile Apps
- 3.10.1. Core concepts
- 3.10.2. Create the cards
- 3.10.2.1. Step 1 card
- 3.10.2.2. Step 2 card
- 3.10.2.3. Step 3 card
- 3.10.3. Creating the Navigation view
- 3.10.4. Controlling the navigation
- 3.10.4.1. Step 1 button action
- 3.10.4.2. Step 2 button action
- 3.10.4.3. Step 3 button action
- 3.10.5. Seeing it in action
- 3.11. Working With Classes
- 3.11.1. Top-level items are classes
- 3.11.1.1. Methods
- 3.11.1.2. Advanced class configuration
- 3.11.2. Class loading
- 3.11.3. Promoted classes and linked instances
- 3.11.4. Custom classes
- 3.11.1. Top-level items are classes
- 3.12. Working With Linked Instances
- 3.12.1. Linked instances: An example
- 3.12.2. Using overrides to do more with linked instances
- 3.13. Using Sencha Touch Overlays
- 3.13.1. Panel
- 3.13.1.1. View components
- 3.13.1.2. Behavior
- 3.13.1.3. ActionSheet
- 3.13.1. Panel
- 3.14. Collaboration Best Practices
- 3.14.1. Source control management
- 3.14.2. Project archive
- 3.14.3. Export to file
- 3.1. Example Projects
Online LIVE Training Programming Course offered by INCAPROG ONLINE - www.incaprog.com - contacto@incaprog.com - Phone : (954) 727-3141