sencha touch
香辣牛肉面
这个作者很懒,什么都没留下…
展开
-
sencha touch 扩展篇之使用sass自定义主题样式 (下)通过css修改官方组件样式以及自定义图标
上一讲我们讲解了如何使用官方的api来修改主题样式,这讲我们继续讲解sass的样式修改, 编译官方自带的主题包 在生成的项目以及官方sdk的目录下,自带了一些主题sass包,我们也可以通过修改sass文件来引入他们并进行编译,下图是官方sdk中自带的主题样式包: 我们如何在sass文件中导入这些样式呢,我们接着上一讲创建的项目,打开项目下resources/sass文件原创 2015-01-15 11:39:59 · 2337 阅读 · 0 评论 -
sencha touch 扩展篇之将sencha touch打包成安装程序(上)- 使用sencha cmd打包安装程序
由于最近一直忙着android原生的开发,很久没有更新博客了,官方的sencha cmd工具功能非常强大,创建项目,压缩项目,打包安装程序都能轻松实现,这讲我们就给大家介绍下如何使用sencha cmd来打包我们的sencha touch项目, 为了更好地向大家演示如何打包一个sencha touch的项目,我们用sencha cmd创建一个演示项目,如果你的sencha cmd环境还没有配原创 2015-01-15 11:40:03 · 2529 阅读 · 2 评论 -
sencha touch 扩展篇之将sencha touch打包成安装程序(下)- 使用phonegap打包安装程序
这讲我们来讲解下如何使用phonegapa创建项目环境并通过她们将sencha touch打包成app,这里我们只讲解打包android的apk,打包ios的过程有点类似,但是需要在mac环境下,最后通过xcode导出成ipa安装程序; 一、phonegap环境搭建: phonegap从3.0开始已经不再使用手动的方式搭建项目了,而是使用command-line命令行工具来搭建原创 2015-01-15 11:40:10 · 4417 阅读 · 0 评论 -
sencha touch 入门系列 (九) sencha touch 布局layout
布局用来描述你应用程序中组件的大小和位置,在sencha touch中,为我们提供了下面几种布局: 1.HBox: HBox及horizontal box布局,我们这里将其称为水平布局,下面是一段演示代码: 1 Ext.create('Ext.Container', { 2 fullscreen: true, 3 layout: 'hbox', 4原创 2015-01-15 11:39:48 · 1634 阅读 · 2 评论 -
sencha touch在华为emotion ui 2.0自带浏览器中圆角溢出的bug
在华为emotion ui 2.0自带的浏览器中,给部分组件设置了圆角后会发现背景仍然是方的,内部边框是圆的,对于这种bug,只需在对应的设置圆角的css样式中加入background-clip: padding-box;即可修复原创 2015-01-15 11:40:30 · 1441 阅读 · 0 评论 -
border-radius bug 收集
border-radius我相信对于老一辈的前端们有着特殊的感情,在经历了没有圆角的蛮荒时代,到如今 CSS3 遍地开花,我们还是很幸福的。然而即使到了三星大脸流行时代,border-radius在移动端的表现依旧差强人意,主要有两点问题:一、Android 2.3 自带浏览器不支持 %通常我们实现一个正圆只需要border-radius: 50%即可,大致代码如下:.foo转载 2015-01-15 11:40:27 · 3125 阅读 · 0 评论 -
关于sencha touch中给文本添加焦点无效的解决方案
目前的解决方案是给你的执行代码加上一个timeout延迟100ms+ setTimeout(function(){ SoftKeyboard.isShowing(function(isShowing){ textfields[0].focus(); if(!isShow原创 2015-01-15 11:39:11 · 967 阅读 · 0 评论 -
关于用phonegap 3.0+ 打包后sencha touch按钮点击切换动画延迟接近一秒的以及界面闪烁的解决方案
android的webview对硬件加速的支持貌似很不理想,在开启硬件加速的情况下,css3这些需要调用硬件加速的样式会大幅拖慢html5的webapp,在htc的部分手机上还会因开启硬件加速而导致闪屏等现象。 在phonegap 3.0之前,都是用户自己来配置AndroidMainifest.xml文件,可能都没注意到这一点,在phonegap 3.0+之后,phonegap项目的创建都是原创 2015-01-15 11:39:05 · 1371 阅读 · 0 评论 -
sencha touch 组件选择器getCmp和ComponentQuery.query()的效率解析
昨天无意中在网上看到一篇讲解sencha touch组件选择器的文章,名为 Sencha touch 2通过Ext.ComponentQuery.query查找组件。里面对组件选择器的效率讲解完全反了,说getCmp是在dom树中全文查找,效率不高,而ComponentQuery.query()效率比较高,而且该文章被很多文章采集器采集到了很多网站上。 这里有必要纠正下,跟这边文章的描述原创 2015-01-15 11:39:29 · 1185 阅读 · 0 评论 -
sencha touch 扩展篇之使用sass自定义主题样式 (上)使用官方的api修改主题样式
大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们app的主题跟样式。 在sencha touch中,已经默认提供了一些主题样式,我们可以在下载的sencha touch sdk路径下的touch-building/resources/css和原创 2015-01-15 11:39:50 · 3143 阅读 · 0 评论 -
sencha touch 小米3无法点击问题 修复
修改源码文件夹下event/publisher/Dom.js中的attachListener方法,代码如下attachListener: function(eventName, doc) { if (!doc) { doc = document; } var defaultView = doc.defaul原创 2015-01-15 11:40:52 · 1132 阅读 · 0 评论 -
sencha touch 入门系列 (三)sencha touch 项目创建
通过上一章节的学习,我们的开发环境已经配置好了,接下来我们开始创建第一个sencha touch的项目,网络上很多sencha touch的教程都是手动搭建项目的, 不过手动搭建的项目缺少一些sencha cmd对项目代码打包压缩编译的关键文件, 所以在这里我们从创建项目开始都是使用sencha cmd工具,请确保上一章节中所有的环境配置都已经成功, 那么接下来我们开始我们的项目原创 2015-01-15 11:38:04 · 1638 阅读 · 1 评论 -
sencha touch 入门系列 (九)sencha touch 视图组件简介
对于一个普通用户来说,你的项目就是一组简单的视图集合,用户直接通过跟视图进行交互来操作你的应用,对于一个开发人员来说,视图是一个项目的入口,虽然大部分时候最有价值的部分是在model层和control层,所以这讲,我们将先介绍如何创建和使用我们的视图组件view。 首先,我们来介绍如何创建我们的视图组件, 在sencha touch中,已经封装好了一批在项目中可能常用的视图组件,如列表原创 2015-01-15 11:39:34 · 1150 阅读 · 0 评论 -
sencha touch 入门系列 (四)sencha touch 新建项目目录结构解析
通过上一章节的操作,我们的项目已经创建完成了, 大家通过http://127.0.0.1/MyFirst/应该都已经访问到了自己的应用, 接下来,我们展开我们项目,如图所示: 一、目录结构 1. .sencha目录 .sencha 文件夹下主要是sencha cmd创建项目时生成的一些配置文件,对我们的开发并没有太大影响,我们可以暂时先不去原创 2015-01-15 11:38:11 · 2177 阅读 · 2 评论 -
sencha touch 入门系列 (二)sencha touch 开发准备
这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题。接下来我们就开始我们的sencha touch开发之旅了。 首先,我们开始搭建sencha touch的开发环境,我这讲的环境搭建主要是针对windows平台的: 1.选择一款能够兼容并调试sencha touch的浏览器:原创 2015-01-15 14:27:06 · 6130 阅读 · 2 评论 -
收集的可以下载css3字体图标的网站
http://icomoon.io/app/ 可以选择跟简单调整图标打包成css3 字体下载,http://www.flaticon.com/categories/weapons原创 2015-01-15 11:38:31 · 666 阅读 · 0 评论 -
sencha touch 入门系列 扩展篇之sencha touch 项目打包压缩
经常有新手同学抱怨说sencha touch的项目加载速度为什么这么慢,经常要10秒左右的时间甚至更多, 大家都知道,sencha touch开发的项目中引用了大量的js文件,当我们打开项目时,st的项目会一个一个地加载这些js文件,这样就造成了项目加载速度慢,如果是web远程访问,还会产生大量的http请求影响加载速度,增加服务器压力。 所以,我们的项目需要使用sencha cmd来原创 2015-01-15 11:39:36 · 3697 阅读 · 2 评论 -
sencha touch 问题汇总
做sencha touch有一段时间了,目前而言,sencha touch在android上问题比较严重,在此对android中sencha touch的问题做一些汇总:1.内存问题: 打包成安装程序的sencha touch由于是将其封装在了webview中,因此,内存的占用注定是个瓶颈,几乎不写什么代码载入sencha touch内存就要占用到50mb左右;2.性能问题:原创 2015-01-15 11:38:35 · 997 阅读 · 0 评论 -
关于sencha touch 用phonegap打包后,docked悬停的组件被手机软键盘遮挡的解决方法
这个问题应该算是phonegap的一个bug,在mainifest.xml 里android:windowSoftInputMode设置成了adjustpan,理论上不会出现遮挡悬停组件这种情况,不过phonegap的config.xml里fullscreen设置成true的时候这个属性就失效了,不管设置成什么都无效,所以目前的解决方案是将phonegap创建的项目里的config.xml原创 2015-01-15 11:38:22 · 1178 阅读 · 0 评论 -
sencha touch 入门系列 (一)sencha touch 简介
参考链接:http://mobile.51cto.com/others-278381.htm Sencha touch 是基于JavaScript编写的Ajax框架ExtJS,将现有的ExtJS整合JQTouch、Raphaël库,推出适用于最前沿Touch Web的移动应用开发框架,该框架是世界上第一个基于HTML5的Mobile App框架。同时,ExtJS更名为S原创 2015-01-15 14:24:49 · 1944 阅读 · 2 评论 -
sencha touch 入门系列 (五)sencha touch运行及代码解析(上)
由于最近项目比较忙,加之还要转战原生开发,所以很久没更新了,今天我们接着上一次的内容往下讲: 首先我们打开index.html,这是我们整个程序的访问入口,也是整个项目的引入地: 1 DOCTYPE HTML> 2 html manifest="" lang="en-US"> 3 head> 4 meta charset="UTF-8"> 5原创 2015-01-15 11:39:07 · 3541 阅读 · 2 评论 -
sencha touch 入门系列 (六)sencha touch运行及代码解析(下)
接着上一讲,通过index.html里development.js对app.json里js资源文件的解析,app.js便被index.html引入了, app.js是整个项目的程序入口,在项目完成时使用sencha cmd打包压缩项目时,默认情况下所有的js文件都会被压缩成一行放置在app.js中,关于项目的打包我们会在后面的课程详细讲解, 接下来我们来看下app.js,了解下整个项目是如原创 2015-01-15 11:39:16 · 1410 阅读 · 0 评论 -
sencha touch 入门系列 (七)sencha touch 类系统讲解(上)
在mvc结构的基础上,sencha touch又使用了sencha公司为extjs4开发出来的类系统,在面向对象的编程语言中,类是对对象的定义,它描述了对象所包含的大量属性和方法。跟面向对象语言类似,sencha touch的类提供了继承,依赖加载,mixins,属性方法设置这些强大的功能。 sencha touch将自己封装成了一个面向对象的开发框架,如果你去查看官方的api,你会发现原创 2015-01-15 11:39:20 · 1297 阅读 · 0 评论 -
sencha touch 入门系列 (八)sencha touch类系统讲解(下)
sencha touch类系统讲解原创 2015-01-15 11:39:25 · 1318 阅读 · 3 评论 -
关于sencha touch在华为、红米等部分手机下hide事件失效,msgbox无法关闭的解决方案(已更新最新解决方案)
(急着解决问题的同学可以直接跳最底部查看最终的解决方案) 问题描述 因为前段时间抢到了华为荣耀3c,所以做项目的时候就用荣耀3c测试了一下项目, 结果发现在华为的emotion ui上sencha touch的messagebox的弹窗,弹出后点击确认按钮时无法隐藏, 有的圆角框还有会缺边,不过不仔细看倒是不看得出来, 这是我的项目在手机上的截图, 当我点击确定按原创 2015-01-15 11:40:48 · 2827 阅读 · 1 评论