3.16 列表
<h2>1 滚动视图</h2>
<p>滚动视图由CSkinScrollView类来代表，继承于CSkinView，支持CSkinView的所有属性和方法。</p>
<p>CSkinScrollView是抽象类，是所有可滚动视图的基类。</p>
<h4>1.1 设置垂直滚动条</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">VScrollBar=&quot;VScrollBar.xml&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetVertScrollBar(const tstring&amp; strLayout);</code></pre></li>
</ul>
<h4>1.2 设置动画滚动</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">AnimationScroll=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">virtual void SetAnimationScroll(BOOL bAnimationScroll);</code></pre></li>
</ul>
<h2>2 列表Item</h2>
<p>列表Item由CSkinListItem类代表，继承于CSkinRelativeLayout，支持CSkinRelativeLayout的所有属性和方法。</p>
<p>插入列表的节点必须是CSkinListItem或其子类。</p>
<h4>2.1 设置鼠标按下时是否允许移动窗口</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">AllowMoveWindow=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetAllowMoveWindow(BOOL bAllow);</code></pre></li>
</ul>
<h4>2.2 设置鼠标移上去时的颜色</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">ColorMouseOver=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetColorMouseOver(const tstring&amp; strBkgColor);</code></pre></li>
</ul>
<h4>2.3 设置列表鼠标按下时的颜色</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">ColorChecked=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetColorChecked(const tstring&amp; strBkgColor);</code></pre></li>
</ul>
<h4>2.4 设置延迟加载</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">LazyLoad=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetLazyLoad(BOOL bLazyLoad);</code></pre></li>
</ul>
<h2>3 列表</h2>
<p>列表由CSkinListView类代表，继承于CSkinScrollView，支持CSkinScrollView的所有属性和方法。</p>
<h4>3.1 设置列表是否允许通过接口【GetChildById】获取子组件</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">AllowGetChild=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetAllowGetChild(BOOL bAllow);</code></pre></li>
</ul>
<h4>3.2 设置列表是否允许选中Item</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">AllowCheckItem=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetAllowCheckItem(BOOL bAllow);</code></pre></li>
</ul>
<h4>3.3 设置列表为空时的提示图片</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">EmptyImage=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetEmptyImage(const tstring&amp; strEmptyImage);</code></pre></li>
</ul>
<h4>3.4 设置列表是否允许选中Item</h4>
<ul>
<li>通过XML属性控制如下：
<pre><code class="language-xml">EmptyTips=&quot;true&quot;</code></pre></li>
<li>通过C++程序代码调用方法控制如下：
<pre><code class="language-c">void SetEmptyTips(const tstring&amp; strEmptyTips);</code></pre></li>
</ul>
<h2>请看下面的示例</h2>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/3/16/1.png" alt="列表控件" /></p>
<h4>布局文件</h4>
<pre><code class="language-xml">&lt;SkinDialog DefaultWidth=&quot;445&quot; DefaultHeight=&quot;300&quot; SysButton=&quot;CLOSE&quot; Icon=&quot;128&quot; Caption=&quot;IDS_CONTROL_SHOW16&quot; Animation=&quot;SizeChange&quot;&gt;
&lt;SkinRelativeLayout LayoutWidth=&quot;150&quot; AlignParentLeft=&quot;15&quot; AlignParentTop=&quot;45&quot; AlignParentBottom=&quot;60&quot; BkgColor=&quot;ID_COLOR_WHITE&quot; Border=&quot;ID_COLOR_LINE&quot;&gt;
&lt;SkinListView Id=&quot;101&quot; AlignParentLeft=&quot;2&quot; AlignParentRight=&quot;2&quot; AlignParentTop=&quot;2&quot; AlignParentBottom=&quot;2&quot; VScrollBar=&quot;VScrollBar.xml&quot;&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;ListItem.xml&quot; ChildText1=&quot;SkinListItem1&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;ListItem.xml&quot; ChildText1=&quot;SkinListItem2&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;ListItem.xml&quot; ChildText1=&quot;SkinListItem3&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;ListItem.xml&quot; ChildText1=&quot;SkinListItem4&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;ListItem.xml&quot; ChildText1=&quot;SkinListItem5&quot;/&gt;
&lt;/SkinListView&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout LayoutWidth=&quot;250&quot; AlignParentRight=&quot;15&quot; AlignParentTop=&quot;45&quot; AlignParentBottom=&quot;60&quot; BkgColor=&quot;ID_COLOR_WHITE&quot; Border=&quot;ID_COLOR_LINE&quot;&gt;
&lt;SkinListView Id=&quot;102&quot; AlignParentLeft=&quot;2&quot; AlignParentRight=&quot;2&quot; AlignParentTop=&quot;2&quot; AlignParentBottom=&quot;2&quot; VScrollBar=&quot;VScrollBar.xml&quot;&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;UserListItem.xml&quot; ChildImage1=&quot;Male.png&quot; ChildText2=&quot;姓名1&quot; ChildText3=&quot;男&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;UserListItem.xml&quot; ChildImage1=&quot;Female.png&quot; ChildText2=&quot;姓名2&quot; ChildText3=&quot;女&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;UserListItem.xml&quot; ChildImage1=&quot;Male.png&quot; ChildText2=&quot;姓名3&quot; ChildText3=&quot;男&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;UserListItem.xml&quot; ChildImage1=&quot;Female.png&quot; ChildText2=&quot;姓名4&quot; ChildText3=&quot;男&quot;/&gt;
&lt;SkinListItem LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;30&quot; Image=&quot;ListItem.png&quot; Layout=&quot;UserListItem.xml&quot; ChildImage1=&quot;Male.png&quot; ChildText2=&quot;姓名5&quot; ChildText3=&quot;女&quot;/&gt;
&lt;/SkinListView&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinButton Id=&quot;201&quot; LayoutWidth=&quot;150&quot; LayoutHeight=&quot;30&quot; ChildText1=&quot;添加节点&quot; Image=&quot;Button.png&quot; Layout=&quot;Button.xml&quot; AlignParentLeft=&quot;15&quot; AlignParentBottom=&quot;15&quot; PressDownOffset=&quot;1&quot;/&gt;
&lt;SkinButton Id=&quot;202&quot; LayoutWidth=&quot;250&quot; LayoutHeight=&quot;30&quot; ChildText1=&quot;添加节点&quot; Image=&quot;Button.png&quot; Layout=&quot;Button.xml&quot; AlignParentRight=&quot;15&quot; AlignParentBottom=&quot;15&quot; PressDownOffset=&quot;1&quot;/&gt;
&lt;/SkinDialog&gt;</code></pre>
<h4>h文件</h4>
<pre><code class="language-cpp">#pragma once
class CListViewDialog : public CSkinDialog
{
public:
enum
{
IDC_LISTVIEW1 = 101,
IDC_LISTVIEW2 = 102,
IDC_BUTTON1 = 201,
IDC_BUTTON2 = 202,
};
public:
CListViewDialog(const tstring&amp; strXml);
public:
virtual void OnInitDialog();
protected:
void OnBtnClickedAddItem1(UINT uNotifyCode, int nID, CSkinView* pView);
void OnBtnClickedAddItem2(UINT uNotifyCode, int nID, CSkinView* pView);
SKINUI_DECLARE_MESSAGE_MAP()
private:
CSkinListView* m_pListView1;
CSkinListView* m_pListView2;
};</code></pre>
<h4>cpp文件</h4>
<pre><code class="language-cpp">#include &quot;stdafx.h&quot;
#include &quot;ListViewDialog.h&quot;
SKINUI_BEGIN_MESSAGE_MAP(CListViewDialog, CSkinDialog)
ON_SKINUI_COMMAND(IDC_BUTTON1, OnBtnClickedAddItem1)
ON_SKINUI_COMMAND(IDC_BUTTON2, OnBtnClickedAddItem2)
SKINUI_END_MESSAGE_MAP()
CListViewDialog::CListViewDialog(const tstring&amp; strXml)
: CSkinDialog(strXml)
, m_pListView1(NULL)
, m_pListView2(NULL)
{
}
void CListViewDialog::OnInitDialog()
{
CSkinDialog::OnInitDialog();
m_pListView1 = static_cast&lt;CSkinListView*&gt;(GetChildById(IDC_LISTVIEW1));
m_pListView2 = static_cast&lt;CSkinListView*&gt;(GetChildById(IDC_LISTVIEW2));
}
static int nIndex1 = 6;
void CListViewDialog::OnBtnClickedAddItem1(UINT uNotifyCode, int nID, CSkinView* pView)
{
if(m_pListView1)
{
CSkinListItem* pListItem = new CSkinListItem(m_pListView1);
if(pListItem)
{
pListItem-&gt;SetLayoutHeight(30);
pListItem-&gt;SetImage(_T(&quot;ListItem.png&quot;));
pListItem-&gt;SetLayout(_T(&quot;ListItem.xml&quot;));
pListItem-&gt;SetChildText(100001, _T(&quot;SkinListItem&quot;) + SkinUI::IntToString(nIndex1++));
}
m_pListView1-&gt;ResetScrollInfo();
m_pListView1-&gt;ScrollBottom();
m_pListView1-&gt;RedrawView();
}
}
static int nIndex2 = 6;
static BOOL bMale = FALSE;
void CListViewDialog::OnBtnClickedAddItem2(UINT uNotifyCode, int nID, CSkinView* pView)
{
if(m_pListView2)
{
CSkinListItem* pListItem = new CSkinListItem(m_pListView2);
if(pListItem)
{
pListItem-&gt;SetLayoutHeight(30);
pListItem-&gt;SetImage(_T(&quot;ListItem.png&quot;));
pListItem-&gt;SetLayout(_T(&quot;UserListItem.xml&quot;));
pListItem-&gt;SetChildImage(100001, bMale ? _T(&quot;Male.png&quot;) : _T(&quot;Female.png&quot;));
pListItem-&gt;SetChildText(100002, _T(&quot;姓名&quot;) + SkinUI::IntToString(nIndex2++));
pListItem-&gt;SetChildText(100003, bMale ? _T(&quot;男&quot;) : _T(&quot;女&quot;));
bMale = !bMale;
}
m_pListView2-&gt;ResetScrollInfo();
m_pListView2-&gt;ScrollBottom();
m_pListView2-&gt;RedrawView();
}
}</code></pre>