怎样才能做一个10×10可选元素的2D每个元素与文本在Windows窗体? 有这样一个简单的方法吗?
我需要在网格中以可订购的方式(索引)select一些元素,以便将新的位置发送给我的机器人。 我的意思是:第一:去第一个选定的网格元素(选中时标记为1)第二:去第二个选定的网格元素(选中时标记为2)…等等…
网格看起来像这样: 2d grid sof/c%23/GridType1.gif
我试图避免把100checkbox彼此靠近 …
把这个作为回答,因为OP要求:
<Window x:Class="MiscSamples.GridRobot" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="GridRobot" Height="500" Width="600"> <DockPanel> <DockPanel DockPanel.Dock="Top"> <TextBlock Text="Size:" Margin="2" DockPanel.Dock="Left"/> <TextBox Text="{Binding Size}" IsReadOnly="True" DockPanel.Dock="Left" Margin="2" Width="50"/> <Slider Maximum="20" Minimum="2" Value="{Binding Size}"/> </DockPanel> <StackPanel DockPanel.Dock="Left" Width="100" Margin="2"> <TextBlock Text="Route:" TextAlignment="Center" FontWeight="Bold"/> <ItemsControl ItemsSource="{Binding Route}"> <ItemsControl.ItemTemplate> <DataTemplate> <TextBlock TextAlignment="Center"> <TextBlock.Text> <MultiBinding StringFormat="{}{0:D2},{1:D2}"> <Binding Path="Row"/> <Binding Path="Column"/> </MultiBinding> </TextBlock.Text> </TextBlock> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> </StackPanel> <Grid> <ItemsControl ItemsSource="{Binding Squares}"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <UniformGrid Rows="{Binding Size}" Columns="{Binding Size}"/> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.ItemTemplate> <DataTemplate> <Border BorderBrush="DarkGray" BorderThickness="1"> <Button Command="{Binding DataContext.GoToCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}" CommandParameter="{Binding}"> <Button.Template> <ControlTemplate> <Border Background="#05FFFFFF"> <Viewbox> <TextBlock Text="{Binding PathIndex}" TextAlignment="Center" VerticalAlignment="Center"/> </Viewbox> </Border> </ControlTemplate> </Button.Template> </Button> </Border> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> <Canvas> <!-- I was about to add the Robot Peg here and animate it --> </Canvas> </Grid> </DockPanel> </Window>
代码背后:
public partial class GridRobot : Window { public GridRobot() { InitializeComponent(); DataContext = new GridRobotViewModel(); } }
查看模型:
public class GridRobotViewModel: PropertyChangedBase { private int _size; public int Size { get { return _size; } set { _size = value; OnPropertyChanged("Size"); CreateItems(); } } private ObservableCollection<GridItem> _squares; public ObservableCollection<GridItem> Squares { get { return _squares ?? (_squares = new ObservableCollection<GridItem>()); } } private ObservableCollection<GridItem> _route; public ObservableCollection<GridItem> Route { get { return _route ?? (_route = new ObservableCollection<GridItem>()); } } private void CreateItems() { Squares.Clear(); Route.Clear(); for (int i = 0; i < Size; i++) { for (int j = 0; j < Size; j++) { Squares.Add(new GridItem() {Row = i, Column = j}); } } } private Command<GridItem> _goToCommand; public Command<GridItem> GoToCommand { get { return _goToCommand ?? (_goToCommand = new Command<GridItem>(Goto){IsEnabled = true}); } } private void Goto(GridItem item) { if (item.PathIndex == null) { item.PathIndex = Squares.Max(x => x.PathIndex ?? 0) + 1; Route.Add(item); } } }
数据项:
public class GridItem: PropertyChangedBase { public int Row { get; set; } public int Column { get; set; } private int? _pathIndex; public int? PathIndex { get { return _pathIndex; } set { _pathIndex = value; OnPropertyChanged("PathIndex"); } } }
支持MVVM的类:
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)); })); } } public class Command<T>: ICommand { public Action<T> Action { get; set; } public void Execute(object parameter) { if (Action != null && parameter is T) Action((T)parameter); } public bool CanExecute(object parameter) { return IsEnabled; } private bool _isEnabled; public bool IsEnabled { get { return _isEnabled; } set { _isEnabled = value; if (CanExecuteChanged != null) CanExecuteChanged(this, EventArgs.Empty); } } public event EventHandler CanExecuteChanged; public Command(Action<T> action) { Action = action; } }
结果:
File -> New Project -> WPF Application
然后查看结果。