리스트뷰 동적높이(포틀릿) 가이드

이 화면은 리스트뷰 컴포넌트의 동적높이기능에 대한 샘플 화면입니다.

height_type을 1:auto 로 설정하면, 리스트뷰에 스크롤이 생기지 않고 리스트뷰의 높이가 (아이템 건수 * 아이템 높이)만큼 늘어납니다.

단, display_mode가 0:static 또는 1:scroll 일때만 동작합니다.

리스트뷰 컴포넌트의 API중 스크롤이동에 관련된 API(setselecteditem, focusitem, scrollby, scrollto 등) 호출시 부모컴포넌트(화면, 패널, 탭 등)의 스크롤이 이동됩니다.

템플릿 위치: /HTML5/COMPONENT/LISTVIEW/listview_height_auto_portlet

템플릿 파일

• listview_height_auto_portlet.xml
• listview_height_auto_portlet.js
• 새창으로 실행

/****************************************************************************
- Notice : Do not delete this function.
****************************************************************************/
function TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet() {

}
/////////////////////////////////////////////////////////////////////////////

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.screenportlet_on_load = function()
{
	if (factory.ismobile() == true) console.log("★★★ This is Mobile ★★★");
};

///////////////////////////////////////////////////////////////////////////////////////////////

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_additem_on_mouseup = function(objInst)
{
	this.lv_01.additem();
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_insertitem_on_mouseup = function(objInst)
{
	this.lv_01.insertitem(1);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_deleteitem_on_mouseup = function(objInst)
{
	this.lv_01.deleteitem(2);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_deleteallitem_on_mouseup = function(objInst)
{
	this.lv_01.deleteallitem();
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_setitemheight_on_mouseup = function(objInst)
{
	var item_height = 20;
	if (this.lv_01.getitemheight(3) == 20) {
		item_height = 80;
	}
	this.lv_01.setitemheight(3, item_height, this.chk_refresh.getcheck());
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_setitemhidden_on_mouseup = function(objInst)
{
	var item_hidden = false;
	if (this.lv_01.getitemhidden(4) == false) {
		item_hidden = true;
	}
	this.lv_01.setitemhidden(4, item_hidden, this.chk_refresh.getcheck());
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_setselecteditem_on_mouseup = function(objInst)
{
	this.lv_01.setselecteditem(15);
	this.btn_setselecteditem1.settop(1000);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_focusitem_on_mouseup = function(objInst)
{
	this.lv_01.focusitem(16, parseInt(this.cb_focustype.getselectedcode(), 10));
	this.btn_focusitem1.settop(1040);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_scrollby_on_mouseup = function(objInst)
{
	this.lv_01.scrollby(100);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_scrollto_on_mouseup = function(objInst)
{
	//this.lv_01.scrollto(400);
	this.lv_01.scrollto(400, 1000, "", "ScrollComplete");
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.ScrollComplete = function(nDuration, strTiming)
{
	factory.consoleprint("ScrollComplete> nDuration = " + nDuration);
	factory.consoleprint("ScrollComplete> strTiming = " + strTiming);
}

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_refresh_on_mouseup = function(objInst)
{
	this.lv_01.refresh();
};

///////////////////////////////////////////////////////////////////////////////////////////////

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_additem2_on_mouseup = function(objInst)
{
	this.lv_02.additem();
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_insertitem2_on_mouseup = function(objInst)
{
	this.lv_02.insertitem(1);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_deleteitem2_on_mouseup = function(objInst)
{
	this.lv_02.deleteitem(2);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_deleteallitem2_on_mouseup = function(objInst)
{
	this.lv_02.deleteallitem();
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_setitemheight2_on_mouseup = function(objInst)
{
	var item_height = 20;
	if (this.lv_02.getitemheight(3) == 20) {
		item_height = 80;
	}
	this.lv_02.setitemheight(3, item_height, this.chk_refresh2.getcheck());
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_setitemhidden2_on_mouseup = function(objInst)
{
	var item_hidden = false;
	if (this.lv_02.getitemhidden(4) == false) {
		item_hidden = true;
	}
	this.lv_02.setitemhidden(4, item_hidden, this.chk_refresh2.getcheck());
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_setselecteditem2_on_mouseup = function(objInst)
{
	this.lv_02.setselecteditem(15);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_focusitem2_on_mouseup = function(objInst)
{
	this.lv_02.focusitem(16, parseInt(this.cb_focustype2.getselectedcode(), 10));
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_scrollby2_on_mouseup = function(objInst)
{
	this.lv_02.scrollby(100);
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_scrollto2_on_mouseup = function(objInst)
{
	//this.lv_02.scrollto(400);
	this.lv_02.scrollto(400, 1000, "", "ScrollComplete");
};

TEMPLATE_HTML5_COMPONENT_LISTVIEW_listview_height_auto_portlet.prototype.btn_refresh2_on_mouseup = function(objInst)
{
	this.lv_02.refresh();
};