在DataGrid Cell中安裝一個文本框和一個按鈕

我試圖安裝Textblock並在DataGrid單元格中有一個按鈕。 Textblock包含我的文本的一部分，當我點擊按鈕時，顯示一個對話框。我一般我的代碼看起來像下面的那個在DataGrid Cell中安裝一個文本框和一個按鈕

<DataGridTemplateColumn Header="Message" Width="Auto" MinWidth="60"> 
    <DataGridTemplateColumn.CellTemplate> 
     <DataTemplate> 
      <StackPanel Orientetion="Horrizontal"> 
       <TextBlock MinWidth="200" TextTrimming="CharacterEllipsis" Text="{Binding Text}" /> 
       <Button DockPanel.Dock="Right" Width="90" Margin="1" /> 
      </StackPanel> 
     </DataTemplate> 
    </DataGridTemplateColumn.CellTemplate> 
</DataGridTemplateColumn>

我希望按鈕始終在單元的較右側，並且它的寬度需要修復。 TextBlock需要是可變的，例如當我調整窗口的大小時，所以DataGrid,TextBlock也應該拉伸。

的問題是，我不能做到這一點的行爲/視圖。每個DataGrid線路上的TextBlock都有所不同，在某些情況下，按鈕不在小區的右側。

我試圖改變StackPanel到Grid或DockPanel但我仍不能得到理想的結果。

使用Grid

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition MinWidth="100" Width="*" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 

    <TextBlock Grid.Column="0" TextTrimming="CharacterEllipsis" Text="{Binding Text}" /> 
    <Button Grid.Column="1" Margin="1" /> 
</Grid>

有什麼想法可以分享？

來源

2015-11-13 Athafoud

你可以添加它的外觀圖像，它應該如何看？ – Domysee

@Domysee我添加了一些圖片。 – Athafoud

@Athafoud DockPanel或Grid應該可以工作。請發佈您嘗試的更改以及您看到的（新）問題。還要確保您的xaml更改反映在輸出中。 –

StackPanel並沒有真正的對齊到正確的概念。它儘可能地將元素堆疊起來。你可以解決這個問題以不同的方式，但是在這種情況下，使用DockPanel代替：

<DockPanel> 
    <Button DockPanel.Dock="Right" Width="90" Margin="1" /> 
    <TextBlock MinWidth="200" TextTrimming="CharacterEllipsis" Text="{Binding Text}" />  
</DockPanel>

注意，我搬到了TextBlock是DockPanel的最後一個子元素。 DockPanel，在佈置其他子元素之後，將剩餘空間分配給最後一個子元素（除非您指定LastChildFill=false）。在這種情況下，我們希望TextBlock佔用剩餘的空間。

UPDATE：根據上述評論，除了改變面板類型到DockPanel（或Grid），則可以使用DataGridTemplateColumn.Width爲固定值，而不是Auto。這將使與指定的，但用戶仍然可以修改與列的列負載，如果他們想：

<DataGridTemplateColumn Header="Message" Width="60" MinWidth="60">

來源

2015-11-13 18:04:38

我會設置一個靜態值的DataGridTemplateColumn.Width --IT可以渲染性能幫助。也可以在按鈕上設置尺寸，所以尺寸不適合文字。

這個工作對我來說（我用可視化的目的邊框）：

<Window ... 
     Title="MainWindow" Height="350" Width="525"> 
    <Window.Resources> 
     <DataTemplate DataType="{x:Type local:Model}" 
         x:Key="VmItem"> 
      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition /> 
        <ColumnDefinition Width="Auto" /> 
       </Grid.ColumnDefinitions> 
       <Border BorderBrush="Black" BorderThickness="1"> 
        <TextBlock Grid.Column="0" TextTrimming="CharacterEllipsis" Text="{Binding Original}" /> 
       </Border> 
       <Button Grid.Column="1" Margin="1" Content="{Binding Encoded}" MinWidth="90" MaxWidth="90"/> 
      </Grid> 
     </DataTemplate> 
    </Window.Resources> 
    <Grid> 
     <DataGrid ItemsSource="{Binding Items}" AutoGenerateColumns="False"> 
      <DataGrid.Columns> 
       <DataGridTemplateColumn Header="Message" CellTemplate="{StaticResource VmItem}" Width="300" MinWidth="100"/> 
      </DataGrid.Columns> 
     </DataGrid> 
    </Grid> 
</Window>

證明：

來源

2015-11-13 23:28:17 Kcvin

在DataGrid Cell中安裝一個文本框和一個按鈕

回答

相關問題