Procedura: creare un ListView con celle modificabili
Aggiornamento: novembre 2007
In questo esempio viene illustrato come creare un controllo ListView in una modalità di visualizzazione GridView che presenta celle modificabili.
Esempio
Per modificare le celle di un oggetto GridViewColumn in un oggetto GridView, definire un controllo personalizzato da utilizzare come CellTemplate della colonna.
Nell'esempio riportato di seguito viene illustrato un controllo personalizzato denominato EditBox che implementa due proprietà di dipendenza, Value e IsEditing. La proprietà Value archivia il valore di una cella. La proprietà IsEditing specifica se la cella è attualmente modificabile.
public class EditBox : Control
{
...
public static readonly DependencyProperty ValueProperty =
DependencyProperty.Register(
"Value",
typeof(object),
typeof(EditBox),
new FrameworkPropertyMetadata(null));
...
public static DependencyProperty IsEditingProperty =
DependencyProperty.Register(
"IsEditing",
typeof(bool),
typeof(EditBox),
new FrameworkPropertyMetadata(false));
...
}
Nell'esempio riportato di seguito viene creato un oggetto Style per il controllo EditBox.
<Style x:Key="{x:Type l:EditBox}" TargetType="{x:Type l:EditBox}" >
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type l:EditBox}">
<TextBlock x:Name="PART_TextBlockPart"
Text="{Binding Path=Value,RelativeSource =
{RelativeSource TemplatedParent}}">
</TextBlock>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Per creare un controllo TextBox per la modifica di una cella, implementare un oggetto Adorner. Nell'esempio riportato di seguito viene illustrato il costruttore per EditBoxAdorner.
internal sealed class EditBoxAdorner : Adorner
{
...
public EditBoxAdorner(UIElement adornedElement,
UIElement adorningElement): base(adornedElement)
{
_textBox = adorningElement as TextBox;
Debug.Assert(_textBox != null, "No TextBox!");
_visualChildren = new VisualCollection(this);
BuildTextBox();
}
...
}
Per determinare quando EditBox è modificabile, utilizzare eventi come MouseUp, MouseLeave o MouseEnter. Nell'esempio riportato di seguito viene illustrato il modo in cui il primo evento MouseUp ricevuto da EditBox seleziona EditBox, e il secondo evento MouseUp attiva la modalità di modifica per EditBox.
public class EditBox : Control
{
...
protected override void OnMouseUp(MouseButtonEventArgs e)
{
base.OnMouseUp(e);
if (e.ChangedButton == MouseButton.Right ||
e.ChangedButton == MouseButton.Middle)
return;
if (!IsEditing)
{
if (!e.Handled && (_canBeEdit || _isMouseWithinScope))
{
IsEditing = true;
}
//If the first MouseUp event selects the parent ListViewItem,
//then the second MouseUp event puts the EditBox in editing
//mode
if (IsParentSelected)
_isMouseWithinScope = true;
}
}
...
}
Nell'esempio riportato di seguito viene illustrato come utilizzare gli eventi MouseEnter e MouseLeave per determinare se una cella è idonea alla modifica.
public class EditBox : Control
{
...
protected override void OnMouseEnter(MouseEventArgs e)
{
base.OnMouseEnter(e);
if (!IsEditing && IsParentSelected)
{
_canBeEdit = true;
}
}
...
protected override void OnMouseLeave(MouseEventArgs e)
{
base.OnMouseLeave(e);
_isMouseWithinScope = false;
_canBeEdit = false;
}
...
}
Per definire un oggetto GridViewColumn che consenta la modifica, impostare la proprietà CellTemplate su un controllo EditBox. Nell'esempio riportato di seguito viene specificata la proprietà CellTemplate di un oggetto GridViewColumn come controllo EditBox.
<GridViewColumn Header="ID" Width="50" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<l:EditBox Height="25" Value="{Binding Path=EmployeeNumber}" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
Per l'esempio completo, vedere Esempio di ListView con funzionalità di modifica.