在 C# 中将占位符添加到文本框

Syed Hassan Sabeeh Kazmi 2023年1月30日 2022年7月18日
  1. C# 中创建一个带有占位符文本的文本框
  2. 在 Visual Studio IDE 中使用 EnterLeave 焦点事件将占位符文本添加到 C# 中的文本框
  3. 在 Visual Studio 中安装 Bunifu UI 以在 C# 项目中添加带有占位符的文本框
在 C# 中将占位符添加到文本框

本教程将教授在 C# 中向文本框添加占位符的三种方法。由于占位符应被视为提示,因此它们不能替代 labelstitle

C# 中创建一个带有占位符文本的文本框

创建一个带有占位符文本的文本框,该文本框会消失并允许用户输入他们的文本,从而为开发人员提供了完全自定义的自由。此外,它允许你设置表单元素的占位符文本的样式。

通常,文本框包含占位符;当它被聚焦时,占位符将被删除,以便用户添加文本。如果文本框失去焦点并且用户没有输入任何文本,则占位符将添加回文本框。

以下 C# 代码将创建一个带有占位符的文本框。

Form1.Designer.cs

// `Form1` as your C# project form
// `Form1.Designer.cs` Code to create a `PlaceholderTxtB` textbox

namespace TextboxPlaceholder
{
    partial class Form1
    {

        private System.ComponentModel.IContainer components = null;

        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Windows Form Designer generated code

        private void InitializeComponent()
        {
            this.PlaceholderTxtB = new System.Windows.Forms.TextBox();
            this.button1 = new System.Windows.Forms.Button();
            this.SuspendLayout();
            //
            // PlaceholderTxtB
            //
            this.PlaceholderTxtB.Location = new System.Drawing.Point(12, 12);
            this.PlaceholderTxtB.Name = "PlaceholderTxtB";
            this.PlaceholderTxtB.Size = new System.Drawing.Size(188, 20);
            this.PlaceholderTxtB.TabIndex = 0;
            //
            // Create a `button1` button to lose focus from the `PlaceholderTxtB` textbox
            //
            this.button1.Location = new System.Drawing.Point(57, 39);
            this.button1.Name = "button1";
            this.button1.Size = new System.Drawing.Size(75, 23);
            this.button1.TabIndex = 1;
            this.button1.Text = "Focus";
            this.button1.UseVisualStyleBackColor = true;
            //
            // Form1
            //
            this.ClientSize = new System.Drawing.Size(284, 261);
            this.Controls.Add(this.button1);
            this.Controls.Add(this.PlaceholderTxtB);
            this.Name = "Form1";
            this.ResumeLayout(false);
            this.PerformLayout();

        }

        #endregion

        private System.Windows.Forms.TextBox PlaceholderTxtB;
        private System.Windows.Forms.Button button1;
    }
}

Form1.cs

// `Form1.cs` code to add a placeholder text to `PlaceholderTxtB` textbox

using System;
using System.Drawing;
using System.Windows.Forms;


namespace TextboxPlaceholder
{

    public partial class Form1 : Form
    {
        string ph = "Type your user name here...";

        public Form1()
        {

            InitializeComponent();
            PlaceholderTxtB.GotFocus += RemoveText;
            PlaceholderTxtB.LostFocus += AddText;

        }

        private void Form1_Load(object sender, EventArgs e)
        {

        }
        public void RemoveText(object sender, EventArgs e)
        {

            if (PlaceholderTxtB.Text == ph)
                PlaceholderTxtB.Text = "";
        }
        public void AddText(object sender, EventArgs e)
        {
            if (String.IsNullOrWhiteSpace(PlaceholderTxtB.Text))
            {
                PlaceholderTxtB.ForeColor = Color.Gray;
                PlaceholderTxtB.Text = ph;
            }
        }
    }
}

Form1 加载事件包含 InitializeComponent() 方法,该方法包含创建 PlaceholderTxtB 文本框的代码。在 Form1.cs 中,创建一个文本框的 .GotFocus.LostFocus 事件。

每当 PlaceholderTxtB 文本框获得焦点时,占位符文本将被删除。但是,当文本框失去用户焦点并保持为空时,占位符文本将重新出现。

在 Visual Studio IDE 中使用 EnterLeave 焦点事件将占位符文本添加到 C# 中的文本框

在 Visual Studio 中,表单的每个组件都有事件。对于文本框,你可以在 C# 项目表单的 Properties 下找到 Focus 事件。

使用 EnterLeave 事件为你的文本框创建一个占位符。

// `Form1.cs` code for `Enter Focus` and `Leave Focus` events to add a placeholder text to a `textBox1` textbox

string phd = "Password@123";

private void Enter_Focus(object sender, EventArgs e)
{
    //textBox1.ForeColor = Color.Gray;
    if (textBox1.Text == phd)
    textBox1.Text = "";
}

private void Leave_Focus(object sender, EventArgs e)
{
    textBox1.ForeColor = Color.Gray;
    if (textBox1.Text == "")
    textBox1.Text = phd;
}

textBox1.Text = phd 是输入为空时显示的占位符文本,并且用户失去文本框的焦点以建议可能的值。文本框的 Enter_FocusLeave_Focus 事件获取或设置控件没有文本且没有焦点时显示的占位符文本。

在 Visual Studio 中安装 Bunifu UI 以在 C# 项目中添加带有占位符的文本框

使用 NuGet 轻松安装和激活 Bunifu UI。在 Visual Studio IDE 中,NuGet 提供了一种更快、更轻松的无缝安装、激活和部署应用程序的方法。

要通过 NuGet Package Manager Console 安装 Bunifu UI,请运行:

Install-Package Bunifu.UI.WinForms

在你的 C# 项目中,转到工具并通过访问 NuGet 包管理器单击管理 NuGet 包以获取解决方案...。之后,你将看到 NuGet - 解决方案选项卡,导航其浏览部分并搜索 Bunifu

你将在搜索结果中找到 Bunifu.UI.WinForms 包并可以安装它。将其添加到你的 C# 项目以在 工具栏 选项卡中查看其控件列表。

它提供了一个带有预定义文本占位符的文本框。在 C# Visual Studio 项目的 Toolbox 中找到 BunifuTextBox,并将其拖到你的表单上。

通过修改其属性对其进行自定义,你将拥有一个带有占位符文本的文本框。

在本教程中,你学习了在文本框的文本区域中添加占位符文本的三种不同方法,以便为用户提供更清晰的界面。但是,如果没有其他任何东西标记你的文本框,消失的占位符可能会让你感到困惑。

幸运的是,使用本教程中的解决方案,占位符文本会一直保留到用户开始输入文本。内联占位符标识要在文本框中输入的信息,从而限制其可访问性。

Syed Hassan Sabeeh Kazmi avatar Syed Hassan Sabeeh Kazmi avatar

Hassan is a Software Engineer with a well-developed set of programming skills. He uses his knowledge and writing capabilities to produce interesting-to-read technical articles.

GitHub

相关文章 - Csharp Textbox

相关文章 - Csharp GUI