Back to Details

syncfusion-winforms-button-edit

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Implementing Syncfusion WinForms ButtonEdit

实现Syncfusion WinForms ButtonEdit

The ButtonEdit control embeds a text box with customizable child buttons to create interfaces like file browsers, dropdown controls, or specialized input controls. It combines text input capability with actionable buttons.
ButtonEdit控件内嵌了文本框和可自定义的子按钮，可用于构建文件浏览器、下拉控件或专用输入控件等界面，兼具文本输入能力与可操作按钮功能。

When to Use This Skill

何时使用本教程

  • File/folder browser UI: Create dialogs with browse buttons
  • Custom dropdown input: Build dropdown or selection controls
  • Date/time picker: Implement date picker with calendar button
  • Multi-button text fields: Create input with multiple action buttons (clear, calculate, search, etc.)
  • Specialized data input: Currency, percentage, or validated text input with action buttons
  • Dynamic button arrangement: Position buttons left or right of textbox
  • 文件/文件夹浏览器UI： 创建带浏览按钮的对话框
  • 自定义下拉输入： 构建下拉或选择控件
  • 日期/时间选择器： 实现带日历按钮的日期选择器
  • 多按钮文本字段： 创建带多个操作按钮（清除、计算、搜索等）的输入框
  • 专用数据输入： 带操作按钮的货币、百分比或校验文本输入
  • 动态按钮排列： 将按钮放置在文本框的左侧或右侧

Documentation & Navigation Guide

文档与导航指南

Getting Started

入门

📄 Read: references/getting-started.md
  • Assembly deployment and NuGet setup
  • Creating ButtonEdit in Visual Studio designer
  • Adding ButtonEdit programmatically
  • Embedding custom textbox types
  • Adding child buttons to collection
📄 阅读： references/getting-started.md
  • 程序集部署与NuGet设置
  • 在Visual Studio设计器中创建ButtonEdit
  • 以编程方式添加ButtonEdit
  • 内嵌自定义文本框类型
  • 向集合中添加子按钮

Appearance & Styling

外观与样式

📄 Read: references/appearance-styling.md
  • Visual styles and button styles (Office2007, Office2016, Metro, etc.)
  • Custom colors and Office color schemes
  • Border styles and customization
  • Size constraints (MinimumSize, MaximumSize)
  • Font and foreground colors
  • Text casing options
📄 阅读： references/appearance-styling.md
  • 视觉样式与按钮样式（Office2007、Office2016、Metro等）
  • 自定义颜色与Office配色方案
  • 边框样式与自定义
  • 尺寸约束（MinimumSize、MaximumSize）
  • 字体与前景色
  • 文本大小写选项

Child Button Customization

子按钮自定义

📄 Read: references/child-button-customization.md
  • Button types and border styles
  • Button alignment (Left/Right positioning)
  • Image and text settings
  • Flat style configuration
  • Focus and tab navigation
  • Hiding buttons at runtime
📄 阅读： references/child-button-customization.md
  • 按钮类型与边框样式
  • 按钮对齐（左/右定位）
  • 图片与文本设置
  • 扁平化样式配置
  • 焦点与Tab导航
  • 运行时隐藏按钮

Events & Interaction

事件与交互

📄 Read: references/events-and-interaction.md
  • ButtonClicked event handling
  • Border property change events
  • Child button click events
  • Mouse events (MouseDown, MouseUp, MouseEnter, MouseLeave, MouseHover)
  • Complete calendar picker example
📄 阅读： references/events-and-interaction.md
  • ButtonClicked事件处理
  • 边框属性变更事件
  • 子按钮点击事件
  • 鼠标事件（MouseDown、MouseUp、MouseEnter、MouseLeave、MouseHover）
  • 完整的日历选择器示例

Quick Start

快速入门

csharp
// Add ButtonEdit through code
using Syncfusion.Windows.Forms.Tools;

public Form1()
{
    InitializeComponent();
    
    // Create ButtonEdit control
    ButtonEdit buttonEdit = new ButtonEdit();
    buttonEdit.Location = new Point(50, 50);
    buttonEdit.Size = new Size(250, 21);
    buttonEdit.Name = "buttonEdit1";
    this.Controls.Add(buttonEdit);
    
    // Add child button
    ButtonEditChildButton childButton = new ButtonEditChildButton();
    childButton.Text = "Browse";
    childButton.ButtonAlign = ButtonAlignment.Right;
    buttonEdit.Buttons.Add(childButton);
    
    // Handle button click
    buttonEdit.ButtonClicked += (s, e) => 
    {
        MessageBox.Show("Button clicked!");
    };
}
csharp
// Add ButtonEdit through code
using Syncfusion.Windows.Forms.Tools;

public Form1()
{
    InitializeComponent();
    
    // Create ButtonEdit control
    ButtonEdit buttonEdit = new ButtonEdit();
    buttonEdit.Location = new Point(50, 50);
    buttonEdit.Size = new Size(250, 21);
    buttonEdit.Name = "buttonEdit1";
    this.Controls.Add(buttonEdit);
    
    // Add child button
    ButtonEditChildButton childButton = new ButtonEditChildButton();
    childButton.Text = "Browse";
    childButton.ButtonAlign = ButtonAlignment.Right;
    buttonEdit.Buttons.Add(childButton);
    
    // Handle button click
    buttonEdit.ButtonClicked += (s, e) => 
    {
        MessageBox.Show("Button clicked!");
    };
}

Common Patterns

常用模式

File Browser Pattern

文件浏览器模式

Create a file browser using ButtonEdit with a browse button that opens FolderBrowserDialog:
csharp
ButtonEdit folderEdit = new ButtonEdit();
ButtonEditChildButton browseBtn = new ButtonEditChildButton();
browseBtn.Text = "...";
folderEdit.Buttons.Add(browseBtn);

folderEdit.ButtonClicked += (s, e) => 
{
    FolderBrowserDialog dialog = new FolderBrowserDialog();
    if (dialog.ShowDialog() == DialogResult.OK)
    {
        folderEdit.TextBox.Text = dialog.SelectedPath;
    }
};
使用带浏览按钮的ButtonEdit创建文件浏览器，点击按钮可打开FolderBrowserDialog：
csharp
ButtonEdit folderEdit = new ButtonEdit();
ButtonEditChildButton browseBtn = new ButtonEditChildButton();
browseBtn.Text = "...";
folderEdit.Buttons.Add(browseBtn);

folderEdit.ButtonClicked += (s, e) => 
{
    FolderBrowserDialog dialog = new FolderBrowserDialog();
    if (dialog.ShowDialog() == DialogResult.OK)
    {
        folderEdit.TextBox.Text = dialog.SelectedPath;
    }
};

Multi-Button Input Pattern

多按钮输入模式

Multiple buttons with different actions on same control:
csharp
ButtonEdit inputEdit = new ButtonEdit();

// Clear button (left)
ButtonEditChildButton clearBtn = new ButtonEditChildButton();
clearBtn.Text = "C";
clearBtn.ButtonAlign = ButtonAlignment.Left;
inputEdit.Buttons.Add(clearBtn);

// Calculate button (right)
ButtonEditChildButton calcBtn = new ButtonEditChildButton();
calcBtn.Text = "=";
calcBtn.ButtonAlign = ButtonAlignment.Right;
inputEdit.Buttons.Add(calcBtn);

inputEdit.ButtonClicked += (s, e) => 
{
    if (e.ClickedButton == clearBtn)
        inputEdit.TextBox.Text = string.Empty;
    else if (e.ClickedButton == calcBtn)
        inputEdit.TextBox.Text = "Calculate...";
};
同一控件上的多个按钮对应不同操作：
csharp
ButtonEdit inputEdit = new ButtonEdit();

// Clear button (left)
ButtonEditChildButton clearBtn = new ButtonEditChildButton();
clearBtn.Text = "C";
clearBtn.ButtonAlign = ButtonAlignment.Left;
inputEdit.Buttons.Add(clearBtn);

// Calculate button (right)
ButtonEditChildButton calcBtn = new ButtonEditChildButton();
calcBtn.Text = "=";
calcBtn.ButtonAlign = ButtonAlignment.Right;
inputEdit.Buttons.Add(calcBtn);

inputEdit.ButtonClicked += (s, e) =>
{
    if (e.ClickedButton == clearBtn)
        inputEdit.TextBox.Text = string.Empty;
    else if (e.ClickedButton == calcBtn)
        inputEdit.TextBox.Text = "Calculate...";
};

Custom Textbox Integration

自定义文本框集成

Replace default textbox with specialized textbox:
csharp
ButtonEdit buttonEdit = new ButtonEdit();

// Use specialized textbox
PercentTextBox percentBox = new PercentTextBox();
buttonEdit.TextBox = percentBox;
buttonEdit.Controls.Add(percentBox);

ButtonEditChildButton btn = new ButtonEditChildButton();
btn.Text = "%";
buttonEdit.Buttons.Add(btn);
用专用文本框替换默认文本框：
csharp
ButtonEdit buttonEdit = new ButtonEdit();

// Use specialized textbox
PercentTextBox percentBox = new PercentTextBox();
buttonEdit.TextBox = percentBox;
buttonEdit.Controls.Add(percentBox);

ButtonEditChildButton btn = new ButtonEditChildButton();
btn.Text = "%";
buttonEdit.Buttons.Add(btn);

Key Props & Configuration

核心属性与配置

PropertyPurpose
TextBoxEmbedded textbox control (can replace with custom textbox)
ButtonsCollection of ButtonEditChildButton controls
ButtonStyleVisual style (Office2007, Office2016, Metro, etc.)
UseVisualStyleEnable visual style rendering
Border3DStyleBorder appearance (Raised, Sunken, Flat, etc.)
ShowTextBoxShow/hide embedded textbox
MinimumSize / MaximumSizeSize constraints
CharacterCasingText casing (Upper, Lower, Normal)
Next Steps: Select a reference above based on what you need to implement, or start with "Getting Started" for setup instructions.
属性用途
TextBox内嵌的文本框控件（可替换为自定义文本框）
ButtonsButtonEditChildButton控件集合
ButtonStyle视觉样式（Office2007、Office2016、Metro等）
UseVisualStyle启用视觉样式渲染
Border3DStyle边框外观（Raised、Sunken、Flat等）
ShowTextBox显示/隐藏内嵌文本框
MinimumSize / MaximumSize尺寸约束
CharacterCasing文本大小写（Upper、Lower、Normal）
后续步骤： 根据你的实现需求选择上述参考文档，或者从「入门」部分开始查看设置说明。