uniGUI之UniButton
2024-06-30 07:54:12
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 ...
最新文章
- [leetcode] 230. Kth Smallest Element in a BST 找出二叉搜索树中的第k小的元素
- 从零开始学习python:demo2.3
- Heka：Go编写，来自Mozilla，高效、灵活的插件式数据挖掘工具（转）
- [转载]工作面试时最难的25个问题
- python实战讲解_Python数据可视化实战讲解
- php-rpm.conf,在新安装的宝塔面板中php无法启动起来
- java设计模式之——代理模式
- access 数据库目录权限只读引起asp的访问错误
- leveldb学习：DBimpl
- THAAD反导必将部署，各方已接受事实
- fenix3 hr 中文说明书_佳明 Fenix3 HR中、英文菜单对照 V4.0
- 锁定明细表格的某一行数据（不允许修改）
- 最近大火的chatGPT是什么？它是怎样聊天的？
- 2023年谷歌外链购买最全攻略
- Metricbeat入门案例
- html不同板块点击切换,板块快速切换的操作策略
- 软件测试参数化的作用,Pytest之测试的参数化
- spreadjs导出学习总结
- 在CentOS7上安装RabbitMQ
- Python中的True和False详解