QT滾動數字 滾動選擇器 滑動選擇器

最近在做個小軟體，用到定時提醒功能，定時選擇時間的時候我想到了錘子手機的鬧鐘設定介面，當然這種數字滾動選擇器也是很常見啦，類似下面的效果

參考了　

這個大佬的的demo是橫向的，單個數字，數字左右移動切換

還有　這個大佬的效果也是一條數字框，上下切換

借鑑了他們兩個的**，我做了個時鐘選擇器，效果是這樣的

主要思路是先實現一條數字選擇器，然後把他提公升為乙個類，管他叫timeselect；用的時候new兩個timeselect類，new的時候可以把兩個類的父類填成我們想要他顯示的視窗。

**挺多的，我不全貼啦，貼出最主要的，也就是滾動選擇器的**，基本上我都一一注釋了

selectime.h

#ifndef selecttime_h

#define selecttime_h
#include
#include
#include
#include
namespace ui 
class
selecttime
:public qwidget
;#endif
// selecttime_h

#include

"selecttime.h"
#include
"ui_selecttime.h"
#include
selecttime::
selecttime
(qwidget *parent)
:qwidget
(parent)
,m_minrange(1
),m_maxrange(24
),m_currentvalue(16
),isdragging(0
),m_deviation(0
),m_numsize(6
),ismiddle(0
),ui(
new ui::selecttime)
selecttime::
~selecttime()
//設定範圍
void selecttime::
setrange
(int min,
int max)
repaint()
;//重繪此元件，需要進行重繪時,要使用repaint
}//獲取當前值
int selecttime::
readvalue()
//滑鼠按下事件
void selecttime::
mousepressevent
(qmouseevent *e)
//滑鼠移動事件
void selecttime::
mousemoveevent
(qmouseevent *e)
}//滑鼠鬆開事件
void selecttime::
mousereleaseevent
(qmouseevent *)}
//繪圖事件
void selecttime::
paintevent
(qpaintevent *)if
(m_deviation <=
-height/
5&& m_currentvalue < m_maxrange)
//同理，數字加一
//中間數字
paintnum
(painter,m_currentvalue,m_deviation,ismiddle=1)
;//將選中數字畫到中間
//兩側數字1
if(m_currentvalue != m_minrange)
//選中的數字不是最小，不是最大，那麼就有兩側數字，然後畫出兩側數字
paintnum
(painter,m_currentvalue-
1,m_deviation-height*2/
10,ismiddle=0)
;if(m_currentvalue != m_maxrange)
paintnum
(painter,m_currentvalue+
1,m_deviation+height*2/
10,ismiddle=0)
;//兩側數字2,超出則不顯示
if(m_deviation >=
0&& m_currentvalue-
2>= m_minrange)
paintnum
(painter,m_currentvalue-
2,m_deviation-height*4/
10,ismiddle=0)
;if(m_deviation <=
0&& m_currentvalue+
2<= m_maxrange)
paintnum
(painter,m_currentvalue+
2,m_deviation+height*4/
10,ismiddle=0)
;//畫邊框，中間數字兩側的邊框
painter.
setpen
(qpen
(qcolor(0
,0,0
,120),
2));
painter.
drawline(0
,height/8*
3,width,height/8*
3); painter.
drawline(0
,height/8*
5,width,height/8*
5);}
//畫數字函式
void selecttime::
paintnum
(qpainter &painter,
int num,
int deviation,
bool ismiddle)
else
painter.
drawtext
(qrectf(0
,y,width,height)
,//畫文字，引數：qrectf引數：位置xy，長寬大小；對齊方式，左對齊；內容
qt::aligncenter,
qstring::
number
(num));
}//使選中的數字回到螢幕中間
void selecttime::
homing()
else
if(m_deviation >-(
height()
)/20)
else
if(m_deviation 
height()
)/20)
emit currentvaluechanged
(m_currentvalue)
;//傳送當前數值改變訊號
homingani-
>
start()
;//開始動畫
}//獲取滑鼠移動偏移量
int selecttime::
readdeviation()
//設定偏移量
void selecttime::
setdeviation
(int n)

QT 自製控制項 滾動選擇器

因為我需要有連續的數字以供選擇，所以只記了數字範圍。如有需求可以改為用任意線性容器保持資料 self contained.h ifndef selfcontained h define selfcontained h include include include include endif sel...

CSS HTML滾動效果，滾動選擇器

之前看到乙個案例是乙個滾動的效果，是用css和html寫的乙個滾動選擇器，主要是用了css裡面的scroll snap type和scroll snap align他們有不同的引數可以實現不同的效果，小白不太熟悉，需要的話可以去看文件，下面是效果圖 這個是實現的方法，但是那個案例並沒有說如何獲取當前...

css滾動條設定（選擇器）

webkit scrollbar 整個滾動條.webkit scrollbar button 滾動條上的按鈕 上下箭頭 webkit scrollbar thumb 滾動條上的滾動滑塊.webkit scrollbar track 滾動條軌道.webkit scrollbar track piece...