WPF game with click to move written in C#

问题:

I'm attempting to move a grid of labels to the position of my mouse, like movement in an adventure game. Ideally I'd delete and redraw them on the way there. But, for now I just want to figure out how to convert int to thickness or pointtoscreen.

So far I have:

player.XMove =  (int)Mouse.GetPosition(Application.Current.MainWindow).X;
player.YMove = (int)Mouse.GetPosition(Application.Current.MainWindow).Y;

I've tried converting player.XMove and player.YMove to thickness and storing it as a margin for a grid with labels. I ran into some trouble with converting. So, is anyone able to provide help with the conversion? Also, is there a better label/grid attribute to convert the point to

Edit: Image link added.

http://i1118.photobucket.com/albums/k608/sealclubberr/clickToMove_zps51f2359f.jpg

Edit: Added Current code and XAML. I haven't yet had a chance to fiddle with it.

This is what my current code looks like:

public class User
    {
        private int fed;
        public int Fed
        {
            get
            {
                return fed;
            }
            set
            {
                fed = 5;
            }
        }

        private bool visible;
        public bool Visible
        {
            get
            {
                return visible;
            }
            set
            {
                visible = value;
            }
        }

        private int xMove;
        public int XMove
        {
            get
            {
                return xMove;
            }
            set
            {
                xMove = value;
            }
        }

        private int yMove;
        public int YMove
        {
            get
            {
                return yMove;
            }
            set
            {
                yMove = value;
            }
        }

    }

I'll eventually add Has A or Uses A between the user class and location class.(Not posted.)

My code in Main Window:

public partial class MainWindow : Window
    {
        User player = new User();
        ThicknessConverter perimeter = new ThicknessConverter();
        public MainWindow()
        {
            InitializeComponent();

        }

        private void Hansel_IsVisibleChanged(object sender, DependencyPropertyChangedEventArgs e)
        {
             Hansel.Visibility = Visibility.Visible;
        }

        private void Hansel_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            player.XMove =  (int)Mouse.GetPosition(Application.Current.MainWindow).X;
            player.YMove = (int)Mouse.GetPosition(Application.Current.MainWindow).Y;

        }

        private void southRectangle_IsHitTestVisibleChanged(object sender, DependencyPropertyChangedEventArgs e)
        {

        }


    }

I'm also working on converting bools to visibility, but ran into an error with the XAML not being able to find the converter namespace, which was there.

The XAML looks like:

<Window x:Class="HanselAndGretalDisplay.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:HanselAndGretalDisplay"
        Title="MainWindow" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <Grid>
        <Grid.Resources>
            <local:BoolToVisibleOrHidden x:Key="BoolToVisConverter"/>
        </Grid.Resources>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="154,94,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="154,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,94,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="104,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="104,94,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="104,44,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,44,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="154,44,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="179,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="79,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,119,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,19,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="698,94,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="698,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,94,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,94,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,44,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,44,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="698,44,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="723,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="623,69,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,119,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,19,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="154,425,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="154,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,425,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="104,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="104,425,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="104,375,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,375,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="154,375,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="179,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="79,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,450,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="129,350,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,425,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,425,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="623,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="623,425,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="623,375,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,375,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="673,375,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="698,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="598,400,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,450,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="648,350,0,0" VerticalAlignment="Top" Foreground="#FF1B4015" Width="25" Background="#FF1B4015" BorderBrush="Black" BorderThickness="3" Height="25"/>
        <Grid x:Name="Hansel" IsVisibleChanged="Hansel_IsVisibleChanged" MouseLeftButtonDown="Hansel_MouseLeftButtonDown">
            <Label Content="Label" HorizontalAlignment="Left" Margin="398,218,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="398,243,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="398,268,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="373,243,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="423,243,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="413,293,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="383,293,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="439,268,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Label Content="Label" HorizontalAlignment="Left" Margin="353,268,0,0" VerticalAlignment="Top" Foreground="#FFFFE2C5" Width="25" Background="#FFFFE2C5" BorderBrush="Black" BorderThickness="3" Height="25"/>
            <Rectangle x:Name="southRectangle" HorizontalAlignment="Left" Height="79" Margin="209,425,0,0" VerticalAlignment="Top" Width="383" IsHitTestVisibleChanged="southRectangle_IsHitTestVisibleChanged"/>
            <Rectangle x:Name="northRectangle" HorizontalAlignment="Left" Height="79" Margin="209,0,0,0" VerticalAlignment="Top" Width="412"/>
            <Rectangle x:Name="westRectangle" HorizontalAlignment="Left" Height="202" Margin="0,145,0,0" VerticalAlignment="Top" Width="133"/>
            <Rectangle x:Name="eastRectangle" HorizontalAlignment="Left" Height="202" Margin="627,145,0,0" VerticalAlignment="Top" Width="133"/>
        </Grid>
    </Grid>
</Window>

If there's an easy way of programmatically generating XAML objects and assigning them to initial location that would be ideal, for the long run with this project, but for now I'm not too worried about that.

回答1:

<Window x:Class="MiscSamples.ClickToMove"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ClickToMove" Height="300" Width="300">
    <ItemsControl ItemsSource="{Binding}" PreviewMouseDown="ItemsControl_PreviewMouseDown"
                  Background="#05FFFFFF">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas IsItemsHost="True"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemContainerStyle>
            <Style TargetType="ContentPresenter">
                <Setter Property="Canvas.Left" Value="{Binding X}"/>
                <Setter Property="Canvas.Top" Value="{Binding Y}"/>
            </Style>
        </ItemsControl.ItemContainerStyle>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Rectangle Stroke="Black" StrokeThickness="2" Fill="Blue"
                           Height="20" Width="20"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Window>

Code Behind:

  public partial class ClickToMove : Window
    {
        public List<MovableObject> Objects { get; set; } 

        public ClickToMove()
        {
            InitializeComponent();

            Objects = new List<MovableObject>
                {
                    new MovableObject() {X = 100, Y = 100}
                };

            DataContext = Objects;
        }

        private void ItemsControl_PreviewMouseDown(object sender, MouseButtonEventArgs e)
        {
            var position = e.GetPosition(this);
            Objects.First().MoveToPosition(position.X, position.Y);
        }
    }

Item class:

 public class MovableObject: INotifyPropertyChanged
    {
        private double _x;
        public double X
        {
            get { return _x; }
            set
            {
                _x = value;
                OnPropertyChanged("X");
            }
        }

        private double _y;
        public double Y
        {
            get { return _y; }
            set
            {
                _y = value;
                OnPropertyChanged("Y");
            }
        }

        private System.Threading.Timer MoveTimer;

        private double DestinationX;
        private double DestinationY;

        public void MoveToPosition(double x, double y)
        {
            DestinationX = x;
            DestinationY = y;

            if (MoveTimer != null)
                MoveTimer.Dispose();

            MoveTimer = new Timer(o => MoveStep(), null, 0, 10);
        }

        private void MoveStep()
        {
            if (Math.Abs(X - DestinationX) > 5)
            {
                if (X < DestinationX)
                    X = X+5;
                else if (X > DestinationX)
                    X = X-5;    
            }

            if (Math.Abs(Y - DestinationY) > 5)
            {
                if (Y < DestinationY)
                    Y = Y + 5;
                else if (Y > DestinationY)
                    Y = Y - 5;    
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string propertyName)
        {
            Application.Current.Dispatcher.BeginInvoke((Action)(() =>
                {
                    PropertyChangedEventHandler handler = PropertyChanged;
                    if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));        
                }));

        }
    }