Grid에서 Drag and Drop 기능이 가능 하다니...
솔직히 약간 놀랐다.. 멋져부러~~
# 아래 소스는 tobesoft에서 제공한 샘플 예제임을 알립니다.
문제가 될 시에는 삭제 하겠습니다.
지금 부터 설명할 예제는 Grid에서 하나의 cell을 선택하여 drag해서 List에 drop시키는 기능에 대하여 설명하겠다.
일단 Grid의 속성을 몇가지 변경 해 주어야 한다.
ColSelect : true( 하나의 cell만 선택하기 위함)
DragImageID : 아무 이미지나 설정(이것은 안 해도 됨. Drag시 나타날 이미지 설정)
DragMode : true( 이부분은 꼭 설정해야 함)
Drag 기능을 사용하기 위해서는 Grid를 선택하고 Event를 Drag시 발생하는 "OnDrag"로 설정.
아래는 Drag 기능을 사용하기 위한 소스 이다.
mainGrid - Drag기능을 사용하려는 Grid의 ID
CreateDataObject() - Drag 기능 사용시에 Drag하는 동안의 Data를 저장할 Object라 생각하면 쉽다.
{
// Dataset의 Column ID얻어오기
var col_id = mainGrid.GetCellProp("body", nCell, "colid");
// Grid의 위치 잡기
mainGrid.SetCellPos(nCell);
ds_search.row = nRow;
// Drag처리
var drag_dataobj = CreateDataObject(); //Data를 보내기 위하여 Object 생성
drag_dataobj.SetData("CF_TEXT", ds_search.GetColumn(nRow, col_id));
return drag_dataobj;
}
이번에는 List에서 설정하는 부분이다.
Grid에서 선택하여 Drag기능을 사용하기 위해서 "OnDrag" event를 사용하였고,
이 선택된 값을 List에 Drop시켜서 List에 추가를 해주어야 하므로, List에서는 "OnDrop" event를 사용하면 된다.
"OnDrop" event의 소스이다.
List에는 ds_droptList라는 dataset을 binding하였고, "OnDrop" event가 발생되면은 ds_dropList에 AddRow()를 해주고 drop된 값(objDataObj.GetData("CF_TEXT")) 를 SetColumn을 이용해서 설정해주면은 된다.
{
ds_dropList.AddRow();
ds_dropList.SetColumn(ds_dropList.row, "code", "dropped");
ds_dropList.SetColumn(ds_dropList.row, "value", objDataObj.GetData("CF_TEXT"));
}
아래 그림은 Drag 하는 중에 나타나는 이미지 이다.
tobesoft 이미지가 drag하는 도중에 나타나는데, 두번째 이미지에서 "DragImageID"를 TOBESOFT 로 설정을 했기 때문이다.
"guest01"을 drag해서 List에 drop을 시켰을 때 화면이다.
List에 "guest01"이 추가된 것을 볼 수 있다.
'MiPlatform' 카테고리의 다른 글
| [miplatform]Expression - Expr 편 (0) | 2009/04/10 |
|---|---|
| [miplatform]Expression - BkColor 편 (0) | 2009/04/10 |
| [miplatform]Gird sorting (0) | 2009/04/10 |
| [miplatform]Grid - Drag and Drop 기능 (0) | 2009/04/10 |
| [miplatform] Grid 속성 - ExpandShow (2) | 2009/04/10 |
| [miplatform] Grid에 적용된 Dataset의 ID 변경 (0) | 2009/04/07 |
