Sencha Touch系列之实现图片切换效果

╰半橙微兮° 2021-09-10 16:52 287阅读 0赞

** **

1.  先去Sencha Touch的官网下载需要的库文件，文件目录如图所示：
    
    **![Center][]**
    
    **                             **图1-1
2.  然后创建homework1.js文件，加注释，代码分析:
    
    先写ShenCha Touch需要的引用，然后再在lunch:function()里面创建需要的组件和事件
    
    **![Center 1][]**
    
    在lunch:function()里面创建一个标题栏和四个Panel组件
    
    **![Center 2][]**
    
    创建TabPanel，并将四个带有图片的Panel添加到里面
    
    ** **
    
    **![Center 3][]**
    
    ** **
    
    再创建一个Panel，将所有的都添加到里面，调用Ext.Viewport.add()添加Panel进来就可以
    
    **![Center 4][]**
    
    (3)创建homework1.html：
    
    **![Center 5][]**

**效果如图**

![Center 6][]

[Center]: /images/20210813/5e3a3a569bb54074ae2786af982c6024.png
[Center 1]: /images/20210813/7514f62be0e9496d9a60cb7965d09d86.png
[Center 2]: /images/20210813/1428ea830d47464c87c22eae4e037498.png
[Center 3]: /images/20210813/e06db05b26ce4f0c98bdb0b3eaa2b143.png
[Center 4]: /images/20210813/88f4f11f6cb74b3b9e0973d4fff7e054.png
[Center 5]: /images/20210813/4052d2294253490f948adcd6cd8cd64f.png
[Center 6]: /images/20210813/17a01a14b49c405d962c89677d7f68b2.png

发表评论取消回复

表情：

评论列表（有 0 条评论，287人围观）

还没有评论，来说两句吧...

相关阅读

相关 sencha Touch项目常见命令

常见命令 1.创建mvc ![这里写图片描述][20160617145203041] 2.编译app.scss文件更改主题/引入touch-2.4.2

系统管理员/ 2022年09月21日 11:38/ 0 赞/ 119 阅读

相关创建Sencha touch第一个应用

最近学习Sencha touch ，是一个菜鸟级别。废话不多说，让我们来创建Sencha touch的第一应用. 首先，我们下载[Sencha touch2.0 sdk

叁歲伎倆/ 2022年08月25日 11:49/ 0 赞/ 147 阅读

相关 sencha cmd新建sencha touch项目

1、从官方网站[http://www.sencha.com/][http_www.sencha.com] 下载 [sencha-touch-2.4.1-commercial.z

柔光的暖阳◎/ 2022年08月08日 13:47/ 0 赞/ 161 阅读

相关创建第一个sencha touch例子

第一步：在myeclipse 上 new 一个 web project，Project Name 命名为 touch；第二步：在WebRoot 目录下新建一个文件夹sen

古城微笑少年丶/ 2022年08月06日 20:28/ 0 赞/ 136 阅读

相关图片切换效果!

学了一段时间tween算法,也学习了一些好的代码,也写了一些例子,不过都是模仿的, 但这个绝对是原创, HOHO <style type="text/css"> .s

忘是亡心i/ 2022年08月06日 05:17/ 0 赞/ 193 阅读

相关 vue中实现简单切换图片效果

实例：实现大于三张图片时，点击箭头图片切换，并有箭头置灰不可操作。 html <div class="summary"> <div class=

青旅半醒/ 2022年05月23日 01:44/ 0 赞/ 226 阅读

相关 Sencha Touch快速入门（译）

翻译自：[http://www.sencha.com/learn/sencha-touch-quick-start/][http_www.sencha.com_learn_se

本是古典何须时尚/ 2022年01月11日 22:41/ 0 赞/ 188 阅读

相关图片切换效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[http://www.w3.org/T

ゝ一纸荒年。/ 2021年10月08日 05:30/ 0 赞/ 413 阅读

相关 Bootstrap系列之实现圆形图片效果

安装Bootstrap环境，下载框架文档和core代码您可以从 [http://getbootstrap.com/][http_getbootstrap.com] 上

约定不等于承诺〃/ 2021年09月11日 01:16/ 0 赞/ 502 阅读

相关 Sencha Touch系列之实现图片切换效果

1. 先去Sencha Touch的官网下载需要的库文件，文件目录如图所示： ![Center][]

╰半橙微兮°/ 2021年09月10日 16:52/ 0 赞/ 288 阅读