[WPF] UI요소를 내맘대로 - Dispatcher, Transform

목적은 WPF에서 XAML을 통해 만든 UI 구성요소(여기서는 이미지를 타겟) 를
내 마음대로 움직이는데 있다.
스토리보드와 트리거쪽을 하려다가 도통 이해가 안가서 일단 패스하고,,,
다음으로 최대한 가까운게 Dispatcher로 스레드 돌리면서 Canvas의 left와 top을
지속적으로 재조정하는 방법이다. 이는 바탕이되는 캔버스를 이동시키는 방법인데;
아무래도 컨트롤에 있어서 여러가지로 문제가 있는것 같다.
이를 위해 있는게 Transform Class 라나?




여기서 핵심은
UI 요소에 접근하여 threading 할 수 있는 DispatcherTimer  와
객체를 이동,변화 시키는등 2차원에 대한 변화 할 수 있는 Transform class 이다.
쉽게말해서 UI스레드돌리면서 변화 조금씩 시킴 = 애니메이션 효과 이다.

Mouse Event 를 어떤식으로 받느냐도 좀 다양하고 변화무쌍하다랄까


일단 선언해야할것으로 다음 두가지.
DispatcherTimer dt = new DispatcherTimer();
TranslateTransform translate = new TranslateTransform();

첫번째 시도해본 방법으로 새로운 클래스 생성한후
마우스 이벤트를 받는 형식.
MainWindow에서는 이클래스를 선언해주면서 대상이 되는 객체를 넣어주면 그 객체를 대상으로 사용 가능하다.

private FrameworkElement Element; public void TransEvent(FrameworkElement element, Window window) {    Element = element;    Element.PreviewMouseDown += Element_MouseDown; } public void Element_MouseDown(object sender, MouseEventArgs me) { //Dispatcher 생성     dt.Interval = TimeSpan.FromMilliseconds(10);     dt.Tick += new EventHandler(ticker);     dt.Start(); } void ticker(object sender, EventArgs e) //이 안에서 객체 변환 {       translate.X += 10 ; //X,Y 좌표 변화       translate.Y += 10 ;       Element.RenderTransform = translate;      //이 요소(Element)의 랜더링 위치에 영향을 주는 변환 정보를 가져오거나 설정한다. } public MainWindow() {       InitializeComponent();         TransEvent ts = new TransEvent(mover, this); //mover라는 이미지에 적용시킴       TransEvent ts2 = new TransEvent(mover2, this); //mover라는 이미지에 적용시킴   }

두번째방법으로, XAML코드에서 마우스버튼 이벤트 대상 함수를 지정해주고 해당 함수에서
Dispatcher 생성 그 외엔 같다.

XAML 코드에서 Image의 마우스 이벤트 지정. 예) <Image Width="180" Height="124" Margin="0,0,0,0" x:Name="mover"   Source="Images/movechar.gif" VerticalAlignment="Top" Canvas.Left="248" Canvas.Top="145" MouseLeftButtonDown="move" > 다음으로 비하인드 코드. public Window1() {      InitializeComponent();      Loaded += new RoutedEventHandler(Window1_Loaded);   } // 비하인드코드에서 public void move(Object sender, EventArgs e) {     dt.Interval = TimeSpan.FromMilliseconds(10);     dt.Tick += new EventHandler(dt_Tick);     dt.Start(); } void dt_Tick(object sender, EventArgs e) {     translate.X += 10;     translate.Y += 10;     Element.RenderTransform = translate; }

캔버스를 이동하고싶을때는
Canvas.SetLeft(mover, 10); 식으로 이동

현재 마우스 위치를 얻을때는 메소드가

매개변수로 넘어온 (MouseEventArgs me ) 와
( FrameworkElement element )

처음에 Window window 가 되어있다면
wd = window;
Element = element;
Point CurrentPoint = me.GetPosition(wd);

윈도우에 대한 좌표값으로 변환경우엔
Point FirstCoordinate;
FirstCoordinate = Element.TransformToVisual(wd).Transform(FirstPoint);