ListViewのViewプロパティをGridViewにして使ってみるとすぐ気になることがある。
ちょっとお洒落してTextBoxとかをカラムに表示したときに、TextBoxのサイズがTextBoxのコンテンツの幅になってしまう。
ためしに、PersonクラスをListViewに表示してみる。
↓がPersonクラスのコードと、それを表示するためにWindow1.xaml
Personクラスとそのコレクション
namespace ColmunWidth
{
public class Person : INotifyPropertyChanged
{
#region IDプロパティ
private int id;
public int ID
{
get { return id; }
set
{
id = value;
OnPropertyChanged("ID");
}
}
#endregion
#region Nameプロパティ
private string name;
public string Name
{
get { return name; }
set
{
name = value;
OnPropertyChanged("Name");
}
}
#endregion
#region INotifyPropertyChanged メンバ
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
#endregion
}
public class PersonCollection : ObservableCollection<Person>
{
}
}
Window1.xaml
<Window x:Class="ColmunWidth.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:p="clr-namespace:ColmunWidth"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<p:PersonCollection x:Key="People">
<p:Person ID="1" Name="太郎" />
<p:Person ID="2" Name="二郎" />
<p:Person ID="3" Name="三郎" />
</p:PersonCollection>
</Window.Resources>
<DockPanel>
<ListView ItemsSource="{StaticResource People}">
<ListView.View>
<GridView>
<GridViewColumn Header="ID">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Text="{Binding Path=ID}" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="名前">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Text="{Binding Path=Name}" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
</DockPanel>
</Window>
これを実行すると悲しい事になる。
実行直後
カラムのサイズを変えてもテキストボックスの大きさが変わらないorz
普通の感覚だと、テキストボックスのサイズはカラムのサイズに応じてリサイズしてほしい。
そのためには、ListViewのItemContainerStyleでListViewItemのHorizontalContentAlignmentにStretchを設定してやる必要がある。
ってことで、XAMLを書き換え。
Window1.xaml要点のみ
<Window x:Class="ColmunWidth.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:p="clr-namespace:ColmunWidth"
Title="Window1" Height="300" Width="300">
...省略...
<ListView ItemsSource="{StaticResource People}">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
...省略...
</ListView>
</DockPanel>
</Window>
実行してみると、テキストボックスの幅がListViewのカラムの幅に応じて変わるようになる。
実行直後
テキストボックスの幅が変わる！
満足満足。