滑动条
<p>滑块由CSlider类来代表，继承于CProgress，支持CProgress的所有属性和方法。通过给滑块设置不同的背景图片资源，可以得到各种形态的进度条。</p>
<h2>属性和相关方法</h2>
<h4>设置滑块的图像</h4>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">Thumb="SliderThumb.png"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">void SetThumb(const String& strThumb);</code></pre>
<h2>消息处理</h2>
<h4>WM_SLIDER_POS_CHANGE</h4>
<p>滑块位置发生变化时，会给所在窗口发送自定义消息WM_SLIDER_POS_CHANGE。</p>
<p>参考下面的示例代码：</p>
<pre><code class="language-cpp">void CSliderThumb::HandleMouseMove(CPoint point, UINT nFlags)
{
if(GetState() == PRESSED)
{
CSlider* pScrollSlider = dynamic_cast<CSlider*>(GetParent());
if(pScrollSlider)
{
CRect rcRange = pScrollSlider->GetRect();
LONG nWidth = GetRect().Width();
LONG nLeft = point.x - m_nLeftOffset;
LONG nRight = nLeft + nWidth;
if(nLeft < rcRange.left)
{
nLeft = rcRange.left;
}
else if(nRight > rcRange.right)
{
nLeft = rcRange.right - nWidth;
}
CSize szThumb = SkinUI::GetImageSize(GetBackgroundImage());
int64 nRange = pScrollSlider->GetRange();
int64 nPos = (nLeft - rcRange.left) * nRange / (rcRange.Width() - szThumb.cx);
if(nPos != pScrollSlider->GetPos())
{
pScrollSlider->SetPos(nPos);
pScrollSlider->SetRect(rcRange);
pScrollSlider->Redraw();
CSlider* pSlider = dynamic_cast<CSlider*>(GetParent());
if(pSlider)
{
GetOwner()->PostMessage(WM_SLIDER_POS_CHANGE, pScrollSlider->GetId(), reinterpret_cast<LPARAM>(pSlider));
}
}
}
}
}</code></pre>
<h2>请看下面的示例</h2>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/5.0/3/Slider.png" alt="滑块" /></p>
<h4>布局文件</h4>
<pre><code class="language-xml"><FlexLayout>
<TextView Width="MatchParent" Height="60" HorzAlign="Center" Text="IDS_CONTROL13_2" Font="ID_FONT_H4"/>
<Line Width="MatchParent" Height="1" Margin="0,0,0,20"/>
<RelativeLayout Width="MatchParent" Height="160">
<Slider Id="101" Height="21" AlignParentLeft="40" AlignParentRight="40" AlignParentTop="20" Range="100" Pos="0"/>
<Button Id="201" Width="WrapContent" Height="30" ChildText11="增加进度, Step=4" Background="Button.png" Layout="Button.xml" AlignParentHorzCenter="0" ToBottomOf="101,10"/>
<Slider Id="102" Height="21" AlignParentLeft="40" AlignParentRight="40" ToBottomOf="201,30" Range="100" Pos="0"/>
<Button Id="202" Width="WrapContent" Height="30" ChildText11="增加进度, Step=10" Background="Button.png" Layout="Button.xml" AlignParentHorzCenter="0" ToBottomOf="102,10"/>
</RelativeLayout>
</FlexLayout></code></pre>
<h4>h文件</h4>
<pre><code class="language-cpp">#pragma once
class CDemoSliderLayout : public CScrollLayout
{
public:
enum
{
IDC_SLIDER1 = 101,
IDC_BUTTON1 = 201,
IDC_SLIDER2 = 102,
IDC_BUTTON2 = 202,
};
public:
CDemoSliderLayout(CView* pParent);
public:
virtual void OnBuildFinish();
protected:
void OnBtnClickedAddPosByStep4(UINT uNotifyCode, int nID, CView* pView);
void OnBtnClickedAddPosByStep10(UINT uNotifyCode, int nID, CView* pView);
SKINUI_DECLARE_MESSAGE_MAP()
private:
CSlider* m_pSlider1;
CSlider* m_pSlider2;
SKINUI_DECLARE_DYNCREATE(CDemoSliderLayout, CScrollLayout)
};</code></pre>
<h4>cpp文件</h4>
<pre><code class="language-cpp">#include <stdafx.h>
#include "DemoSliderLayout.h"
SKINUI_BEGIN_MESSAGE_MAP(CDemoSliderLayout, CScrollLayout)
ON_SKINUI_COMMAND(IDC_BUTTON1, OnBtnClickedAddPosByStep4)
ON_SKINUI_COMMAND(IDC_BUTTON2, OnBtnClickedAddPosByStep10)
SKINUI_END_MESSAGE_MAP()
CDemoSliderLayout::CDemoSliderLayout(CView* pParent)
: CScrollLayout(pParent)
, m_pSlider1(NULL)
, m_pSlider2(NULL)
{
}
void CDemoSliderLayout::OnBuildFinish()
{
CScrollLayout::OnBuildFinish();
m_pSlider1 = dynamic_cast<CSlider*>(GetChildById(IDC_SLIDER1));
m_pSlider2 = dynamic_cast<CSlider*>(GetChildById(IDC_SLIDER2));
}
void CDemoSliderLayout::OnBtnClickedAddPosByStep4(UINT uNotifyCode, int nID, CView* pView)
{
if(m_pSlider1)
{
m_pSlider1->SetPos(min(m_pSlider1->GetPos() + 4, m_pSlider1->GetRange()));
m_pSlider1->Redraw();
}
}
void CDemoSliderLayout::OnBtnClickedAddPosByStep10(UINT uNotifyCode, int nID, CView* pView)
{
if(m_pSlider2)
{
m_pSlider2->SetPos(min(m_pSlider2->GetPos() + 10, m_pSlider2->GetRange()));
m_pSlider2->Redraw();
}
}</code></pre>