성태의 닷넷 이야기
홈 주인
모아 놓은 자료
프로그래밍
질문/답변
사용자 관리
사용자
메뉴
아티클
외부 아티클
유용한 코드
온라인 기능
MathJax 입력기
최근 덧글
[정성태] 아쉽게도, 커뮤니티는 아니고 개인 블로그입니다. ^^
[정성태] 질문이 잘 이해가 안 됩니다. 우선, 해당 소스코드에서 ILis...
[양승조
] var대신 dinamic으로 선언해서 해결은 했습니다. 맞는 해...
[양승조
] 또 막혔습니다. ㅠㅠ var list = props[i].Ge...
[양승조
] 아. 감사합니다. 어제는 안됐던것 같은데....정신을 차려야겠네...
[정성태] "props[i].GetValue(props[i])" 코드에서 ...
[정성태] 저렇게 조각 코드 말고, 실제로 재현이 되는 예제 프로젝트를 압...
[정성태] Modules 창(Ctrl+Shift+U)을 띄워서, 해당 Op...
[정성태] 만드실 수 있습니다. 단지, Unity 엔진 내의 스크립트와 W...
[공진영] 안녕하세요 좋은글 감사합니다. 현재 제가 wpf로 관제 모...
글쓰기
제목
이름
암호
전자우편
HTML
홈페이지
유형
제니퍼 .NET
닷넷
COM 개체 관련
스크립트
VC++
VS.NET IDE
Windows
Team Foundation Server
디버깅 기술
오류 유형
개발 환경 구성
웹
기타
Linux
Java
DDK
Math
Phone
Graphics
사물인터넷
부모글 보이기/감추기
내용
<div style='display: inline'> <br /> <div style='font-family: 맑은 고딕, Consolas; font-size: 20pt; color: #006699; text-align: center; font-weight: bold'>WPF - 중첩된 ScrollViewer의 크기 제어</div><br /> <br /> 제목 짓기가 영 난감합니다. ^^; 이해를 돕기 위해, 다음의 XAML 디자인 화면을 먼저 보도록 하겠습니다<br /> <br /> [그림 1: Grid와, 그 내부에 정의된 Grid 2개]<br /> <img alt='ignore_measure_override_1.png' src='/SysWebRes/bbs/ignore_measure_override_1.png' /><br /> <br /> 계층 구조는 다음과 같이 되어 있습니다.<br /> <br /> <pre style='margin: 10px 0px 10px 10px; padding: 10px 0px 10px 10px; width: 800px; background-color: #fbedbb; overflow-x: scroll; font-family: Consolas, Verdana;' > ScrollViewer(A) Grid <b style='color: Blue;'>첫 번째 요소 (Grid)</b> <b style='color: Blue;'>두 번째 요소 (Grid)</b> </pre> <br /> 보는 것처럼, 첫 번째 Row에 있는 Grid 요소는 윈도우 크기에서 무리 없이 보이고 있지만, 두 번째 Row에 있는 Grid 요소는 5번째 컬럼부터 모두 표현해 주지 못하고 있습니다. 이 때문에, 덩달아서 첫 번째 Row의 Width까지도 넓어져버리고, 이런 Grid 2개를 감싸고 있는 외부 Grid가 ScrollViewer에 포함되어 있어 [그림 2]와 같이 나타나게 됩니다.<br /> <br /> [그림 2: 두 번째 Row의 크기에 맞게 스크롤이 생긴 레이아웃]<br /> <img alt='ignore_measure_override_2.png' src='/SysWebRes/bbs/ignore_measure_override_2.png' /><br /> <br /> 그런데, 때에 따라서는 두 번째 Row를 차지하고 있는 (폭이 넓은) 요소에 ScrollViewer를 씌우고 전체적인 레이아웃상으로는 두 번째 Row의 크기를 무시하고 싶을 수도 있습니다. 아래와 같은 식이겠지요.<br /> <br /> [그림 3: 첫 번째 Row의 크기에 맞게 구성된 레이아웃]<br /> <img alt='ignore_measure_override_3.png' src='/SysWebRes/bbs/ignore_measure_override_3.png' /><br /> <br /> <pre style='margin: 10px 0px 10px 10px; padding: 10px 0px 10px 10px; width: 800px; background-color: #fbedbb; overflow-x: scroll; font-family: Consolas, Verdana;' > ScrollViewer(A) Grid Grid.RowDefinition 첫 번째 Grid Grid.RowDefinition <b style='color: Blue;'>ScrollViewer(B)</b> 두 번째 Grid </pre> <br /> 동작 방식을 동영상으로 보면 아래와 같이 실행되기를 원하는 것입니다.<br /> <br /> <object classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6"><param name="URL" value="/SysWebRes/bbs/ignore_measure_override_capture.avi" /><param name="autoStart" value="False" /></object><br /> <br /> 직접 해보면, 의도했던 것과는 달리 실제로는 여전히 [그림 2]처럼 나오는 것을 확인할 수 있습니다. 왜 그러냐면, 외곽의 "ScrollViewer(A)"까지는 윈도우의 고정적인 크기가 전달된 MeasureOverride가 호출되지만, 그것의 자식 요소들부터는 MeasureOverride 인자에 Infinity 값이 전달되기 떄문입니다.<br /> <br /> 그렇기 때문에 두 번째 "ScollViewer(B)"조차도 MeasureOverride에 "Infinity" 값을 전달받게 되어 크기 조절이 안되는 것입니다.<br /> <br /> 이런 경우에 어찌해야 할까요?<br /> <br /> 제가 생각한 방법은 첫 번째 Grid의 Width를 기준으로 두 번째 Grid의 Width를 제어하는 걸로 결정했습니다.<br /> <br /> 그래서, 다음과 같은 식으로 기준이 되는 요소를 "anchor"라고 이름짓고, 다른 곳에서 그에 대한 참조를 했습니다.<br /> <br /> <pre style='margin: 10px 0px 10px 10px; padding: 10px 0px 10px 10px; width: 800px; background-color: #fbedbb; overflow-x: scroll; font-family: Consolas, Verdana;' > <Border Name="anchor"> <Grid> ... </Grid> </Border> <Border> <my:RelativeScrollViewer <b style='color: Blue;'>DependsOnElement="{Binding ElementName=anchor}"</b>> <Grid> ... </Grid> </my:RelativeScrollViewer> </Border> </pre> <br /> 그럼, DependsOnElement 의존 속성에서는 anchor 요소의 참조를 보관해 놓은 후, RelativeScrollViewer 요소의 MeasureOverride에 재사용을 하면 됩니다.<br /> <br /> <pre style='margin: 10px 0px 10px 10px; padding: 10px 0px 10px 10px; width: 800px; background-color: #fbedbb; overflow-x: scroll; font-family: Consolas, Verdana;' > public class RelativeScrollViewer : ScrollViewer { public object DependsOnElement { get { return (object)GetValue(DependsOnElementProperty); } set { SetValue(DependsOnElementProperty, value); } } public static readonly DependencyProperty DependsOnElementProperty = DependencyProperty.Register("DependsOnElement", typeof(object), typeof(RelativeScrollViewer), new PropertyMetadata(null)); protected override Size <b style='color: Blue;'>MeasureOverride(Size constraint)</b> { FrameworkElement elem = DependsOnElement as FrameworkElement; if (elem != null) { return base.<b style='color: Blue;'>MeasureOverride(new Size(elem.DesiredSize.Width, constraint.Height));</b> } else { return base.MeasureOverride(constraint); } } } </pre> <br /> 일단, 요즘 진행하고 있는 프로젝트에서는 위와 같은 방법으로 해결을 하긴 했는데... 영 마음에 들지 않습니다. 혹시... 위의 방법보다 더 좋은 방법을 제시할 분 계신가요?<br /> <br /> 한가한 일요일 오후... 문득 저 방법이 너무 마음에 안들어서 개선을 하기로 작정했는데 생각보다 아주 간단하게 해결이 되었습니다. <a target='_tab' href='http://www.sysnet.pe.kr/bbs/DownloadAttachment.aspx?fid=473&boardid=331301885'>정답은 첨부된 프로젝트에!</a> ^^ (월요일날 출근해서 이렇게 고쳐야 겠습니다.)<br /> <br /><br /><hr /><span style='color: Maroon'>[이 토픽에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]</span> </div>
첨부파일
스팸 방지용 인증 번호
1144
(왼쪽의 숫자를 입력해야 합니다.)