通过上一章节的操作,我们的项目已经创建完成了,

   大家通过http://127.0.0.1/MyFirst/应该都已经访问到了自己的应用,

   接下来,我们展开我们项目,如图所示:

    

  一、目录结构   

   1. .sencha目录

    .sencha 文件夹下主要是sencha cmd创建项目时生成的一些配置文件,对我们的开发并没有太大影响,我们可以暂时先不去管它  

   2. app 目录

    app文件夹是我们的项目主体文件夹,我们整个项目的功能代码基本都在这个目录中,

    整个目录体现了sencha touch的mvc结构,

    

    我们展开app目录,可以看到六个子目录,

    我们看一下这些目录分别存放什么作用的文件

    --app
      ----controller

         通过监听view界面上的用户交互操作,

         例如滑动、点击等事件来执行相关的操作

      ----form

         这个是cmd生成的文件夹,从字面意思来看是表单的意思,但是官方文档中并未提及到该文件夹,

         我想可能是用于以后将form表单这类view放到其中进行控制的吧

      ----model

         用于定义一种类型的数据,如电子商务程序所需要对应用户,订单,产品型号等数据类型,用oop的说法应该就是实体类

      ----profile

         用来判断用户的设备类型,并且可以做相应的操作跳转为对应平台设计的view界面

      ----store

         在这里我们把它称之为数据仓库,可以帮助你载入数据到list,dataview这类的功能强大的视图组件上,

         store一般需要跟model做关联

      ----view

         用来展现我们的用户程序界面

      这里我们只对目录文件做个简单的介绍,在后面的教程中我们会详细讲解各个模块的详细用法

   

   3.build目录

    默认设置情况下,我们用sencha cmd指令打包压缩编译的项目会生成在该文件夹下

    等讲到如何打包的时候我们会详细讲解

   4.resources目录  

    项目的css文件,图片等资源都存放在这里,

    还有我们强大的scss文件,这是css框架sass的文件,sencha touch把它很好地结合到了项目中,

    通过对它的编写,我们可以很容易地实现对项目的主题修改,样式编辑等功能

    

   5.touch目录 

    这个文件夹将sdk包中的资源文件拷了过来,包含了css样式,启动图片,src项目源码等文件

   6.bootstrap.js和bootstrap.json

    这两个是cmd创建项目时生成的默认的引导文件,建议大家不要去修改,

    bootstrap.js里提供了全局的Ext文件的引用,

    bootstrap.json则是app.json跟packager.json的合并内容

   
   7.build.xml和packager.json

    build.xml是cmd的配置文件,

    packager.json是用cmd打包移动设备安装程序的配置文件

   
   8.app.js和app.json

    app.js是我们整个程序的入口js文件

    app.json是用来配置应用程序的访问资源的,如css,js以及离线缓存文件的配置

  
   9.index.html

    index.html是我们整个程序的访问入口

  这就是我们整个项目的结构了,这里只做了简单介绍,

  下一章,我们会完整地讲解整个项目是如何运行的,并对项目的代码进行讲解

  

    

    

      

sencha touch 入门系列 (四)sencha touch 新建项目目录结构解析的更多相关文章

  1. SpringBoot入门笔记(四)、通常Mybatis项目目录结构

    1.工程启动类(AppConfig.java) 2.实体类(domain) 3.数据访问层(dao) 4.数据服务层(service) 5.前端控制器(controller) 6.工具类(util) ...

  2. Angular-cli新建项目目录结构详解

    Angular-cli新建项目目录结构详解 在上一篇博客中我们已经通过Angular CLI命令行工具创建出来一个全新的Angular项目,要想写项目,首先我们要先搞清楚项目的目录结构是怎样的,每个文 ...

  3. linux入门系列2--CentOs图形界面操作及目录结构

    上一篇文章"linux入门系列1--环境准备及linux安装"直观演示了虚拟机软件VMware和Centos操作系统的安装,按照文章一步一步操作,一定都可以安装成功.装好系统之后, ...

  4. sencha touch 入门系列 (九) sencha touch 布局layout

    布局用来描述你应用程序中组件的大小和位置,在sencha touch中,为我们提供了下面几种布局: 1.HBox: HBox及horizontal box布局,我们这里将其称为水平布局,下面是一段演示 ...

  5. sencha touch 入门系列 扩展篇之sencha touch 项目打包压缩

    经常有新手同学抱怨说sencha touch的项目加载速度为什么这么慢,经常要10秒左右的时间甚至更多, 大家都知道,sencha touch开发的项目中引用了大量的js文件,当我们打开项目时,st的 ...

  6. [转]C# 互操作性入门系列(四):在C# 中调用COM组件

    传送门 C#互操作系列文章: C# 互操作性入门系列(一):C#中互操作性介绍 C# 互操作性入门系列(二):使用平台调用调用Win32 函数 C# 互操作性入门系列(三):平台调用中的数据封送处理 ...

  7. C语言高速入门系列(四)

    C语言高速入门系列(四) C语言数组 ---------转载请注明出处:coder-pig 贴心小提示:假设图看不清晰可右键另存为,应该就非常清晰了; 注意上面的代码都要自己过一遍哦! 本节引言: 经 ...

  8. 【Android Studio安装部署系列】三、Android Studio项目目录结构

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 概述 简单介绍下Android studio新建项目的目录结构. 常用项目结构类型 在Android Studio中,提供了以下几种项目结 ...

  9. sencha touch 入门系列 (二)sencha touch 开发准备

    这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题.接下来我们就开始我们的sencha touch开 ...

随机推荐

  1. 分散/聚集IO(scatter/gather)及iovec结构体

    分散/聚集 I/O是一种可以在单次系统调用中对多个缓冲区输入输出的方法,可以把多个缓冲区的数据写到单个数据流,也可以把单个数据流读到多个缓冲区中.其命名的原因在于数据会被分散到指定缓冲区向量,或者从指 ...

  2. oozie中调度mapreduce

    mapreduce可以直接对hdfs进行清洗和计算,这里介绍oozie中如何调度使用. 操作步骤如下: 1. 写一个mapper和reduce类,并且打包成jar包 2. 在workflow中引用ma ...

  3. [转]Handler学习笔记(二)

    一.一个问题 有这样一个问题值得我们思考,若把一些类似于下载的功能(既耗时且不一定有结果)写在Activity(主线程)里,会导致Activity阻塞,长时间无响应,直至页面假死(如果5秒钟还没有完成 ...

  4. 对设计领域中Tile和Card的理解

    前端工程师离不开设计, 谈到设计就要想到大名鼎鼎的material design主题, 而material是以card为经典单元的, card即卡片, 是层次化模型的最小模块, 用于提供扁平化的信息, ...

  5. 隐藏的Swiper显示后无法获取正确的宽度和高度

    今天在使用swiper的时候,元素默认是显示的时候没毛病,但是默认是隐藏的状态,再显示的时候发现滑动的时候宽度计算有误,如下图所示: 正确的显示如下: 隐藏的元素再次显示如下: 宽度计算有误 解决方案 ...

  6. JS三大经典变量命名法

    匈牙利命名法: 通过在变量名前面添加相应小写字母的符号标示作为前缀,标示出变量的作用域,类型等,前缀后面是一个或多个单词组合,单词描述了变量的用途,如i表示的是整数,s表示的是字符串.示例: var ...

  7. 如果你不知道这11款常见的Web应用程序框架 就说明你out了

    本文推荐了11款常见的Web应用程序框架,并列出了相关的学习资料和下载文档.如果对这些项目还不熟悉,就赶紧学起来吧~ Rails Rails是Ruby on Rails的简称,是一款开源的Web应用框 ...

  8. Windoows窗口程序二

    WNDCLASS属性style取值: CS_GLOBALCLASS--应用程序全局窗口类 CS_BYTEALIGNCLIENT--窗口客户区的水平位置8倍数对齐 CS_BYTEALIGNWINDOW- ...

  9. ViZDoom安装

    官网:https://github.com/mwydmuch/ViZDoom/blob/master/doc/Building.md 环境:ubuntu16, python2.7, Anaconda2 ...

  10. Unity中的Transform Gizmo中的Pivot和Center

    选择中心(Center)意味着使用当前所选所有物体的共同轴心, 选择轴心(Pivot)意味着将使用各个物体的实际轴心 区别在于是否选中了多个物体或者有层级关系的物体. 第一张图是Center,中心在组 ...