none
Simple Drag And Drop a Wpf button Control

    Question

  • Hi all,
    Am totally new to Wpf Application
    i want to move my control along with the mousepoint in the same window itself but at runtime

    may be i may use two to three controls...

    multiple is not required....
    Can any one send me a complete source code....
    Thanks in Advance...

    Wednesday, June 16, 2010 7:45 AM

Answers

  • this is moving of border ,You can Move any Control in the window by this Control

    double m_MouseX;
        double m_MouseY;
        // Details of Graph border
    // tbHeader is the control Which you hold by mouse down to move the border
        private void tbHeader_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
    
          // Get the Position of Window so that it will set margin from this window
          m_MouseX = e.GetPosition(this).X;
          m_MouseY = e.GetPosition(this).Y;
        }
    
        private void tbHeader_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
        {
          if (e.LeftButton == MouseButtonState.Pressed)
          {
            // Capture the mouse for border
            e.MouseDevice.Capture(tbHeader);
            System.Windows.Thickness _margin = new System.Windows.Thickness();
            int _tempX = Convert.ToInt32(e.GetPosition(this).X);
            int _tempY = Convert.ToInt32(e.GetPosition(this).Y);
            _margin = border1.Margin;
            // when While moving _tempX get greater than m_MouseX relative to usercontrol 
            if (m_MouseX > _tempX)
            {
              // add the difference of both to Left
              _margin.Left += (_tempX - m_MouseX);
              // subtract the difference of both to Left
              _margin.Right -= (_tempX - m_MouseX);
            }
            else
            {
              _margin.Left -= (m_MouseX - _tempX);
              _margin.Right -= (_tempX - m_MouseX);
            }
            if (m_MouseY > _tempY)
            {
              _margin.Top += (_tempY - m_MouseY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            else
            {
              _margin.Top -= (m_MouseY - _tempY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            border1.Margin = _margin;
            m_MouseX = _tempX;
            m_MouseY = _tempY;
          }
        }
    
        private void tbHeader_MouseUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
          e.MouseDevice.Capture(null);
        }
    It is fully tested code
    • Marked as answer by Krishna.13579 Wednesday, June 16, 2010 1:32 PM
    Wednesday, June 16, 2010 9:12 AM
  • your XAML should Look like

    <Window x:Class="controls.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    
    
      <Grid AllowDrop="True" x:Name="mainGrd">
    
        <Grid Height="246" HorizontalAlignment="Left" AllowDrop="True"
    
          Margin="23,31,0,0" Name="grid1" VerticalAlignment="Top"
    
           Width="432" ShowGridLines="True" />
    
    
        <Button Content="Button" Height="23" HorizontalAlignment="Left"
    
            Margin="190,108,0,0" Name="button1" VerticalAlignment="Top"
    
             Width="75" MouseLeftButtonUp="button1_MouseLeftButtonUp"
    
              MouseMove="button1_MouseMove" MouseUp="button1_MouseUp" />
    
      </Grid>
    
    
    </Window>
    and CS File Look Like 
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Imaging;
    using System.Windows.Navigation;
    using System.Windows.Shapes;
    
    namespace controls
    {
      /// <summary>
      /// Interaction logic for MainWindow.xaml
      /// </summary>
      public partial class MainWindow : Window
      {
        double m_MouseX;
        double m_MouseY;
    
        public MainWindow()
        {
          InitializeComponent();
          button1.PreviewMouseUp+=new MouseButtonEventHandler(button1_MouseUp);
          button1.PreviewMouseLeftButtonDown+=new MouseButtonEventHandler(button1_MouseLeftButtonUp);
          button1.PreviewMouseMove+=new MouseEventHandler(button1_MouseMove);
        }
    
        
    
        private void button1_MouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
          // Get the Position of Window so that it will set margin from this window
          m_MouseX = e.GetPosition(this).X;
          m_MouseY = e.GetPosition(this).Y;
        }
    
        private void button1_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
        {
          if (e.LeftButton == MouseButtonState.Pressed)
          {
            // Capture the mouse for border
            e.MouseDevice.Capture(button1);
            System.Windows.Thickness _margin = new System.Windows.Thickness();
            int _tempX = Convert.ToInt32(e.GetPosition(this).X);
            int _tempY = Convert.ToInt32(e.GetPosition(this).Y);
            _margin = mainGrd.Margin;
            // when While moving _tempX get greater than m_MouseX relative to usercontrol 
            if (m_MouseX > _tempX)
            {
              // add the difference of both to Left
              _margin.Left += (_tempX - m_MouseX);
              // subtract the difference of both to Left
              _margin.Right -= (_tempX - m_MouseX);
            }
            else
            {
              _margin.Left -= (m_MouseX - _tempX);
              _margin.Right -= (_tempX - m_MouseX);
            }
            if (m_MouseY > _tempY)
            {
              _margin.Top += (_tempY - m_MouseY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            else
            {
              _margin.Top -= (m_MouseY - _tempY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            mainGrd.Margin = _margin;
            m_MouseX = _tempX;
            m_MouseY = _tempY;
          }
        }
    
        private void button1_MouseUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
          e.MouseDevice.Capture(null);
    
        }
    
        
    
      }
    
    }

    Now Run and Check,

    You may Register your Events in the Xaml and also run it ,I have tested this Code,It should Work now

    Hope it helps

    • Marked as answer by Krishna.13579 Thursday, June 17, 2010 7:44 AM
    Wednesday, June 16, 2010 2:30 PM

All replies

  • this is moving of border ,You can Move any Control in the window by this Control

    double m_MouseX;
        double m_MouseY;
        // Details of Graph border
    // tbHeader is the control Which you hold by mouse down to move the border
        private void tbHeader_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
    
          // Get the Position of Window so that it will set margin from this window
          m_MouseX = e.GetPosition(this).X;
          m_MouseY = e.GetPosition(this).Y;
        }
    
        private void tbHeader_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
        {
          if (e.LeftButton == MouseButtonState.Pressed)
          {
            // Capture the mouse for border
            e.MouseDevice.Capture(tbHeader);
            System.Windows.Thickness _margin = new System.Windows.Thickness();
            int _tempX = Convert.ToInt32(e.GetPosition(this).X);
            int _tempY = Convert.ToInt32(e.GetPosition(this).Y);
            _margin = border1.Margin;
            // when While moving _tempX get greater than m_MouseX relative to usercontrol 
            if (m_MouseX > _tempX)
            {
              // add the difference of both to Left
              _margin.Left += (_tempX - m_MouseX);
              // subtract the difference of both to Left
              _margin.Right -= (_tempX - m_MouseX);
            }
            else
            {
              _margin.Left -= (m_MouseX - _tempX);
              _margin.Right -= (_tempX - m_MouseX);
            }
            if (m_MouseY > _tempY)
            {
              _margin.Top += (_tempY - m_MouseY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            else
            {
              _margin.Top -= (m_MouseY - _tempY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            border1.Margin = _margin;
            m_MouseX = _tempX;
            m_MouseY = _tempY;
          }
        }
    
        private void tbHeader_MouseUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
          e.MouseDevice.Capture(null);
        }
    It is fully tested code
    • Marked as answer by Krishna.13579 Wednesday, June 16, 2010 1:32 PM
    Wednesday, June 16, 2010 9:12 AM
  • Hey Thanks for ur reply...

    i tested this code ,in that events are not firing wen i debug that project...

    wat should i do for that??

    tbHeader means tab control ?? or anything else??

    Wednesday, June 16, 2010 10:38 AM
  • tbHeader is any Control Let say your Border,you may Registewr these two Events For Your Border,and write the Code,

    tbHeader is that Control Which you Hold to drag drop,Let say you have window and it have header,and by holding header you want to move the Window ,(Then in This case header is the "tbHeader")

    Wednesday, June 16, 2010 10:57 AM
  • as you want to Move the Button so Register these Events For Your Button Control,and Replace tbHeader with the name of your Button and border1 with the name of that Control which have Button in it ,Say with your Grid name
    Wednesday, June 16, 2010 11:02 AM
  • Hey Thanks....

    i kept a button in a grid and it is moving in run time but wat is ,it is not moving

    with my mouse point. it is going in some direction ....

    and one more thing is ...

    it is not moving wen i kept the mouse point on button ,it is moving wen i kept the point some where

    in the grid...

    am asking that shall we move it like that ,how we  move at design time

    Wednesday, June 16, 2010 11:31 AM
  • share your Code here let me check what you are doing wrong here ,XAML also
    Wednesday, June 16, 2010 11:59 AM
  • <Window x:Class="controls.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525">


        <Grid AllowDrop="True">

            <Grid Height="246" HorizontalAlignment="Left" AllowDrop="True"

               Margin="23,31,0,0" Name="grid1" VerticalAlignment="Top"

                  Width="432" ShowGridLines="True" />


            <Button Content="Button" Height="23" HorizontalAlignment="Left"

                   Margin="190,108,0,0" Name="button1" VerticalAlignment="Top"

                     Width="75" MouseLeftButtonUp="button1_MouseLeftButtonUp"

                       MouseMove="button1_MouseMove" MouseUp="button1_MouseUp" />

        </Grid>


    </Window>

     

     

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Imaging;
    using System.Windows.Navigation;
    using System.Windows.Shapes;

    namespace controls
    {
        /// <summary>
        /// Interaction logic for MainWindow.xaml
        /// </summary>
        public partial class MainWindow : Window
        {
            double m_MouseX;
            double m_MouseY;

            public MainWindow()
            {
                InitializeComponent();
            }

           
            private void button1_MouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
            {
                // Get the Position of Window so that it will set margin from this window
                m_MouseX = e.GetPosition(this).X;
                m_MouseY = e.GetPosition(this).Y;
            }

            private void button1_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
            {
                 if (e.LeftButton == MouseButtonState.Pressed)
                {
                    // Capture the mouse for border
                    e.MouseDevice.Capture(button1);
                    System.Windows.Thickness _margin = new System.Windows.Thickness();
                    int _tempX = Convert.ToInt32(e.GetPosition(this).X);
                    int _tempY = Convert.ToInt32(e.GetPosition(this).Y);
                     _margin = grid1.Margin;
                    // when While moving _tempX get greater than m_MouseX relative to usercontrol
                    if (m_MouseX > _tempX)
                    {
                        // add the difference of both to Left
                        _margin.Left += (_tempX - m_MouseX);
                        // subtract the difference of both to Left
                        _margin.Right -= (_tempX - m_MouseX);
                    }
                    else
                    {
                        _margin.Left -= (m_MouseX - _tempX);
                        _margin.Right -= (_tempX - m_MouseX);
                    }
                    if (m_MouseY > _tempY)
                    {
                        _margin.Top += (_tempY - m_MouseY);
                        _margin.Bottom -= (_tempY - m_MouseY);
                    }
                    else
                    {
                        _margin.Top -= (m_MouseY - _tempY);
                        _margin.Bottom -= (_tempY - m_MouseY);
                    }
                    grid1.Margin = _margin;
                    m_MouseX = _tempX;
                    m_MouseY = _tempY;
                }
            }

            private void button1_MouseUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
            {
                 e.MouseDevice.Capture(null);
           
            }


        }

    }

    only this code i kept in project ......

    Hi am using Visual Studio 2010

     

    Wednesday, June 16, 2010 12:12 PM
  • you have registred the MouseLeftButtonUp Instead of Down

    please see this is mouseDown

     private void tbHeader_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
      {
    
       // Get the Position of Window so that it will set margin from this window
       m_MouseX = e.GetPosition(this).X;
       m_MouseY = e.GetPosition(this).Y;
      }
    
    Wednesday, June 16, 2010 2:26 PM
  • your XAML should Look like

    <Window x:Class="controls.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    
    
      <Grid AllowDrop="True" x:Name="mainGrd">
    
        <Grid Height="246" HorizontalAlignment="Left" AllowDrop="True"
    
          Margin="23,31,0,0" Name="grid1" VerticalAlignment="Top"
    
           Width="432" ShowGridLines="True" />
    
    
        <Button Content="Button" Height="23" HorizontalAlignment="Left"
    
            Margin="190,108,0,0" Name="button1" VerticalAlignment="Top"
    
             Width="75" MouseLeftButtonUp="button1_MouseLeftButtonUp"
    
              MouseMove="button1_MouseMove" MouseUp="button1_MouseUp" />
    
      </Grid>
    
    
    </Window>
    and CS File Look Like 
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Imaging;
    using System.Windows.Navigation;
    using System.Windows.Shapes;
    
    namespace controls
    {
      /// <summary>
      /// Interaction logic for MainWindow.xaml
      /// </summary>
      public partial class MainWindow : Window
      {
        double m_MouseX;
        double m_MouseY;
    
        public MainWindow()
        {
          InitializeComponent();
          button1.PreviewMouseUp+=new MouseButtonEventHandler(button1_MouseUp);
          button1.PreviewMouseLeftButtonDown+=new MouseButtonEventHandler(button1_MouseLeftButtonUp);
          button1.PreviewMouseMove+=new MouseEventHandler(button1_MouseMove);
        }
    
        
    
        private void button1_MouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
          // Get the Position of Window so that it will set margin from this window
          m_MouseX = e.GetPosition(this).X;
          m_MouseY = e.GetPosition(this).Y;
        }
    
        private void button1_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
        {
          if (e.LeftButton == MouseButtonState.Pressed)
          {
            // Capture the mouse for border
            e.MouseDevice.Capture(button1);
            System.Windows.Thickness _margin = new System.Windows.Thickness();
            int _tempX = Convert.ToInt32(e.GetPosition(this).X);
            int _tempY = Convert.ToInt32(e.GetPosition(this).Y);
            _margin = mainGrd.Margin;
            // when While moving _tempX get greater than m_MouseX relative to usercontrol 
            if (m_MouseX > _tempX)
            {
              // add the difference of both to Left
              _margin.Left += (_tempX - m_MouseX);
              // subtract the difference of both to Left
              _margin.Right -= (_tempX - m_MouseX);
            }
            else
            {
              _margin.Left -= (m_MouseX - _tempX);
              _margin.Right -= (_tempX - m_MouseX);
            }
            if (m_MouseY > _tempY)
            {
              _margin.Top += (_tempY - m_MouseY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            else
            {
              _margin.Top -= (m_MouseY - _tempY);
              _margin.Bottom -= (_tempY - m_MouseY);
            }
            mainGrd.Margin = _margin;
            m_MouseX = _tempX;
            m_MouseY = _tempY;
          }
        }
    
        private void button1_MouseUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
          e.MouseDevice.Capture(null);
    
        }
    
        
    
      }
    
    }

    Now Run and Check,

    You may Register your Events in the Xaml and also run it ,I have tested this Code,It should Work now

    Hope it helps

    • Marked as answer by Krishna.13579 Thursday, June 17, 2010 7:44 AM
    Wednesday, June 16, 2010 2:30 PM