지금 업데이트하고 있는 프로그램에서 파워포인트와 같은 객체 정렬 기능을 추가했습니다.
객체들은 리스트에 담겨 있으며 리스트의 맨 처음부터 화면에 표시되기 때문에 객체들이 서로 겹쳐지게 된다면 리스트 앞쪽에 있는 객체는 뒤쪽에 있는 객체로 가려지게 됩니다.
그래서 가려지는 객체를 "맨 앞으로 보내기" 하려면 리스트의 맨 뒤로 이동 시켜주면 됩니다.
하지만 이렇게 하면 리스트가 변경되기 때문에 ZIndex 값을 통해 위 기능을 구현하려고 했습니다.
즉 ZIndex값을 가장 높게 설정하면 모든 객체들 앞에 표시됩니다.
이렇게 작성하고 보니 ZIndex 값이 계속해서 커진다는 점이 자꾸 마음에 걸립니다.
한참 고민 끝에 ZIndex의 최대 값을 설정하기로 하고 그 값을 100으로 설정했습니다.
이렇게 ZIndex의 최대 값을 설정하고 나니 "맨 앞으로 보내기" 로 했을 때 제대로 작동하지 않는 경우가 발생할 수 있습니다.
어떤 객체의 ZIndex가 100이고 그 객체보다 리스트 상으로 앞에 있는 객체를 "맨 앞으로 보내기" 했을 때
둘 다 ZIndex가 100이지만 "맨 앞으로 보내기" 한 객체가 리스트 상으로 앞에 있기 때문에 기존 객체의 의해 가려질 수 있습니다.
3번 객체를 "맨 앞으로 보내기" 했을 경우(7번 객체에 의해 가려짐)
이런 경우는 ZIndex 값의 변경 만으로는 해결할 수 없기 때문에 리스트 상의 위치를 변경해야 합니다.
즉 ZIndex를 100으로 설정하고 리스트의 맨 뒤로 보내면 됩니다.
앞서 리스트 변경을 하지 않기 위해 ZIndex를 사용했는데 결국 리스트 변경이 일어나게 됩니다. 그래도 리스트 변경은 최소화 할 수 있습니다.
위 내용을 아래와 같이 정리할 수 있습니다.
나머지 "앞으로 보내기" , "뒤로 보내기" , "맨 뒤로 보내기" 기능도 위 방법으로 구현 가능합니다.
글을 적고 나니 리스트 상의 위치를 변경하는 것이 코드가 제일 깔끔하지 않을까?
하는 생각이 듭니다.
1. 앞으로 보내기 |
2. 맨 앞으로 보내기 |
3. 뒤로 보내기 |
4. 맨 뒤로 보내기 |
객체들은 리스트에 담겨 있으며 리스트의 맨 처음부터 화면에 표시되기 때문에 객체들이 서로 겹쳐지게 된다면 리스트 앞쪽에 있는 객체는 뒤쪽에 있는 객체로 가려지게 됩니다.
그래서 가려지는 객체를 "맨 앞으로 보내기" 하려면 리스트의 맨 뒤로 이동 시켜주면 됩니다.
하지만 이렇게 하면 리스트가 변경되기 때문에 ZIndex 값을 통해 위 기능을 구현하려고 했습니다.
즉 ZIndex값을 가장 높게 설정하면 모든 객체들 앞에 표시됩니다.
selected.ZIndex = objs.Max(x => x.ZIndex) + 1;
7번 객체를 "맨 앞으로 보내기" 하면 아래와 같이 됩니다.이렇게 작성하고 보니 ZIndex 값이 계속해서 커진다는 점이 자꾸 마음에 걸립니다.
한참 고민 끝에 ZIndex의 최대 값을 설정하기로 하고 그 값을 100으로 설정했습니다.
이렇게 ZIndex의 최대 값을 설정하고 나니 "맨 앞으로 보내기" 로 했을 때 제대로 작동하지 않는 경우가 발생할 수 있습니다.
어떤 객체의 ZIndex가 100이고 그 객체보다 리스트 상으로 앞에 있는 객체를 "맨 앞으로 보내기" 했을 때
둘 다 ZIndex가 100이지만 "맨 앞으로 보내기" 한 객체가 리스트 상으로 앞에 있기 때문에 기존 객체의 의해 가려질 수 있습니다.
이런 경우는 ZIndex 값의 변경 만으로는 해결할 수 없기 때문에 리스트 상의 위치를 변경해야 합니다.
즉 ZIndex를 100으로 설정하고 리스트의 맨 뒤로 보내면 됩니다.
앞서 리스트 변경을 하지 않기 위해 ZIndex를 사용했는데 결국 리스트 변경이 일어나게 됩니다. 그래도 리스트 변경은 최소화 할 수 있습니다.
위 내용을 아래와 같이 정리할 수 있습니다.
1. ZIndex를 통하여 객체 정렬을 한다.
2. ZIndex만으로 불가능한 경우에는 리스트의 위치를 변경한다.
나머지 "앞으로 보내기" , "뒤로 보내기" , "맨 뒤로 보내기" 기능도 위 방법으로 구현 가능합니다.
글을 적고 나니 리스트 상의 위치를 변경하는 것이 코드가 제일 깔끔하지 않을까?
하는 생각이 듭니다.
댓글
댓글 쓰기