Sencha Touch|Sencha Touch中文|Sencha Touch中文教程

Jay Garcia develops Ext JS and Sencha Touch applications for various clients around the world and actively contributes to the Sencha community as a speaker, advocate, and frequent poster on technical forums. Author of Ext JS in Action, Jay has been a Sencha enthusiast and supporter since 2006. Anthony De Moss has been an avid Ext JS enthusiast since 2007 and is fanatical about good product design and usability. On the rare occasion he's away from his keyboard, you can find him climbing at the local rock gym. Mitchell Simoens has been working with Ext JS since late 2006 and Sencha Touch since 2010. He now works at Sencha doing primarily support on the forums but also works on Ext JS and Sencha Touch.

概述

布局系统是Sencha框架中最强大和最独特的一部分。布局会处理应用程序中每个组件的大小和位置，因而，不需要手动去管理那些碎片。Ext JS与Sencha Touch的布局类有许多相似之处，最近在 Ivan Jouikov的这篇博文中对他们进行了详细的分析。

虽然是这样，但很多Ext JS和Sencha Touch开发人员可能永远都不会去了解布局系统的机制原理。Sencha框架已经提供了最常用的应用程序布局，因此很少出现应用程序需要额外功能的需求，因而不大会有人愿意去了解布局系统的内部运作。

试想一下，你的公司需要在应用程序中使用3D Carousel来显示界面元素，但没有任何标准的Sencha布局可以提供这种能力，哪怎么来解决这个问题呢？

随着Web技术的不断发展，前端开发框架层出不穷，各有千秋，开发者在做技术选型时总是要费一番脑筋，最近，IBM高级工程师王芳侠撰文对Bootstrap、jQuery UI、jQuery Mobile、Sencha ExtJS、Sencha Touch、Sencha GXT、Dojo、Dojo Mobile、Mootools、Foundation、YUI、Kissy、QWrap 等 16 个国内外前端开发框架进行了比较详细的比较，非常值得读者借鉴。

问题：selectfield组件默认接收的options数据形如：

    var selectOptionData = [
    {text: 'First Option',  value: 'first'},
    {text: 'Second Option', value: 'second'},
    {text: 'Third Option',  value: 'third'},
    ]; 

而我从后台服务接到的数据可能形如：