guide:component:ratingbar:ratingbar_basic [xFrame5 TechNet]

이 문서는 읽기 전용입니다. 원본을 볼 수는 있지만 바꿀 수는 없습니다. 문제가 있다고 생각하면 관리자에게 문의하세요.

====== 레이팅바 기본 가이드 ======

이 화면은 레이팅바 컴포넌트에 대한 샘플 화면이다.

레이팅바 컴포넌트는 별점을 표시하여 평점이나 점수 등을 매길 때 사용할 수 있는 컴포넌트이다.

관련 이벤트로 on_change, on_changed, on_click가 있다.

관련 API로 getvalue, setvalue가 있다.

===== 예시 =====

템플릿 위치: /HTML5/COMPONENT/RATINGBAR/ratingbar_basic

템플릿 파일
  * [[xf5projecthome>template/screen/HTML5/COMPONENT/RATINGBAR/ratingbar_basic.xml|ratingbar_basic.xml]]
  * [[xf5projecthome>template/screen/HTML5/COMPONENT/RATINGBAR/ratingbar_basic.js|ratingbar_basic.js]]
  * [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/RATINGBAR/ratingbar_basic|새창으로 실행]]

<php>
echo '<html>';
echo '<iframe src="';
echo $conf['plugin']['xf5']['xf5projecthome'], 'template/template.html?';
echo 'xframe_screen_url=/HTML5/COMPONENT/RATINGBAR/ratingbar_basic"';
echo ' class="_xf5_iframe"';
echo ' style="';
echo $conf['plugin']['xf5']['xf5iframestyle'];
echo '">';
echo '</iframe>';
echo '</html>';
</php>

==== 화면 스크립트 ====

<sxh javascript>
////////////////////////////////////////////////
// Event

// 마우스 오버 값 변경시 이벤트 처리
function ratingbar01_on_change(objInst, fvalue)
{
	this.fld01.settext(fvalue);
}

// 값 변경시 이벤트 처리
function ratingbar01_on_changed(objInst, fvalue)
{
	this.fld02.settext(fvalue);
}

// 마우스 클릭시 이벤트 처리
function ratingbar01_on_click(objInst, fvalue)
{
	this.fld03.settext(fvalue);
}

function ratingbar02_on_click(objInst, fvalue)
{
	screen.alert("클릭한 위치값 : " + fvalue + "\n레이팅바 실제값 : " + this.ratingbar02.getvalue());
}
</sxh>