Skip to content

第二十六篇:两个SOUI新控件 SListView和SComboView

huangjianxiong edited this page Nov 20, 2018 · 1 revision

原文链接:《第二十六篇:两个SOUI新控件 ---- SListView和SComboView(借用Andorid的设计)》

SOUI原来实现的SListBoxEx的效率一直是我对SOUI不太满意的地方。包括后来网友实现的SListCtrlEx

这类控件为每一个列表项创建一个SWindow来容纳数据,当数据量比较大(10000+)时,一方面内存消耗会很严重;另一方面列表数据初始化也需要大量的时间。

今年开始转型做Android开发。大家都知道Android开发APP和PC上开发APP相比要简单很多,其中我个人体会最深的就是Android的ListView控件。

在Android中,ListView中列表项的显示采用控件+适配器(Adapter)的模式,也就是所谓的MVC模式。一个表项在需要显示的时候才会把数据加载到View里去,当这个表项被隐藏起来以后,容纳该表项的容器(View)则自动被加入到ListView中保存的一个容器回收列表中。需要显示一个新表项时首先去回收站里查找是否存在指定类型的容器,存在则自动复用。

基本思想如上,当然实际实现还使用了很多技巧。通过上述机制,可以有效解决ListView显示大量数据的问题。

本来也一直想重写SOUI的ListBox, 这段时间正好项目需要,抽出时间模仿了一个,效果不错。

先看看效果:

第一张图是一个加载50000行的SListView控件,第二个图是演示使用SComboView来做用户登陆界面。

要在SOUI中使用SListView,我们首先需要自己实现一上数据填充的Adapter:

class CTestAdapter : public SAdapterBase
{
protected:
    SListView * m_pOwenr;
public:
    CTestAdapter(SListView *pOwner):m_pOwenr(pOwner)
    {

    }
    virtual int getCount()
    {
        return 50000;
    }   

    virtual void getView(int position, SWindow * pItem)
    {
        if(pItem->GetChildrenCount()==0)
        {
            pItem->InitFromXml(m_pOwenr->GetTemplate());
        }
        SAnimateImgWnd *pAni = pItem->FindChildByName2<SAnimateImgWnd>(L"ani_test");

        SButton *pBtn = pItem->FindChildByName2<SButton>(L"btn_test");
        pBtn->SetWindowText(SStringW().Format(L"button %d",position));
        pBtn->SetUserData(position);
        pBtn->GetEventSet()->subscribeEvent(EVT_CMD,Subscriber(&CTestAdapter::OnButtonClick,this));
    }

    bool OnButtonClick(EventArgs *pEvt)
    {
        SButton *pBtn = sobj_cast<SButton>(pEvt->sender);
        int iItem = pBtn->GetUserData();
        SMessageBox(NULL,SStringT().Format(_T("button of %d item was clicked"),iItem),_T("haha"),MB_OK);
        return true;
    }
};

这里最关键的就是实现IAdapter中的getView方法。

和Android的ListView不同,SOUI中使用条件pItem->GetChildrenCount()==0来判断一个容器是否是被复用。

pItem->GetChildrenCount()==0时代表该容器还没有被初始化,需要自己从XML模板中初始化容器。XML模板可以自己自己定义的任意符合SOUI布局语法的数据。

容器初始化完成后就可以向里面填充数据,也可以向控件连接响应函数了(subscribeEvent)。

在UI创建完成后需要在代码中把这个Adapter交给SListView

LRESULT CMainDlg::OnInitDialog( HWND hWnd, LPARAM lParam )
{
    //....
    
    SListView *pLstView = FindChildByName2<SListView>("lv_test");
    if(pLstView)
    {
        CTestAdapter *pAdapter = new CTestAdapter(pLstView);
        pLstView->SetAdapter(pAdapter);
        pAdapter->Release();
    }

    return 0;
}

第二个界面是演示SComboView的。SComboView的用户和SListView基本一样,具体看代码。

WIKI 导航

SOUI 概述
使用教程

﹊﹊﹊﹊﹊﹊﹊﹊﹊﹊
This wiki is created by [SOUI Team]

Clone this wiki locally