`
348725767
  • 浏览: 105226 次
  • 性别: Icon_minigender_1
  • 来自: 温州
社区版块
存档分类
最新评论

sencha touch2学习笔记(二)----定义类与类的继承

阅读更多

 

原文链接:http://chennaigong.iteye.com/blog/1545057

 

最近几天学了下sencha touch2的一些基本控件和一些写法。都是很基础的(呵呵  高级的我学不会。。)

sencha touch2的语法感觉很像面向对象的语法。有自己的类,类可以继承。(现在语言貌似都向oop靠拢。。)。

sencha touch2如果项目大的话有一种mvc的架构写法。这以后贴代码给大家看吧。

这篇文章讲的是sencha touch2的类。

废话不多说了。开始吧。

首先你先配置下sencha touch2的环境,导入sdk什么的,请参照http://chennaigong.iteye.com/admin/blogs/1542268

 

配置好了环境之后,就可以在app.js里写代码喽。

 

首先申明一个类:

 

Ext.define(
"Animal",
{
	config:
	{
		name:null
	},
	constructor:function(config)
	{
		this.initConfig(config);
	},
	speak:function()
	{
		Ext.Msg.alert("123");
	}
}
)

 看得懂吧。申明了"Animal"这个类,然后申明name这个变量,constructor就是这个类初始化时要调用的。speak是一个方法。把这句翻译成Java代码可以如下:

 

 

public class Animal
{
	String name;

	public String getName()
	{
		return name;
	}
	public void setName(String name)
	{
		this.name = name;
	}
	
	public void speak()
	{
		System.out.print("123");
	}
}

呵呵  当你在sencha touch2里申明name变量时,他会自动生成getter和setter存取方法的。当然这里的name不一定是String类型的。

然后可以调用这个类了 。完整的写法如下:

 

Ext.application(
{
	name:"sencha",
	launch:function()
	{
		var my=Ext.create("Animal",{name:"bob"})
		my.speak();
	}
}
)

Ext.define(
"Animal",
{
	config:
	{
		name:null
	},
	constructor:function(config)
	{
		this.initConfig(config);
	},
	speak:function()
	{
		Ext.Msg.alert("123");
	}
}
)

 然后类的继承写法如下:

 

 

Ext.define(
"Person",
{
	extend:"Animal",
	speak:function()
	{
		Ext.Msg.alert(this.getName());
	}
}
)
 

应该看得懂吧,Person类继承了Animal类,然后覆盖了speak这个方法。

完整的的如下:

 

Ext.application(
{
	name:"sencha",
	launch:function()
	{
		var my=Ext.create("Person",{name:"bob"})
		my.setName("haha");
		my.speak();
	}
}
)

Ext.define(
"Animal",
{
	config:
	{
		name:null
	},
	constructor:function(config)
	{
		this.initConfig(config);
	},
	speak:function()
	{
		Ext.Msg.alert("123");
	}
}
)
Ext.define(
"Person",
{
	extend:"Animal",
	speak:function()
	{
		Ext.Msg.alert(this.getName());
	}
}
)

 他会弹出"haha"这个字符串。呵呵  写好了

分享到:
评论

相关推荐

    sencha touch2学习笔记(一)---环境搭建和开发工具配置

    同时,`app.js`是应用的主入口文件,你需要在这个文件中定义你的应用类和初始视图。 开发过程中,使用Sencha SDK Tools的`sencha app watch`命令可以实时编译和刷新浏览器,这将极大地提升开发效率。你所做的任何...

    sencha-touch-2.1.0-gpl.zip

    sencha-touch-2.1.0-gpl.zip 官网下载的,欢迎下载

    SenchaSDKTools-2.0.0-Beta-windows

    SenchaSDKTools-2.0.0-Beta-windows

    sencha-touch-2.3.1-gpl.zip

    sencha-touch-2.3.1-gpl.zip

    SenchaCmd-6.5.3-windows-64bit.zip

    4. **依赖管理**:它与Sencha的包管理系统(Sencha Package Manager, SenchaPM)配合,可以方便地管理和引入外部扩展库,确保项目的依赖关系得到正确处理。 5. **版本控制**:支持对Sencha框架的版本进行升级或回滚...

    sencha touch2 ajax 获取数据

    在探讨“Sencha Touch2 AJAX获取数据”的主题时,我们首先需要理解Sencha Touch2框架的基本概念以及AJAX技术在其中的应用。Sencha Touch2是一个用于构建高性能、跨平台的移动应用的JavaScript库,它专注于触摸设备上...

    SenchaSDKTools-2.0.0-beta3-windows

    9. **学习资源**:为了更好地利用Sencha SDK Tools,开发者可以参考Sencha的官方文档、在线教程和社区论坛,这些资源提供了丰富的示例和解决方案。 10. **跨平台支持**:虽然这个压缩包是针对Windows的,但Sencha ...

    sencha-touch-2.0.0-commercial

    sencha-touch-2.0.0-commercial

    Sencha Touch2发布.pdf

    Sencha Touch2发布.pdf

    SenchaSDKTools-1.2.3-windows-installer.rar

    SenchaSDKTools-1.2.3 SenchaSDKTools SenchaSDKTools-1.2.3-windows-installer SenchaTools Extjs4.0 SDK Tools 用来压缩打包部署Extjs4.0应用

    sencha-touch-2.0.0-commercial02

    sencha-touch-2.0.0-commercial

    Sencha Touch2环境搭建

    - **模型(Model)**:用于定义数据结构和行为,与后端数据交互的基础。 - **视图(View)**:负责UI的展示,包括组件和布局。 - **控制器(Controller)**:作为视图和模型之间的桥梁,处理用户交互事件和数据更新。 - **...

    SenchaSDKTools-2.0.0-beta3-windows.exe

    Sencha SDK Tools-2.0.0-beta3-windows.exe

    api.zip_sencha _sencha touch api_sencha touch2 api

    标题中的"api.zip_sencha _sencha touch api_sencha touch2 api"表明这是一个关于Sencha Touch API的压缩文件集合,可能包含了Sencha Touch和Sencha Touch 2两个版本的API文档。 **Sencha Touch基础知识** Sencha ...

    sencha-touch-2.1.1-gpl.zip

    它的主要目标是提供一套全面的UI组件和工具,以实现与原生应用相似的用户体验。 Sencha Touch 2.1.1版本在前一版本的基础上进行了优化和增强,提高了性能,提供了更多的功能和组件。以下是一些关键知识点: 1. **...

    Sencha Touch2 MVC Demo (含源码/数据库)

    1. **Sencha Touch 2框架**:包含`sencha-touch.js`或`sencha-touch-debug.js`,这是运行Sencha Touch应用的基本文件,包含了所有核心类和功能。 2. **主题样式**:Sencha Touch 2支持多种视觉主题,如`touch/...

    SenchaArchitect 4(5-4)

    SenchaArchitect 4(5-4)

    SenchaArchitect 5(5-5)

    SenchaArchitect 5(5-5)

    sencha-touch-2.1.0-gpl

    3. **核心库文件**: `sencha-touch-all-debug.js` 和 `sencha-touch-debug.js` 是带调试信息的完整库,适合在开发阶段使用,因为它们提供了详细的错误追踪信息。而 `sencha-touch-all.js` 和 `sencha-touch.js` 是不...

Global site tag (gtag.js) - Google Analytics