在网格中获取按钮位置答案

【问题标题】：Take Button's positon in a Grid在网格中获取按钮位置
【发布时间】：2015-11-28 14:43:00
【问题描述】：

我有一个 5x4 的网格，我在其中放置按钮，稍后我将从中添加图片。我需要以某种方式知道这个按钮在这个网格中的位置，所以我可以用这个 Plus 图像替换添加的图片。或者如果我选择多张图片，要知道从哪个位置用它们填充网格。这是我的网格和模板：

  <Grid>
    <ItemsControl x:Name="myItems" >
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Grid HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,50,0,0" >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition  Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="1*" />
                        <RowDefinition Height="1*" />
                        <RowDefinition Height="1*" />
                        <RowDefinition Height="1*" />
                        <RowDefinition Height="1*" />
                    </Grid.RowDefinitions>
                </Grid>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Button Click="Add_Picture">

                <Border Width="100" Height="100" BorderThickness="1" BorderBrush="Black" Margin="3" Padding="5">
                    <!-- <Canvas Margin="-1,-1,0,0" Width="90" Height="90" Name="cCanvas" MouseDown="cCanvas_MouseDown">-->
                    <Canvas Margin="-1,-1,0,0" Width="90" Height="90" Name="cCanvas">
                        <Canvas.Background>
                            <ImageBrush Stretch="UniformToFill" ImageSource="{Binding ImagePath}"/>
                        </Canvas.Background>


                        <!-- <Grid Name="SquareSelectedIndicator" Visibility="{Binding  IsSelected, Converter={StaticResource BoolToVis}, FallbackValue=Hidden}" Width="30" Height="30" >-->

                    </Canvas>
                    <Border.Style>
                        <Style TargetType="{x:Type Border}">
                            <Setter Property="BorderBrush"
        Value="Black" />
                            <Style.Triggers>
                                <Trigger Property="IsMouseOver"
            Value="True">
                                    <Setter Property="BorderBrush"
            Value="Red" />
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </Border.Style>
                </Border>
                </Button>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

例如这里我要取 (x,y)。这可能吗？

【问题讨论】：

我唯一能想到的是在网格的元素上使用（可能是两级深度）foreach，您可以在其中比较元素是否具有某个属性（如名称），并获得匹配后的 Grid.Row 和 Grid.Column 属性
那么你想访问Add_Picture事件处理程序中的行和列索引吗？
是的，确切地说，对于调用事件的每个按钮。他的初始坐标

标签： c# wpf button grid

【解决方案1】：

我尝试了您的代码，但它没有生成您发布的视图。所有按钮都位于彼此上方的相同位置。

为了获得您发布的视图，我使用了 UniformGrid 作为 ItemsPanel，Columns 的值为 4。

        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <UniformGrid Columns="4" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>

知道这一点，您可以像这样使用 Add_Picture 处理程序：

    private void Add_Picture(object sender, RoutedEventArgs e)
    {
        Button clickedButton = sender as Button;
        if (clickedButton != null)
        {
            object displayedItem = clickedButton.DataContext;
            int index = this.myItems.Items.IndexOf(displayedItem);

            int x = index % 4;
            int y = index / 4;


            MessageBox.Show("x: " + x + " | y: " + y);
        }
    }

让我知道这是否适合您的需求。

【讨论】：