自定义实现复选框

项目中需要用到复选框,而QComboBox只能实现单选操作。即使是加以改造可以多选,也只能一次选择一个选项,不符合项目需求。于是就花了两天时间来自己实现一个可行的复选框。

实现方案:QLineEdit + QListView + QPushButton

第一步是实现类似于QComboBox的显示框。

一个只读的QLineEdit + QPushButton就可以实现。这个QPushButton对象的父指针必须是QLineEdit,这样按钮才能浮在QLineEdit上。

需要根据实现界面大小计算按钮的起始位置。

第二步实现下拉框。

QListView + QStandardItemModel 框架可以简单的实现这个复选功能。底部还添加两个按钮:确定和取消。用于选择完之后的操作。

需要注意的是要设置这个窗体的属性   setWindowFlags(Qt::Popup);

这个属性可以确保在下拉列表失去焦点时,会触发隐藏操作(hide)

第三步是把前两个实现的控件变成一个整体。第二个控件不能设父指针,它不属于界面任何部分。

代码的实现还是很简单的。

具体的你可以参考 GitHub 上的实现,在MyMulitComboBox有完整的实现代码。

原文地址:https://www.cnblogs.com/zhugaopeng/p/8270817.html

时间: 2024-08-30 14:45:37

自定义实现复选框的相关文章

基于CSS3自定义美化复选框Checkbox组合

今天我们要来分享一组非常漂亮的CSS3自定义复选框checkbox,每一个checkbox都有其各自的特点.有几款checkbox在选中的情况下还会出现动画效果,非常不错的CSS3自定义美化checkbox组合.另外,之前分享过的jQuery实现美化版的单选框和复选框也是非常不错. 在线预览   源码下载 实现的代码: <div class="container"> <div class="holder"> <div class=&qu

js自定义修改复选框单选框样式,清除复选框单选框默认样式

之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认样式进行修改,但发现,并没有可以重置效果的方法,之前用过-webkit-appearance的方法,但是这个只在webkit内核的浏览器里面生效,火狐不生效. 所以自己写了个js,用li来模拟复选框和单选框的效果,很简单,7行就行. 效果图:  涉及到的知识点:自定义属性来存储点击状态和原来的class名 h

Asp.net自定义单选复选框控件

将常用的jquery插件封装成控件也是个不错的选择 下面是效果的简单颜色,由于博客系统的限制没法完整演示最终效果,请下载示例查看 Asp.netWeb APIC#Javascript 1.新建类库项目,创建数据源类 [Serializable] public class Select2Item { public bool Selected { get; set; } public string Text { get; set; } public string Value { get; set;

8个非常个性化的CSS3单/复选框

单选框和复选框在网页表单中应用十分广泛,但是浏览器默认自带的单选框和复选框样式不仅不统一,而且大多都比较简单丑陋.本文给大家介绍了一些基于CSS3的个性化单选框和复选框,一些选中动画是基于jQuery的,你可以挑选喜欢的单选框和复选框应用到自己的网页中去,非常方便. 1.jQuery超级个性化的单线框和复选框 今天要分享的也是一个非常个性化的单选框和复选框插件,颜色你可以自己定义. 在线演示 源码下载 2.CSS3漂亮的自定义Checkbox复选框 9款迷人样式 今天我们来分享一款9款样式迷人的

不用系统自带的复选框,单选按钮,选择框的样式,该怎么做

这里我主要针对pc端而言,移动端由于各个牌子的移动设备都有自己定义的复选框,单选按钮和选择框样式,这里不做讨论. pc端的默认样式大家都见过,这里直接上效果图 这是我简单做的两个自定义的复选框,单选按钮.以复选框为例,将复选框用一个div包裹起来,然后将复选框的透明度设置为0,下面来看看这个效果的代码 <style> .checks_icon{border: 1px solid red;border: 1px solid #ccc;padding: 0;height: 12px; width:

[CSS揭秘]自定义单选框和复选框

很多Web前端工程师肯定都会遇到过,在项目中,UI设计师跑来跟你说,我这个地方的表单控件需要设计成这个样子那个样子.但是用CSS却不能够修改这些控件的默认样式,于是乎,只能通过div+javascript技术来进行模拟.特别是在如今移动端的崛起时代,更加注重用户的体验.于是就更加需要这样一种hack技术. 如果对如今的前端框架有过了解,都会知道组件这个概念.那么在这些框架中,都会提供一些单选框或复选框按钮组件.可见大家之前受到表单元素的默认样式的毒害有多深. 今天先给大家简单介绍一下如何通过CS

Jquery操作下拉列表和复选框,自定义下拉

后半部分还有自定义下拉列表和开灯关灯的效果,可以进来来看一下 哦 如果网页有下拉列表和复选框,看一下Jquery怎么来操作他们,主要怎么来选取他们的数据,怎么设置某一项选中 先来看个下拉列表 <body> <select id="sel"> <option value="张店">张店</option> <option value="淄川">淄川</option> <op

自定义复选框样式及全选操作

自定义复选框样式 复选框结构 input框去其样式宽高为0;定位到父盒子内,我们需用其:checked 属性 下面的span为自定义样式,定位到父盒子内 . 效果展示 js 代码 模拟复选框样式 $(".ck_MN").click(function(){ var ck_Inp = $(this).siblings(".ckIpt"); var Ck_box = $(this).parents(".Ckbox"); if(ck_Inp.prop(&

Smarty中的自定义函数(二)复选框、下拉列表、单选框

接Smarty中的自定义函数(一) 7.html_checkboxes 复选框 [php] view plain copy print? $ssss1 = array(2,3,4); $ssss2 = array('学习','工作','生活'); $ssss3 = array(2,4); $smarty->assign('ssss1',$ssss1); $smarty->assign('ssss2',$ssss2); $smarty->assign('ssss3',$ssss3); $s