2015-07-16 4 views
0

Я пытаюсь создать простой (с точки зрения дизайна) экран, который позволит пользователям вводить несколько строк данных.WPF Binding TextBox width to grid column в поле списка

Формат экрана 4 колонки (TextBox, TextBox, ComboBox, TextBox), с новые строки добавляются динамически.

Я испробовал 2 подхода изначально - один использовал DataGrid, а другой - ListView.

DataGrid вызвало много головных болей с элементами, удерживающими фокус при их нажатии, и ListView не позволил мне получить постоянный доступ к базовой ячейке, вместо этого возвратив связанный объект данных, представленный этой строкой.

В моем текущем подходе используется пользовательский компонент, который представляет строку, и содержит объекты 3 TextBox и один объект ComboBox.

Один или несколько из этих объектов отображаются в ListBox.

Этот подход позволяет управлять событиями более последовательно, но визуально менее прост, чтобы работать.

В настоящее время, когда отображается строка, первые 3 колонны в grid (которые имеют четко определены width) дисплей хорошо, но textbox в последнем столбце не расширяется, чтобы заполнить доступную ширину.

Соответствующий код панели:

<DockPanel LastChildFill="True" Name="basePanel"> 
    <Grid x:Name="baseGrid"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="60" /> 
      <ColumnDefinition Width="60"></ColumnDefinition> 
      <ColumnDefinition Width="55"></ColumnDefinition> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <TextBox Name="txtYear" Grid.Column="0" Style="{StaticResource txtComponentStyle}" Text="{Binding Path=RatingYear, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}" /> 
     <TextBox Name="txtArrears" Grid.Column="1" Style="{StaticResource txtComponentStyle}" Text="{Binding Path=ArrearsAmount, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}" /> 
     <ComboBox Name="cmbChangeCode" Grid.Column="2" ItemsSource="{Binding Path=ChangeCodes, Mode=OneTime}" SelectedItem="{Binding Path=ChangeCode}" /> 
     <TextBox Name="txtComments" Grid.Column="3" Style="{StaticResource txtComponentStyle}" Text="{Binding Path=Comments, ValidatesOnDataErrors=True,UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Stretch" /> 
    </Grid> 
</DockPanel> 

Когда я выбираю строку в ListBox, можно увидеть, что сам объект заполняет всю ширину, но текстовое поле в последнем столбце расширяется только соответствовать содержимому.

Установка ширины в определении столбца до * следует (как я понимаю) вызвать столбец расширить до Fille доступного пространства, и установка HorizontalAlignment недвижимости на textbox Протянуть должен вызвать текстовое поле, чтобы заполнить столбец ,

Код ниже создает ListBox.

<UserControl.Resources> 
    <Style TargetType="{x:Type ListBoxItem}"> 
     <Setter Property="ContentTemplate"> 
      <Setter.Value> 
       <DataTemplate> 
        <Border BorderBrush="Black" BorderThickness="0.5" Margin="1"> 
         <DockPanel LastChildFill="True" HorizontalAlignment="Stretch" Background="DarkSlateBlue"> 
          <Controls:ArrearsListEntry /> 
         </DockPanel> 
        </Border> 
       </DataTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</UserControl.Resources> 
<DockPanel LastChildFill="True" Background="Red"> 
    <ListBox IsSynchronizedWithCurrentItem="True" Name="lstRowData" ItemsSource="{Binding Path=Rows}" /> 
</DockPanel> 

Есть ли способ связать ширину текстового поля к фактической ширины столбца, или свойство, которое заставит текстовое поле автоматически разворачивать к доступной ширине?

+0

Проверьте выравнивание внешних DockPanel. Содержимое ListBoxItem может быть выровнено по горизонтали, а не растянуто горизонтально. Установите Фон DockPanel как визуальный намек. – Clemens

+0

Нет нигде, я специально настраиваю содержимое элемента для выравнивания по левому краю, а изменение цветов фона на разных панелях не повлияло на выход. Для полноты я добавил XAML для ListBox (извинения, я должен был поставить его раньше). – Alex

ответ

1

Содержимое ListBoxItem по умолчанию выравнивается по левому краю. Добавить сеттер для HorizontalContentAlignment к вашему ListBoxItem Стиль:

<Style TargetType="ListBoxItem"> 
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
    <Setter Property="ContentTemplate"> 
     ... 
    </Setter> 
</Style> 
+0

Спасибо, это было именно то, что мне нужно. – Alex