如何在WPF 表格中嵌套按钮

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术：WPF   表格嵌套按钮

撰写日期：2020年08月28日

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  一般在WPF中，表格中只是有表格数据，但今天我们来卡下如何在表格数据中添加button按钮，首先我们要在用户控件中写上表格中的表头字段如下：

     <!--表格数据-->

    <GroupBox Grid.Row="1" Header="竞争对手信息">

    <DataGrid x:Name="dgCorrival" IsReadOnly="False" AutoGenerateColumns="False" Background="White" CanUserResizeColumns="False" CanUserResizeRows="False" 

            SelectionMode="Single" Grid.Row="2" CanUserReorderColumns="False"AlternationCount="2"  RowHeaderWidth="0" CanUserAddRows="False" Grid.ColumnSpan="4">

           <DataGrid.Columns>

                <DataGridTemplateColumn Header="选择" Width="80">

                    <DataGridTemplateColumn.CellTemplate >

                        <DataTemplate>

                            <CheckBox x:Name="chk_Choose"></CheckBox>

                         </DataTemplate>

                        </DataGridTemplateColumn.CellTemplate>

                  </DataGridTemplateColumn>

   <DataGridTextColumn Header="竞争对手名称" Binding="{Binding CompetitorName}" Width="150"/>

    <DataGridTextColumn Header="日志ID" Binding="{Binding LogID}" Width="10" Visibility="Collapsed"/>

     <DataGridTextColumn Header="联系人" Binding="{Binding ClienteleName}" Width="100"/>

    <DataGridTextColumn Header="客户ID" Binding="{Binding ClienteleID}" Width="10" Visibility="Collapsed"/>

      <DataGridTextColumn Header="联系方式" Binding="{Binding Email}" Width="120"/>

       <DataGridTextColumn Header="所属销售机会" Binding="{Binding SalesOpportunity}" Width="150"/>

     <DataGridTextColumn Header="销售ID" Binding="{Binding MarketID}" Width="10" Visibility="Collapsed"/>

      <DataGridTextColumn Header="状态" Binding="{Binding StateName}" Width="100"/>

     <DataGridTextColumn Header="状态ID" Binding="{Binding StateID}" Width="10" Visibility="Collapsed"/>

       <DataGridTextColumn Header="可能性" Binding="{Binding PossibilityName}" Width="100"/>

         <DataGridTextColumn Header="可能性ID" Binding="{Binding PossibilityID}" Width="10" Visibility="Collapsed"/>

         <DataGridTextColumn Header="竞争时间" Binding="{Binding CompetitionTime,StringFormat=\{0:yyyy-MM-dd HH:mm:ss\}}" Width="150"/>

          <DataGridTextColumn Header="效果" Binding="{Binding Result}" Width="100"/>

          <DataGridTextColumn Header="竞争内容" Binding="{Binding CompetitiveContent}" Width="150"/>

   下图才是在表格数据中存放button的关键：首先用一个DataGridTemplateColumn 在最外面包裹着 接着是DataGridTemplateColumn.CellTemplate 再到DataTemplate 最后就是你要放的按钮了。

      <DataGridTemplateColumn Header="操作" Width="200">

          <DataGridTemplateColumn.CellTemplate >

              <DataTemplate>

               <WrapPanel>

                 <Button Content="[ 修改 ]" Style="{StaticResource btnOtherStyle}" Width="60" Name="btnUpdate" Click="btnUpdate_Click" Margin="2"/>

                   <Button Content="[ 删除 ]" Style="{StaticResource btnOtherStyle}" Width="60" Name="btnDelete" Click="btnDelete_Click" Margin="2"/>

                    </WrapPanel>

                    </DataTemplate>

             </DataGridTemplateColumn.CellTemplate>

          </DataGridTemplateColumn>

        </DataGrid.Columns>

   </DataGrid>

 </GroupBox>  

如果你没有给WrapPanel的话就只能放一个按钮，你放两个或两个以上它都会报错，如下图：

 

接下来就是你查询出表格数据后它会在你的表格里面，数据库中的查询方法如下：

 

再接着是服务端的查询方法,如下：

  //操作契约

  [OperationContract]

  //查询竞争对手信息

     public DataSet UserControl_SelectCorrival()

        {

            SqlParameter[] mySelectCorrival = {

              new SqlParameter("@type",SqlDbType.Char), };

        mySelectCorrival[0].Value = "UserControl_SelectCorrival";

        DataSet myDataSet = myDAL.QueryDataSet("UC_SalesOpportunity", mySelectCorrival);

            return myDataSet;  }

发布服务，去客户端更新服务，再写查询方法，如下：

 

然后运行就能看到你所需要的效果了：如下：

 

它同样也能实现按钮的操作，如修改按钮你点击它就会弹出所对应的窗口、同样删除也能实现对应的功能，如下：