如何实现带可编辑第二列的双列ListView以配置游戏服务器参数

Hey there! Let’s figure out how to make that second column in your ListView editable for your game server config tool—this is a super common scenario, so I’ve got a few practical approaches depending on what framework you’re working with.

Core Idea First #

Most default ListView controls don’t support editable cells out-of-the-box for specific columns, so the key is either:

• Triggering an embedded input control (like a TextBox) when the user interacts with the second column, then saving the input back to the ListView.
• Switching to a control that natively supports editable cells (often easier if you don’t have strict requirements to use ListView).

If You’re Using WinForms #

Option 1: Custom Editable Cells for ListView

You can manually spawn a TextBox when the user double-clicks the second column, then handle saving the input when they’re done. Here’s a quick implementation:

First, declare a TextBox variable at the form level:

private TextBox _editTextBox;

Then hook up the MouseDoubleClick event for your ListView:

private void configListView_MouseDoubleClick(object sender, MouseEventArgs e)
{
    var hitTestResult = configListView.HitTest(e.X, e.Y);
    
    // Make sure we clicked the second column (index 1)
    if (hitTestResult.SubItem != null && hitTestResult.Item.SubItems.IndexOf(hitTestResult.SubItem) == 1)
    {
        _editTextBox = new TextBox();
        _editTextBox.Text = hitTestResult.SubItem.Text;
        _editTextBox.Bounds = hitTestResult.SubItem.Bounds;
        
        // Handle saving when the user hits Enter or clicks away
        _editTextBox.KeyPress += EditTextBox_KeyPress;
        _editTextBox.LostFocus += EditTextBox_LostFocus;
        
        configListView.Controls.Add(_editTextBox);
        _editTextBox.Focus();
        _editTextBox.SelectAll();
    }
}

private void EditTextBox_KeyPress(object sender, KeyPressEventArgs e)
{
    if (e.KeyChar == (char)Keys.Enter)
    {
        SaveEditValue();
    }
}

private void EditTextBox_LostFocus(object sender, EventArgs e)
{
    SaveEditValue();
}

private void SaveEditValue()
{
    if (configListView.SelectedItems.Count > 0)
    {
        configListView.SelectedItems[0].SubItems[1].Text = _editTextBox.Text;
    }
    configListView.Controls.Remove(_editTextBox);
    _editTextBox.Dispose();
}

Option 2: Switch to DataGridView (Easier!)

If you don’t strictly need a ListView, the DataGridView control is built for this. Just:

• Add a DataGridView to your form, set two columns with headers "Config" and "Value".
• Set dataGridView1.Columns[1].ReadOnly = false; (keep the first column read-only if needed).
• Populate it with your config items—users can directly edit the second column without any extra code.

If You’re Using WPF #

WPF’s ListView lets you define templates for view and edit modes directly in XAML. Here’s how to set it up:

First, create a simple data class for your config items (make sure to implement INotifyPropertyChanged so changes update the UI):

public class ConfigItem : INotifyPropertyChanged
{
    private string _name;
    private string _value;

    public string Name
    {
        get => _name;
        set { _name = value; OnPropertyChanged(); }
    }

    public string Value
    {
        get => _value;
        set { _value = value; OnPropertyChanged(); }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

Then in your XAML, define the ListView with cell templates:

<ListView ItemsSource="{Binding ConfigItems}">
    <ListView.View>
        <GridView>
            <!-- Read-only Config column -->
            <GridViewColumn Header="Config" DisplayMemberBinding="{Binding Name}" />
            
            <!-- Editable Value column -->
            <GridViewColumn Header="Value">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Value}" />
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
                <GridViewColumn.CellEditingTemplate>
                    <DataTemplate>
                        <TextBox Text="{Binding Value, UpdateSourceTrigger=LostFocus}" />
                    </DataTemplate>
                </GridViewColumn.CellEditingTemplate>
            </GridViewColumn>
        </GridView>
    </ListView.View>
</ListView>

Bind your ListView to an ObservableCollection<ConfigItem> in your view model, and users can double-click the second column to edit—changes will automatically save back to your data object.

If You’re Using Qt (C++) #

Similar to WinForms, using QTableWidget is the easiest path:

// Initialize the table
ui->configTable->setColumnCount(2);
ui->configTable->setHorizontalHeaderLabels({"Config", "Value"});

// Add a config row example
int row = ui->configTable->rowCount();
ui->configTable->insertRow(row);
ui->configTable->setItem(row, 0, new QTableWidgetItem("MaxPlayers"));

// Make the second column editable
QTableWidgetItem* valueItem = new QTableWidgetItem("16");
valueItem->setFlags(valueItem->flags() | Qt::ItemIsEditable);
ui->configTable->setItem(row, 1, valueItem);

If you must use QListView, you’ll need a custom QStyledItemDelegate to handle editing for the second column—override createEditor(), setEditorData(), and setModelData() to manage the TextBox interaction.

Quick Recommendation #

Unless you have a specific reason to stick with ListView, go with the control that natively supports editable cells (DataGridView, WPF DataGrid, QTableWidget). It’ll save you time on edge cases like focus handling, validation, and layout.

内容的提问来源于stack exchange，提问作者Ignacio Copparoni