在画布上绘制数组WPF C#

Question

我有一个项目,我应该做一个小游戏,你可以将小矩形拖放到网格中,然后填充该网格.我遇到了一个问题.制作网格并提前定义尺寸没问题.但是当我填充当前网格时,我需要一个不同大小的新网格.

然后我想起了曾经用Java制作的俄罗斯方块游戏,其中网格是使用2D阵列创建的,我们可以根据用户输入调整大小.我在重新格式化硬盘时丢失了这个项目.

问题是我不知道是否可以使用WPF和C#在画布上"绘制"一个数组,或者是否有一种简单的方法可以根据我将要制作的函数制作一个网格(函数)并不重要,因为它将根据分数定义行和列大小.我已将此网格作为用户控件,并且必须满足以下条件:

此网格不能大于300 x 300(我可能会使其更大),这意味着行和列应相应缩放(如果可能).

当网格制作完成后,我认为我需要拖放到网格中的较小矩形可以由较小的数组组成.然后当您放下它时,将网格的值从"1"更改为"2".当网格中的所有位置都填充"2"时,您将获得一个新的网格填充(这是,如果可以使用数组)

我真的希望有人能够帮助我,因为我不知道如何做到这一点,我唯一可以在互联网上找到的是如何添加拖放到项目.

Answer 1

忘了java.它老了,笨重而没用.它甚至没有属性.更不用说WPF提供的DataBinding功能,或者是LinQ的精彩之美.

这是我对你描述的内容的看法:

<Window x:Class="MiscSamples.SquaresGameSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Forget java. It's a crappy dinousaur." Height="300" Width="300">
    <DockPanel>
        <StackPanel DockPanel.Dock="Top" Orientation="Horizontal" Margin="2">
            <TextBlock Text="Rows:"/>
            <Slider Maximum="100" Minimum="10" Value="{Binding Rows}" Width="200"/>
            <TextBlock Text="Columns:"/>
            <Slider Maximum="100" Minimum="10" Value="{Binding Columns}" Width="200"/>
        </StackPanel>

        <ListBox Margin="0,0,20,0" Width="50" DockPanel.Dock="Left" ItemsSource="{Binding Numbers}">
            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                    <EventSetter Event="PreviewMouseLeftButtonDown" Handler="OnItemMouseDown"/>
                </Style>
            </ListBox.ItemContainerStyle>
        </ListBox>

        <ItemsControl ItemsSource="{Binding Squares}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Rows="{Binding Rows}" Columns="{Binding Columns}"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Border BorderBrush="DarkGray" BorderThickness="1"
                            Background="#05FFFFFF" AllowDrop="True"
                            Drop="OnDrop">
                        <TextBlock VerticalAlignment="Center"
                                   HorizontalAlignment="Center"
                                   Text="{Binding Value}"/>
                    </Border>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </DockPanel>
</Window>

代码背后:

 public partial class SquaresGameSample : Window
    {
        public SquaresGameSample()
        {
            InitializeComponent();
            DataContext = new SquaresGameViewModel();
        }

        private void OnDrop(object sender, DragEventArgs e)
        {
            var item = sender as FrameworkElement;
            if (item == null)
                return;

            var square = item.DataContext as Square;
            if (square == null)
                return;

            var number = (int)e.Data.GetData(typeof (int));
            square.Value = number;
        }

        private void OnItemMouseDown(object sender, MouseEventArgs e)
        {
            var item = sender as ListBoxItem;
            if (item == null)
                return;

            DragDrop.DoDragDrop(sender as DependencyObject, item.DataContext, DragDropEffects.Move);
        }
    }

视图模型:

 public class SquaresGameViewModel: PropertyChangedBase
    {
        private ObservableCollection<Square> _squares;
        public ObservableCollection<Square> Squares
        {
            get { return _squares ?? (_squares = new ObservableCollection<Square>()); }
        }

        private int _rows;
        public int Rows
        {
            get { return _rows; }
            set
            {
                _rows = value;
                OnPropertyChanged("Rows");
                CreateSquares();
            }
        }

        private int _columns;
        public int Columns
        {
            get { return _columns; }
            set
            {
                _columns = value;
                OnPropertyChanged("Columns");
                CreateSquares();
            }
        }

        public List<int> Numbers { get; set; }

        public SquaresGameViewModel()
        {
            _rows = 10;
            _columns = 10;
            Numbers = Enumerable.Range(1, 20).ToList();
            CreateSquares();
        }

        private void CreateSquares()
        {
            Squares.Clear();

            Enumerable.Range(0, Rows)
                      .SelectMany(x => Enumerable.Range(0, Columns)
                                                 .Select(y => new Square { Row = x, Column = y }))
                      .ToList().ForEach(Squares.Add);
        }
    }

数据项:

public class Square: PropertyChangedBase
{
    public int Row { get; set; }

    public int Column { get; set; }

    private int _value;
    public int Value
    {
        get { return _value; }
        set
        {
            _value = value;
            OnPropertyChanged("Value");
        }
    }
}

PropertyChangedBase(MVVM Helper类):

    public class PropertyChangedBase:INotifyPropertyChanged
    {
        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));
                                                                     }));
        }
    }

结果:

• 单击并拖动左侧的数字并将其放在任何方格上.号码将被放置在广场内.
• 移动滑块并注意UniformGrid行和列的变化情况.全部通过DataBinding.
• 无需在代码中创建或操作UI元素.一切都是通过DataBinding完成的.
• 分辨率独立.这就是WPF提供的.一切都被拉伸到包含窗口大小.
• MVVM = "简单,简单的属性和INotifyPropertyChanged".这就是如何在WPF中编程.不需要复杂的事件"听众"(无论是什么)或任何像这样的蹩脚的东西.
• 只需复制并粘贴我的代码,File -> New -> WPF Application然后自己查看结果.
• 如果您需要进一步的帮助,请告诉我.
• WPF Rocks.其他一切都不会或完全糟糕.