uniGUI之UniButton
2024-04-29 06:29:19
UniButton相关属性设置
1.Bootstrap风格按钮
代码如下（示例）：
.bbtn-bt-blue,.bbtn-bt-blue.x-btn-over {background-color: #337ab7;background-image: none;border-color: #2e6da4;border-radius: 4px;}.bbtn-bt-blue:hover,.bbtn-bt-blue .x-btn-menu-active .x-btn-focus,.bbtn-bt-blue.x-btn-focus {background-color: #286090 !important;border-color: #204d74 !important;background-image: none !important;outline: none!important;}.bbtn-bt-blue.x-btn-pressed {background-color: #204d74 !important;border-color: #122b40 !important;background-image: none !important;}.bbtn-bt-blue:focus {background-color: #286090;border-color: #122b40}.bbtn-bt-green,.bbtn-bt-green.x-btn-over {background-color: #5cb85c;background-image: none;border-color: #4cae4c;border-radius: 4px;}.bbtn-bt-green:hover,.bbtn-bt-green .x-btn-menu-active .x-btn-focus,.bbtn-bt-green.x-btn-focus {background-color: #449d44 !important;border-color: #398439 !important;background-image: none !important;outline: none!important;}.bbtn-bt-green.x-btn-pressed {background-color: #398439 !important;border-color: #255625 !important;background-image: none !important;}.bbtn-bt-green:focus {background-color: #449d44;border-color: #255625}.bbtn-bt-cyan,.bbtn-bt-cyan.x-btn-over {background-color: #5bc0de;background-image: none;border-color: #46b8da;border-radius: 4px;}.bbtn-bt-cyan:hover,.bbtn-bt-cyan .x-btn-menu-active .x-btn-focus,.bbtn-bt-cyan.x-btn-focus {background-color: #31b0d5 !important;border-color: #269abc !important;background-image: none !important;outline: none!important;}.bbtn-bt-cyan.x-btn-pressed {background-color: #269abc !important;border-color: #1b6d85 !important;background-image: none !important;}.bbtn-bt-cyan:focus {background-color: #31b0d5;border-color: #1b6d85}.bbtn-bt-orange,.bbtn-bt-orange.x-btn-over {background-color: #f0ad4e;background-image: none;border-color: #eea236;border-radius: 4px;}.bbtn-bt-orange:hover,.bbtn-bt-orange .x-btn-menu-active .x-btn-focus,.bbtn-bt-orange.x-btn-focus {background-color: #ec971f !important;border-color: #d58512 !important;background-image: none !important;outline: none!important;}.bbtn-bt-orange.x-btn-pressed {background-color: #d58512 !important;border-color: #985f0d !important;background-image: none !important;}.bbtn-bt-orange:focus {color: #fff;background-color: #ec971f;border-color: #985f0d}.bbtn-bt-red,.bbtn-bt-red.x-btn-over {background-color: #d9534f;background-image: none;border-color: #d43f3a;border-radius: 4px;}.bbtn-bt-red:hover,.bbtn-bt-red .x-btn-menu-active .x-btn-focus,.bbtn-bt-red.x-btn-focus {background-color: #c9302c !important;border-color: #ac2925 !important;background-image: none !important;outline: none!important;}.bbtn-bt-red.x-btn-pressed {background-color: #ac2925 !important;border-color: #761c19 !important;background-image: none !important;}.bbtn-bt-red:focus {background-color: #c9302c;border-color: #761c19;outline: none!important;}.bbtn-bt-blue .x-btn-wrap,.bbtn-bt-green .x-btn-wrap,.bbtn-bt-cyan .x-btn-wrap,.bbtn-bt-orange .x-btn-wrap,.bbtn-bt-red .x-btn-wrap {outline: none!important;}.bbtn-bt-blue .x-btn-inner,.bbtn-bt-green .x-btn-inner,.bbtn-bt-cyan .x-btn-inner,.bbtn-bt-orange .x-btn-inner,.bbtn-bt-red .x-btn-inner {color: #FFF !important;}bbtn-bt-blue （蓝色按钮）
bbtn-bt-green（绿色按钮）
bbtn-bt-cyan（青色按钮）
bbtn-bt-orange（橙色按钮）
bbtn-bt-red（红色按钮）
2.去掉虚线框
代码如下（示例）：
self.btn2.JSInterface.JSConfig('focusable', [false]);
3.使用IconFont样式
详细访问 IconFont
4.自定义Hint
设置Showhint=true;
代码如下（示例）：
UniSession.AddJS('setTimeout(''Ext.create("Ext.tip.ToolTip",{anchor:"top",anchorOffset:5,trackMouse:true,autoHide:true, ' + 'closable:false,draggable:false,target:"' + UniButton1.JSName + '_id",html:"' + hint + '",title:"提示"});'',1);');
uniGUI之UniButton相关推荐
- uniGUI之事项合集
目录 1.事件中的代码在服务器端和客户端,哪一端执行? 2.为什么UniGUI控件在IE中显示的字体会变小.模糊? 3.在浏览器端不能使用ShowMessage() 4.unigui程序只显示load ...
- 【一起学UniGUI】--UniGUI的窗体和模块(7)
(五).其他窗体(Other Forms) : 使用uniGUI创建新窗体向导允许创建三种窗体: 登录窗体 (Login Form 继承于TUniLoginForm) 应用程序窗体(Applicati ...
- unigui的页面布局使用
(unigui的页面布局还是很强大的,基本什么的排版都能搞好.前面部分为原文章翻译,翻译不一定很准确,就能看吧,后面有使用说明,有什么不明白的欢迎加我QQ(910300653)一起交流学习) 一.布局 ...
- Unigui 服务器解析php,如何正确使用uniGUI的HyperServer（负载均衡）功能
本文在介绍如何正确使用uniGUI的HyperServer(负载均衡)功能的基础上,重点探讨了其具体步骤,本文内容紧凑,希望大家可以有所收获. 1.HyperServer是uniGUI 1.5版本后新 ...
- uniGUI试用笔记（二）
前几天做的demo今天启动后,浏览器打开页面后死活不显示窗体,找了半天原因才发现是360浏览器启动了兼容模式,改成极速模式后就正常了.有点晕.... 今天简单测试了TUniGUIServerModul ...
- uniGUI试用笔记（十一）
最近研究了一下UniGUI的TuniDBGrid,记录一下免得忘记了. TuniDBGrid的重要属性包括: 1.列-TUniDBGridColumns和TUniDBGridColumn 每个列对象( ...
- uniGUI 实操感受
最近需要开发一个简单的WEB系统,用户数不多,数据量不大,且需要快速完成开发, 于是我决定采用UniGUI(http://www.unigui.com/),uniGUI完全基于ExtJS,全面支持Aj ...
- unigui中TUniDBEdit的OnEndDrag问题
非常奇怪,unigui中TUniDBEdit未发布OnEndDrag属性,包括其子类:TUniDBNumberEdit.TUniDBFormattedNumberEdit.而其他数据感知组件都有OnE ...
- uniGUI试用笔记（一）
uniGUI试用笔记(一) 通过向导创建一个uniGUI应用服务器,工程中有三个文件: TUniServerModule = class(TUniGUIServerModule)TUniMainMod ...
最新文章
- 【java】java开发中的23种设计模式详解
- vs2012常用快捷键总结
- SpringMVC解决跨域的两种方案
- mysql存储引擎简介
- picker封装 uniapp_uniapp自定义picker城市多级联动组件
- java quartz 2.2.3_java – Spring 3 Quartz 2错误
- 拉面说：如何成为速食拉面独角兽
- a20添加usb2net的驱动方法
- 【实践】微博推荐算法实践与机器学习平台演进.pdf（附PPT下载链接）
- linux 查看进程启动路径
- 浅谈ajax同步、异步的问题
- zip压缩大于4g文件linux,linux下解压大于4G文件提示error: Zip file too big错误的解决办法...
- 2017，那些引发关注的新建展馆
- Linux 下的分屏利器-tmux安装、原理及使用
- 【ros】初学ROS的学习笔记——创建Publisher
- 三角函数积分的换元法
- 有秒计时的数字时钟（10分）
- 紫外线传感器用于天然气燃烧火焰探测
- Microsoft Office 2016 和 Visio 2016 自定义安装的安装包 非即装即用版本
- 【应用安全】什么是联合身份管理？