(37)swapStyleSheet():改变文档样式风格

//2:swapStyleSheet():改变文档样式风格
Ext.onReady(function(){
	var themes=[
			{theme:'默认',css:'ext-all.css'},
			{theme:'黑色',css:'ext-all-access.css'},
			{theme:'红色',css:'ext-all-red.css'}
		];
		//创建主题数据模型
		Ext.regModel('Theme',{
			fields:['theme','css']
		});
		//创建主题数据源
		var themeStore=Ext.create('Ext.data.Store',{
			model:'Theme',
			data:themes
		});
		//创建主题切换选择框
		var themeChange=Ext.create('Ext.form.ComboBox',{
			id:'themeChange',
			width:150,
			labelWidth:60,
			labelSeparator:':',
			fieldLabel:'样式选择',
			store:themeStore,
			editable:false,
			triggerAction:'all',//单击触发按钮显示全部数据
			store:themeStore,
			displayField:'theme',
			valueField:'css',
			queryMode:'local',//本地模式
			value:'ext-all.css',//默认风格
			listeners:{
				'collapse':function(){
					Ext.util.CSS.swapStyleSheet('theme','js/extjs/resources/css'+this.getValue());//要确保存在这个文件
					contentIframe.window.themeChange(this.getValue());
				}
			}

		});
				Ext.create('Ext.form.FormPanel',{
					title:'Ext.form.ComboBox本地数据源示例',
					renderTo:Ext.getBody(),
					bodyPadding:5,
					frame:true,
					height:100,
					width:270,
					defaults:{//统一设置表单字段默认属性
						labelSeparator:':',
						labelWidth:70,
						width:200,
						labelAlign:'left'//标签对齐方式
					},
					items:themeChange
				});
});