基于Ext.ux.MenuButton改造而来,和它不同的是,不会每次都去销毁侧边栏,只是单纯的隐藏,属性配置方面没啥区别,每次点击按钮显示时,会触发showMenu事件/方法

代码如下:

/**
*只隐藏不销毁的侧边栏
* @private
*/
Ext.define('ux.Menu.Context', {
extend: 'Ext.Button',
requires: ['Ext.ux.ContextMenu'],
config: {
menuItems: [],
menuSide: 'right',
menuCover: false,
menuCls: null,
listeners: {
tap: 'onTap'
}
},
initialize: function () {
var me = this;
me.$menu = Ext.create('Ext.ux.ContextMenu', {
cls: me.getMenuCls(),
items: me.getMenuItems(),
listeners: {
scope: me,
hide: function () {
Ext.Viewport.hideMenu(me.getMenuSide());
}
}
});
me.$menu.on({
scope: me,
tap: me.onMenuButtonTap,
delegate: 'button'
});
Ext.Viewport.setMenu(me.$menu, {
side: me.getMenuSide(),
cover: me.getMenuCover()
});
me.callParent(arguments);
},
onTap: function (e) {
this.fireAction('showMenu', [this], 'showMenu');
Ext.Viewport.showMenu(this.getMenuSide());
},
onMenuButtonTap: function (button) {
Ext.Viewport.hideMenu(this.getMenuSide());
}
});

具体用法可参考官方blackberry示例

效果图:

sencha touch 侧边栏扩展(只隐藏不销毁)的更多相关文章

  1. sencha touch carousel 扩展 CardList 可绑定data/store

    扩展代码: /* *扩展carousel *通过data,tpl,store配置数据 */ Ext.define('ux.CardList', { extend: 'Ext.carousel.Caro ...

  2. sencha touch 评分扩展

    原版 :https://market.sencha.com/extensions/sencha-touch-2-rating-star-field 效果: 我的改造版(只是类名变了): Ext.def ...

  3. 第一步 使用sencha touch cmd 4.0 创建项目、打包(加入全局变量、公用类、自定义扩展、资源文件)

    参考资料: http://www.cnblogs.com/qqloving/archive/2013/04/25/3043606.html http://www.admin10000.com/docu ...

  4. sencha touch datepicker/datepickerfield(时间选择控件)扩展(废弃 仅参考)

    参考资料:https://market.sencha.com/extensions/datetimepicker 上面的扩展在2.2有些问题,参考源码重新写了一个 TimePicker: Ext.de ...

  5. sencha touch datepicker/datepickerfield(时间选择控件)扩展

    参考资料: https://market.sencha.com/extensions/datetimepicker 适用于2.4.1版本 uxPickerTime 使用方法参考:datepicker控 ...

  6. sencha touch tabsidebar 源码扩展

    先上图看效果 没错,这是一个sencha touch 项目,而这里的右边推出效果(下文叫做tabsiderbar),使用插件tabsiderbar来扩展的. 插件js下载地址:http://www.m ...

  7. sencha touch 扩展篇之将sencha touch打包成安装程序(下)- 使用phonegap打包安装程序

        这讲我们来讲解下如何使用phonegapa创建项目环境并通过她们将sencha touch打包成app,这里我们只讲解打包android的apk,打包ios的过程有点类似,但是需要在mac环境 ...

  8. sencha touch 扩展篇之将sencha touch打包成安装程序(上)- 使用sencha cmd打包安装程序

    由于最近一直忙着android原生的开发,很久没有更新博客了,官方的sencha cmd工具功能非常强大,创建项目,压缩项目,打包安装程序都能轻松实现,这讲我们就给大家介绍下如何使用sencha cm ...

  9. sencha touch 扩展篇之使用sass自定义主题样式 (下)通过css修改官方组件样式以及自定义图标

    上一讲我们讲解了如何使用官方的api来修改主题样式,这讲我们继续讲解sass的样式修改, 编译官方自带的主题包  在生成的项目以及官方sdk的目录下,自带了一些主题sass包,我们也可以通过修改sas ...

随机推荐

  1. Yii2.0 to(), toRoute(), current()区别用法

    [Url::current] - 现在测试本地路径(http://daxia.dc.weixin.com/mobile/hmConnections/user/verify-user) a: //获取当 ...

  2. Lucene基础学习笔记

    在学校和老师一起做项目,在老师的推荐下深入学习了一些SqlServer的知识,看一些书下来哎也没记住多少,不过带来了新疑问. 不使用模糊查询,我应该用什么呢?如何能不影响数据库性能,还能做模糊查询呢? ...

  3. Python学习(五)——列表操作全透析

    列表是以类的形式实现的. "创建"列表实际上是将一个类实例化. 因此,列表有多种方法能够操作. Python列表操作的函数和方法 列表操作包括下面函数: 1.cmp(list1, ...

  4. 【转帖】Linux发行版:CentOS、Ubuntu、RedHat、Android、Tizen、MeeGo

     Linux发行版:CentOS.Ubuntu.RedHat.Android.Tizen.MeeGo作者:阳光岛主 原文在这儿 Linux,最早由Linus Benedict Torvalds在199 ...

  5. AsyncTask异步类的简单操作

    package com.example.day9; import org.apache.http.HttpEntity; import org.apache.http.HttpResponse; im ...

  6. Oracle统计每条数据的大小

    怎么查询一条记录到底占了多少空间呢,随便用一个表举例(如上图),就着解决眼前问题的原则(oracle),网上简单查了查,发现生效了,就没深入了解了,包括其它数据库怎么解决,都没做研究.Oracle下, ...

  7. 解决parseSdkContent failed java.lang.NullPointerException错误

    今天我的eclipse崩溃了,报“parseSdkContent failed java.lang.NullPointerException”的错误. 所有的安卓项目都不正常,创建项目就会报 java ...

  8. springboot+jps+druid项目搭建

    pom.xml文件 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www ...

  9. pom.xml 配置maven私服

    1.pom.xml 配置maven私服 <repositories>       <repository>        <id>caf_repositories& ...

  10. MongoDB入门知识

    基本概念 MongoDB是一个面向文档的数据库,不是关系型数据库.MongoDB是无模式的,也就是说文档的键不需要事先定义,也不会是一成不变. 跟关系数据库相比,MongoDB中出现了一些新的定义: ...