9 第六组UI组件：列表、树、网格和浏览器

9.1 列表Item

列表Item由CSkinListItem类代表，继承于CSkinRelativeLayout，支持CSkinRelativeLayout的所有属性和方法。插入列表的节点必须是CSkinListItem或其子类。

下面是CSkinListItem类特有的XML属性和相关方法：

9.1.1设置鼠标按下时是否允许移动窗口

  • 通过XML属性控制如下：
AllowMoveWindow="true"
  • 通过C++程序代码调用方法控制如下：
void SetAllowMoveWindow(BOOL bAllow);

9.1.2设置鼠标移上去时的颜色

  • 通过XML属性控制如下：
ColorMouseOver="true"
  • 通过C++程序代码调用方法控制如下：
void SetColorMouseOver(const tstring& strBkgColor);

9.1.3设置列表鼠标按下时的颜色

  • 通过XML属性控制如下：
ColorChecked="true"
  • 通过C++程序代码调用方法控制如下：
void SetColorChecked(const tstring& strBkgColor);

9.1.4设置延迟加载

  • 通过XML属性控制如下：
LazyLoad="true"
  • 通过C++程序代码调用方法控制如下：
void SetLazyLoad(BOOL bLazyLoad);

9.2 列表

列表由CSkinListView类代表，继承于CSkinScrollView，支持CSkinScrollView的所有属性和方法。

列表

布局文件如下：

<SkinDialog DefaultWidth="500" DefaultHeight="300" SysButton="CLOSE" Icon="128" Caption="IDS_CONTROL_SHOW11" Animation="SizeChange">
    <SkinRelativeLayout AlignParentLeft="15" AlignParentRight="15" AlignParentTop="35" AlignParentBottom="15" BkgColor="ID_COLOR_WHITE" Border="ID_COLOR_LINE">
        <SkinListView AlignParentLeft="1" AlignParentRight="1" AlignParentTop="1" AlignParentBottom="1" VScrollBar="VScrollBar.xml">
            <SkinListItem LayoutWidth="FillParent" LayoutHeight="30" Image="ListItem.png">
                <SkinRelativeLayout LayoutWidth="FillParent" LayoutHeight="FillParent">
                    <SkinTextView AlignParentLeft="15" AlignParentRight="15" AlignParentVerticalCenter="0" Text="IDS_CONTROL_SHOW_TEXT12"/>
                </SkinRelativeLayout>
            </SkinListItem>
            <SkinListItem LayoutWidth="FillParent" LayoutHeight="30" Image="ListItem.png">
                <SkinRelativeLayout LayoutWidth="FillParent" LayoutHeight="FillParent">
                    <SkinTextView AlignParentLeft="15" AlignParentRight="15" AlignParentVerticalCenter="0" Text="IDS_CONTROL_SHOW_TEXT12"/>
                </SkinRelativeLayout>
            </SkinListItem>
        </SkinListView>
    </SkinRelativeLayout>
</SkinDialog>

列表控件的节点可以直接在配置文件指定，如上xml文件所示。
也可以由代码生成后再加入列表，如下所示：

CSkinListItem* pListItem = new CSkinListItem(pSkinListView);
if(pListItem)
{
    pListItem->SetImage(_T("ListItem.png"));
    pListItem->SetLayout(_T("ListItem.xml"));
    pListItem->SetLayoutHeight(30);
}

下面是CSkinListView类特有的XML属性和相关方法：

9.2.1设置列表是否允许通过接口【GetChildById】获取子组件

  • 通过XML属性控制如下：
AllowGetChild="true"
  • 通过C++程序代码调用方法控制如下：
void SetAllowGetChild(BOOL bAllow);

9.2.2设置列表是否允许选中Item

  • 通过XML属性控制如下：
AllowCheckItem="true"
  • 通过C++程序代码调用方法控制如下：
void SetAllowCheckItem(BOOL bAllow);

9.2.3设置列表为空时的提示图片

  • 通过XML属性控制如下：
EmptyImage="true"
  • 通过C++程序代码调用方法控制如下：
void SetEmptyImage(const tstring& strEmptyImage);

9.2.4设置列表是否允许选中Item

  • 通过XML属性控制如下：
EmptyTips="true"
  • 通过C++程序代码调用方法控制如下：
void SetEmptyTips(const tstring& strEmptyTips);

9.3 树控件

树控件由CSkinTreeView类来代表，继承于CSkinListView，支持CSkinListView的所有属性和方法。

树控件

布局文件如下：

<SkinDialog DefaultWidth="400" DefaultHeight="300" SysButton="CLOSE" Icon="128" Caption="IDS_CONTROL_SHOW12" Animation="SizeChange">
    <SkinRelativeLayout AlignParentLeft="15" AlignParentRight="15" AlignParentTop="35" AlignParentBottom="15" BkgColor="ID_COLOR_WHITE" Border="ID_COLOR_LINE">
        <SkinTreeView Id="101" AlignParentLeft="1" AlignParentRight="1" AlignParentTop="1" AlignParentBottom="1" VScrollBar="VScrollBar.xml">
        </SkinTreeView>
    </SkinRelativeLayout>
</SkinDialog>

树控件的节点必须由代码插入，代码如下：

void CTreeDialog::OnInitDialog()
{
    CSkinDialog::OnInitDialog();
    CSkinTreeView* pTreeView = static_cast<CSkinTreeView*>(GetChildById(IDC_TREEVIEW));
    if(pTreeView)
    {
        for(int64 i = 0; i < 10; ++i)
        {
            CSkinTreeItem* pRootItem = new CSkinTreeItem(pTreeView);
            if(pRootItem)
            {
                pRootItem->SetLazyLoad(TRUE);
                pRootItem->SetLayoutHeight(30);
                pRootItem->SetLayout(_T("TreeItem.xml"));
                pRootItem->SetImage(_T("ListItem.png"));
                pTreeView->InsertItem(NULL, pRootItem);

                for(int64 j = 0; j < 10; ++j)
                {
                    CSkinTreeItem* pTreeItem = new CSkinTreeItem(pTreeView);
                    if(pTreeItem)
                    {
                        pTreeItem->SetLazyLoad(TRUE);
                        pTreeItem->SetLayoutHeight(30);
                        pTreeItem->SetLayout(_T("TreeItem.xml"));
                        pTreeItem->SetImage(_T("ListItem.png"));
                        pTreeView->InsertItem(pRootItem, pTreeItem);

                        for(int64 k = 0; k < 10; ++k)
                        {
                            CSkinListItem* pListItem = new CSkinListItem(pTreeView);
                            if(pListItem)
                            {
                                pListItem->SetLazyLoad(TRUE);
                                pListItem->SetLayoutHeight(30);
                                pListItem->SetLayout(_T("ListItem.xml"));
                                pListItem->SetImage(_T("ListItem.png"));
                                pTreeView->InsertItem(pTreeItem, pListItem);
                            }
                        }
                    }
                }
            }
        }
        pTreeView->ResetSortedItem();
    }
}

下面是CSkinTreeView类特有的方法：

9.3.1插入子树节点

  • 通过C++程序代码调用方法控制如下：
void InsertItem(CSkinTreeItem* pParentItem, CSkinTreeItem* pItem);

9.3.2插入叶子节点

  • 通过C++程序代码调用方法控制如下：
void InsertItem(CSkinTreeItem* pParentItem, CSkinListItem* pItem);

9.3.3展开树节点

  • 通过C++程序代码调用方法控制如下：
void ExpandItem(CSkinTreeItem* pItem, BOOL bExpand);

9.3.4移除树节点

  • 通过C++程序代码调用方法控制如下：
void RemoveItem(CSkinTreeItem* pParentItem, CSkinListItem* pItem);

9.3.5删除树节点

  • 通过C++程序代码调用方法控制如下：
void DeleteItem(CSkinTreeItem* pParentItem, CSkinListItem* pItem);

9.3.6删除所有树节点

  • 通过C++程序代码调用方法控制如下：
void DeleteAllItem();

9.4 网格控件

网格控件由CSkinGridView类来代表，继承于CSkinListView，支持CSkinListView的所有属性和方法。

网格控件

网格控件跟列表控件非常相似，节点可以直接在配置文件指定，如上xml文件所示。
也可以直接由代码插入网格控件，如下所示：

CSkinListItem* pListItem = new CSkinListItem(pSkinGridView);
if(pListItem)
{
    pListItem->SetImage(_T("ListItem.png"));
    pListItem->SetLayout(_T("ListItem.xml"));
    pListItem->SetLayoutHeight(30);
}

下面是CSkinListView类特有的XML属性和相关方法：

9.4.1设置单元格大小

  • 通过XML属性控制如下：
CellSize="100,100"
  • 通过C++程序代码调用方法控制如下：
void SetCellSize(const CSize& size);

9.4.1设置单元格间距

  • 通过XML属性控制如下：
MarginSize="10,10"
  • 通过C++程序代码调用方法控制如下：
void SetMarginSize(const CSize& size);

9.4.1设置列数

  • 通过XML属性控制如下：
ColumnCount="5"
  • 通过C++程序代码调用方法控制如下：
void SetColumnCount(LONG nColumnCount);

9.5 IE浏览器控件

IE浏览器控件由CSkinWebView类来代表，继承于CSkinWndView，支持CSkinWndView的所有属性和方法。

IE浏览器控件

布局文件如下：

<SkinDialog DefaultWidth="800" DefaultHeight="600" SysButton="CLOSE" Icon="128" Caption="IDS_CONTROL_SHOW18" Animation="SizeChange">
    <SkinWebView AlignParentLeft="0" AlignParentRight="0" AlignParentTop="32" AlignParentBottom="0" URL="www.baidu.com"/>
</SkinDialog>

下面是CSkinWebView类特有的XML属性和相关方法：

9.5.1设置URL

  • 通过XML属性控制如下：
URL="www.baidu.com"
  • 通过C++程序代码调用方法控制如下：
void LoadURL(const tstring& strURL);

9.6 Cef浏览器控件

网格控件由CSkinCefView类来代表，继承于CSkinView，支持CSkinView的所有属性和方法。

Cef浏览器控件

布局文件如下：

<SkinDialog DefaultWidth="800" DefaultHeight="600" SysButton="CLOSE" Icon="128" Caption="IDS_CONTROL_SHOW19" Animation="SizeChange">
    <SkinCefView AlignParentLeft="0" AlignParentRight="0" AlignParentTop="32" AlignParentBottom="0" URL="www.baidu.com"/>
</SkinDialog>

下面是CSkinView类特有的XML属性和相关方法：

9.6.1设置URL

  • 通过XML属性控制如下：
URL="www.baidu.com"
  • 通过C++程序代码调用方法控制如下：
void LoadURL(const tstring& strURL);
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud
    Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具（例如配置管理，服务发现，断路器，智...
    卡卡罗2017阅读 134,993评论 19赞 139
  • 3 SkinUI视图组件和界面编程
    官方网站：http://www.skinui.cn 下载地址：http://pan.baidu.com/s/1sl...
    吴忠亮阅读 1,635评论 0赞 2
  • Java初级面试题
    1. Java基础部分 基础部分的顺序：基本语法，类相关的语法，内部类的语法，继承相关的语法，异常的语法，线程的语...
    子非鱼_t_阅读 31,779评论 18赞 399
  • 源码众享最新教程 - 草稿
    ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程，因...
    小菜c阅读 6,554评论 0赞 17
  • 睁眼瞎
    题记—— 我将眼镜摘下 世界如雾幻化 大雨模糊了天涯 人影裹了一层厚厚的纱 哑巴听着虚伪的笑话 无聊的快乐脸上挂 ...
    鱼教头阅读 515评论 12赞 19