액슈어(Axure) 따라하기 4. 리피터(repeater)를 활용한 조회 목록 - 정렬(오름/내림)

지난 시간에 액슈어(Axure)의 리피터(repeater)를 활용해서 dataset을 구성했고

해당 dataset에 드랍다운 검색 필터를 적용해 보았습니다.

 

이번 포스팅에서는 지난 시간에 이어 이미 생성된 dataset의 정렬(오름/내림)을 표현할 수 있는 방법을 소개합니다.

 

먼저 지난 포스팅에서 학습(?)했던 드랍다운리스트와 dataset 구성하기를 활용하여 dataset을 구성합니다.

지난 번에 만들때와 모습이 약간 다를 수 있는데요. 날짜(Date)의 형식이 조금 변경되었습니다. YYYY-MM-DD

그 이유는 정렬할 때 액슈어(Axure)에서 지원하는 형식이 2가지인데 그 양식을 맞추도록 데이터를 변경했습니다.

 

이런 모습을 준비해 주시면 됩니다.

각 헤드(표의 레이블)를 클릭하면 오름/내림정렬이 가능하도록 표현하겠습니다.

이미지 오른쪽 하단의 Outline Page의 내용을 이번에는 꼼꼼하게 정리하면 뒤에 Interactions을 적용할 때 혼란이 줄어듭니다.

 

ID 헤드(사각형)의 “OnClick”에 Interactions을 적용합니다.

먼저 Set Selected/Checkted에서 해당 Repeater의 ID(Rectangle)을 선택하고 Value를 true로 선택해 주세요.

그리고 Add Sort를 통해서 Name(옵션), Property, Sort as, Order를 설정합니다.

이 과정을 정렬이 필요한 진행상태, 접수자, 접수일, 완료일에 모두 적용합니다.

설정 값은 약간씩 다르겠죠?

 

지금부터는 반복입니다. (헤드의 갯수만큼)

진행상태 헤드(사각형)의 “OnClick”에 Interactions을 적용합니다.

먼저 Set Selected/Checkted에서 해당 Repeater의 진행상태(Rectangle)를 선택하고 Value를 true로 선택해 주세요.

Add Sort를 통해서 Name(옵션), Property, Sort as, Order를 설정합니다.

 

접수자 헤드(사각형)의 “OnClick”에 Interactions을 적용합니다.

먼저 Set Selected/Checkted에서 해당 Repeater의 접수자(Rectangle)를 선택하고 Value를 true로 선택해 주세요.

Add Sort를 통해서 Name(옵션), Property, Sort as, Order를 설정합니다.

 

접수일 헤드(사각형)의 “OnClick”에 Interactions을 적용합니다.

먼저 Set Selected/Checkted에서 해당 Repeater의 접수일(Rectangle)을 선택하고 Value를 true로 선택해 주세요.

Add Sort를 통해서 Name(옵션), Property, Sort as, Order를 설정합니다.

 

 

완료일 헤드(사각형)의 “OnClick”에 Interactions을 적용합니다.

먼저 Set Selected/Checkted에서 해당 Repeater의 완료일(Rectangle)을 선택하고 Value를 true로 선택해 주세요.

Add Sort를 통해서 Name(옵션), Property, Sort as, Order를 설정합니다.

 

 

그리고 이제 미리보기를 실행합니다.

 

생각보다 참 유용한 기능입니다.

도움이 되시면 좋겠습니다.

 

공유링크 : https://wuq6yp.axshare.com

 

작업파일 : 

Repeater조회정렬.rp

다운로드