滑块控件 (SSliderBar)¶

Warning

The current page still doesn't have a translation for this language.

You can read it through google translate.

滑块是一种可以通过拖动来调节数值的控件，常用于音量控制、亮度调节等场景。支持水平和垂直两种方向。

基本信息¶

类名：SSliderBar
控件标签：sliderbar
基类：SProgress
功能：提供可拖动的数值调节

属性说明¶

基本属性¶

属性名	类型	默认值	说明
value	int	0	当前值
min	int	0	最小值
max	int	100	最大值
vertical	bool	0	是否垂直显示（0-水平，1-垂直）
thumbInRail	bool	0	是否限制滑块在轨道内（0-不限制，1-限制）

外观属性¶

属性名	类型	默认值	说明
thumbSkin	string	-	滑块皮肤
bkgndSkin	string	-	背景皮肤
posSkin	string	-	数值显示皮肤

使用示例¶

基本滑块¶

<sliderbar name="sliderBasic" 
           pos="10,10,210,30" 
           value="50"
           min="0"
           max="100"/>

垂直滑块¶

<sliderbar name="sliderVertical" 
           pos="10,50,30,200" 
           vertical="1" 
           value="75"/>

限制滑块范围的滑块¶

<sliderbar name="sliderRail" 
           pos="10,210,210,230" 
           value="30"
           thumbInRail="1"/>

自定义皮肤的滑块¶

<sliderbar name="sliderStyled" 
           pos="10,240,210,260" 
           value="60"
           thumbSkin="skin_slider_thumb"
           bkgndSkin="skin_slider_bkgnd"
           posSkin="skin_slider_pos"/>

事件处理¶

滑块控件支持以下事件：

事件名	EventID	说明
EVT_SLIDER_POS	EventSliderPos::EventID	滑块位置变化事件

// 事件处理示例
EVENT_MAP_BEGIN()
    EVENT_NAME_HANDLER(L"sliderBasic", EventSliderPos::EventID, OnSliderPosChanged)
EVENT_MAP_END()

void OnSliderPosChanged(IEvtArgs *pEvt)
{
    EventSliderPos *pRealEvt = sobj_cast<EventSliderPos>(pEvt);
    int nPos = pRealEvt->nPos;
    // 处理滑块位置变化
}

数值控制¶

代码操作¶

// 查找滑块控件
SSliderBar *pSlider = FindChildByName2<SSliderBar>(L"sliderBasic");

// 设置当前值
pSlider->SetValue(75);

// 获取当前值
int nValue = pSlider->GetValue();

// 设置范围
pSlider->SetRange(0, 200);

// 获取范围
int nMin, nMax;
pSlider->GetRange(&nMin, &nMax);

样式定制¶

基本样式¶

<style>
    <class name="sliderStyle"
           bkgndSkin="slider_bg"
           channelSkin="slider_channel"
           thumbSkin="slider_thumb"
           showTip="1"/>
</style>

<sliderbar class="sliderStyle"
           value="50"/>

自定义提示¶

<sliderbar tipFormat="Level: %d"
           showTip="1"/>

最佳实践¶

合理设置范围：根据实际需要设置合适的 min 和 max 值
视觉反馈：通过不同皮肤区分滑块的不同状态
交互体验：使用 thumbInRail 属性控制滑块移动范围
方向选择：根据界面布局选择合适的 vertical 方向

常见问题¶

拖动不流畅¶

检查步进值设置
确认事件处理逻辑
验证性能瓶颈

滑块皮肤显示异常怎么办？¶

A: 检查 thumbSkin、bkgndSkin 和 posSkin 是否正确设置。