wake-up-neo.com

Wie implementiere ich ein Textfeld, in dem "Hier eingeben" angezeigt wird?

Das Anzeigen von " Geben Sie hier to ... " ein, bis der Benutzer Text in eine TextBox eingibt, ist heutzutage eine bekannte Verwendbarkeitsfunktion. Wie würde man diese Funktion in C # implementieren?

Meine Idee ist es, OnTextChanged zu überschreiben, aber die Logik, mit der Textänderungen von und nach " Type here " vorgenommen werden, ist etwas schwierig.

Das Anzeigen von " Type here " bei der Initialisierung und das Entfernen bei der ersten Eingabe ist einfach, aber ich möchte die Nachricht jedes Mal anzeigen, wenn der eingegebene Text leer wird.

33
mafu

Was Sie suchen, ist ein Textfeld mit "Wasserzeichen"

Es gibt eine Beispielimplementierung für C # hier

Ich hoffe es hilft

23
Marcos Placona

Etwas, das für mich funktioniert hat:

this.waterMarkActive = true;
this.textBox.ForeColor = Color.Gray;
this.textBox.Text = "Type here";

this.textBox.GotFocus += (source, e) =>
  {
    if (this.waterMarkActive)
    {
      this.waterMarkActive = false;
      this.textBox.Text = "";
      this.textBox.ForeColor = Color.Black;
    }
  };

this.textBox.LostFocus += (source, e) =>
  {
    if (!this.waterMarkActive && string.IsNullOrEmpty(this.textBox.Text))
    {
      this.waterMarkActive = true;
      this.textBox.Text = "Type here";
      this.textBox.ForeColor = Color.Gray;
    }
  };

Dabei ist bool waterMarkActive eine Klassenmitgliedsvariable und textBox die TextBox. Dies sollte jedoch wahrscheinlich gekapselt sein :) Es gibt möglicherweise einige Probleme mit diesem Ansatz, aber mir sind zurzeit keine bekannt.

Ich habe kürzlich entdeckt, dass Windows Wasserzeichen in Textfeldern unterstützt. Sie werden Cue-Banner genannt (siehe hier ). Es ist sehr einfach zu implementieren:

// Within your class or scoped in a more appropriate location:
[DllImport("user32.dll")]
private static extern IntPtr SendMessage(IntPtr hWnd, int Msg, int wParam, [MarshalAs(UnmanagedType.LPWStr)] string lParam);

// In your constructor or somewhere more suitable:
SendMessage(textBox.Handle, 0x1501, 1, "Please type here.");

Wenn textBox eine Instanz von TextBox ist, ist 0x1501 der Code für die Windows-Nachricht EM_SETCUEBANNER, kann wParam entweder TRUE (nicht null) oder FALSE (null) sein und lParam ist das anzuzeigende Wasserzeichen. wParam gibt an, wann das Cue-Banner angezeigt werden soll; Wenn TRUE eingestellt ist, wird das Cue-Banner angezeigt, auch wenn das Steuerelement den Fokus hat.

36
Pooven

Basierend auf der Antwort von @Pooven (danke!), Habe ich diese Klasse erstellt. Funktioniert bei mir.

/// <summary>
/// A textbox that supports a watermak hint.
/// </summary>
public class WatermarkTextBox : TextBox
{
    /// <summary>
    /// The text that will be presented as the watermak hint
    /// </summary>
    private string _watermarkText = "Type here";
    /// <summary>
    /// Gets or Sets the text that will be presented as the watermak hint
    /// </summary>
    public string WatermarkText
    {
        get { return _watermarkText; }
        set { _watermarkText = value; }
    }

    /// <summary>
    /// Whether watermark effect is enabled or not
    /// </summary>
    private bool _watermarkActive = true;
    /// <summary>
    /// Gets or Sets whether watermark effect is enabled or not
    /// </summary>
    public bool WatermarkActive
    {
        get { return _watermarkActive; }
        set { _watermarkActive = value; }
    }

    /// <summary>
    /// Create a new TextBox that supports watermak hint
    /// </summary>
    public WatermarkTextBox()
    {
        this._watermarkActive = true;
        this.Text = _watermarkText;
        this.ForeColor = Color.Gray;

        GotFocus += (source, e) =>
        {
            RemoveWatermak();
        };

        LostFocus += (source, e) =>
        {
            ApplyWatermark();
        };

    }

    /// <summary>
    /// Remove watermark from the textbox
    /// </summary>
    public void RemoveWatermak()
    {
        if (this._watermarkActive)
        {
            this._watermarkActive = false;
            this.Text = "";
            this.ForeColor = Color.Black;
        }
    }

    /// <summary>
    /// Applywatermak immediately
    /// </summary>
    public void ApplyWatermark()
    {
        if (!this._watermarkActive && string.IsNullOrEmpty(this.Text)
            || ForeColor == Color.Gray ) 
        {
            this._watermarkActive = true;
            this.Text = _watermarkText;
            this.ForeColor = Color.Gray;
        }
    }

    /// <summary>
    /// Apply watermak to the textbox. 
    /// </summary>
    /// <param name="newText">Text to apply</param>
    public void ApplyWatermark(string newText)
    {
        WatermarkText = newText;
        ApplyWatermark();
    }

}
8
Joel
  [DllImport("user32.dll", CharSet = CharSet.Auto)]
  private static extern Int32 SendMessage(IntPtr hWnd, int msg, int wParam, [MarshalAs(UnmanagedType.LPWStr)]string lParam);
  const int EM_SETCUEBANNER = 0x1501; 

  public Form1()
  {
      InitializeComponent();
      SendMessage(textBox1.Handle, EM_SETCUEBANNER, 1, "Username");
      SendMessage(textBox2.Handle, EM_SETCUEBANNER, 1, "Password");
  }

Ich lerne gerade erst C # in diesem Semester, also bin ich kein Experte, aber das hat für mich funktioniert: (Dies verwendet Windows-Formulare)

private void Form1_Load(object sender, EventArgs e)
{
    textBox1.SelectionStart = 0;  //This keeps the text
    textBox1.SelectionLength = 0; //from being highlighted
    textBox1.ForeColor = Color.Gray;
}

private void textBox_MouseMove(object sender, MouseEventArgs e)
{
    Cursor.Current = Cursors.IBeam; //Without this the mouse pointer shows busy
}

private void textBox1_KeyDown(object sender, KeyEventArgs e)
{
    if (textBox1.Text.Equals("Type here...") == true)
    {
        textBox1.Text = "";
        textBox1.ForeColor = Color.Black;
    }
}

private void textBox1_KeyUp(object sender, KeyEventArgs e)
{
    if (textBox1.Text.Equals(null) == true || textBox1.Text.Equals("") == true)
    {
        textBox1.Text = "Type here...";
        textBox1.ForeColor = Color.Gray;
    }
}
3
Michael Raatz

Behandeln Sie das verlorene Fokusereignis. Wenn die Eigenschaft Text leer ist, füllen Sie sie mit Ihrer Standardzeichenfolge.

1

Wenn dies ASP.NET ist (im Gegensatz zu winforms), können Sie Folgendes tun:

Wenn Sie jQuery verwenden, fügen Sie dies zu Ihrem Dokument (oder wie auch immer Sie Ihre Seite initialisieren) hinzu:

var $textbox = $("textbox selector"); // assumes you select a single text box
if ($textbox.val() == "") {
   $textbox.val("Type here to...");
   $textbox.one('focus', function() {
     $(this).attr('value', '');
   });
}

Sie müssen einige kleine Umgestaltungen vornehmen, wenn Sie mehr als ein Textfeld auswählen (fügen Sie die if-Anweisung in jedes Element ein).

1
macca1

In der letzten Version von C # hat das TextBox die Eigenschaft Placeholder Text, die alle Funktionen erfüllt. Sie müssen also nur "Type here ..." als Wert für diese Eigenschaft festlegen.

1
LuisDeveloper

Basierend auf der Antwort von @ Joel. Ich fixiere seine Klasse (Danke für die Basis!)

/// <summary>
/// A textbox that supports a watermak hint.
/// Based on: https://stackoverflow.com/a/15232752
/// </summary>
public class WatermarkTextBox : TextBox
{
    /// <summary>
    /// The text that will be presented as the watermak hint
    /// </summary>
    private string _watermarkText;

    /// <summary>
    /// Gets or Sets the text that will be presented as the watermak hint
    /// </summary>
    public string WatermarkText
    {
        get { return _watermarkText; }
        set { _watermarkText = value; }
    }

    /// <summary>
    /// Whether watermark effect is enabled or not
    /// </summary>
    private bool _watermarkActive;
    /// <summary>
    /// Gets or Sets whether watermark effect is enabled or not
    /// </summary>
    public bool WatermarkActive
    {
        get { return _watermarkActive; }
        set { _watermarkActive = value; }
    }

    /// <summary>
    /// Create a new TextBox that supports watermak hint
    /// </summary>
    public WatermarkTextBox()
    {
        this.WatermarkActive = _watermarkActive;
        this.Text = _watermarkText;
    }

    protected override void OnCreateControl()
    {
        base.OnCreateControl();
        if (this.WatermarkActive)
            CheckWatermark();
    }

    protected override void OnGotFocus(EventArgs e)
    {
        base.OnGotFocus(e);
        CheckWatermark();
    }

    protected override void OnLostFocus(EventArgs e)
    {
        base.OnLostFocus(e);
        CheckWatermark();
    }        

    public void CheckWatermark()
    {
        if ((this.WatermarkActive) && String.IsNullOrWhiteSpace(this.Text))
        {
            ForeColor = Color.Gray;
            this.Text = _watermarkText;
        }
        else if ((this.WatermarkActive) && (!String.IsNullOrWhiteSpace(this.Text)))
        {
            if (this.Text == _watermarkText)
                this.Text = "";
            ForeColor = Color.Black;
        }
        else
            ForeColor = Color.Black;
    }
}
0
K1988

Sie können die Zeichenfolge "Geben Sie hier" in den Textfeldhintergrund ein, bis sie leer ist

0
Nagg

"Here here to ..." anzeigen, bis der Benutzer Text in eine TextBox eingibt, ist heutzutage eine bekannte Usability-Funktion. Wie würde man diese Funktion in C # implementieren?

  1. Setze textbox.text als "Typ here to ..."

  2. erstellen Sie ein Ereignis, sagen Sie box_click ()

  3. -> Fügen Sie diesen Code in Ihre Methode ein

    private void box_Click(object sender, EventArgs e)
    {
        Textbox b = (Textbox)sender;
        b.Text = null;
    }
    
  4. weisen Sie diese Methode jetzt dem "Enter" -Ereignis Ihres Textfelds zu (möglicherweise ein oder mehrere).

0

Basierend auf der Antwort von Ahmed Soliman Flasha verwenden Sie folgende Klasse:

public class TextBoxHint : TextBox
{
    string _hint;

    [Localizable(true)]
    public string Hint
    {
        get { return _hint; }
        set { _hint = value; OnHintChanged(); }
    }

    protected virtual void OnHintChanged()
    {
        SendMessage(this.Handle, EM_SETCUEBANNER, 1, _hint);
    }     

    const int EM_SETCUEBANNER = 0x1501;

    [DllImport("user32.dll", CharSet = CharSet.Auto)]
    private static extern Int32 SendMessage(IntPtr hWnd, int msg, int wParam, [MarshalAs(UnmanagedType.LPWStr)]string lParam);
}
0
Tomas Kubes

Wenn dies für ASP.NET ist, können Sie TextBoxWatermark ausprobieren.

Wenn dies für Windows Forms gilt, wird dies in SO bereits here beantwortet.

0
Ashish Gupta

PRODUKTIERT ÄHNLICHE ERGEBNISSE IN HTML-WASSERZEICHEN

Hier ist mein Code für Textfeld "Wasserzeichen" oder "Vorschau" -Text - funktioniert super! Verwenden der Windows Forms-Anwendung.

NOTE: Dieses Beispiel enthält 3 Textfelder, von denen jedes die unten stehende Methode für das Ereignis "Maus verlassen" bzw. "Maus eingeben" hat.

private void textBoxFav_Leave(object sender, EventArgs e) {
  TextBox textbox = (TextBox)sender;
  if (String.IsNullOrWhiteSpace(textbox.Text)) {
    textbox.ForeColor = Color.Gray;
    if (textbox.Name == "textBoxFavFood") {
      textbox.Text = "Favorite Food";
    }
    else if (textbox.Name == "textBoxFavDrink") {
      textbox.Text = "Favorite Drink";
    }
    else if (textbox.Name == "textBoxFavDesert") {
      textbox.Text = "Favorite Desert";
    }
  }
  else {
    textbox.ForeColor = Color.Black;
  }
}

private void textBoxFav_Enter(object sender, EventArgs e) {
  TextBox textbox = (TextBox)sender;
  if (textbox.Text == "Favorite Food" || textbox.Text == "Favorite Drink" || textbox.Text == "Favorite Desert") {
    textbox.Text = "";
    textbox.ForeColor = Color.Black;
  }
}
0
Cordell

Warum OnTextChanged verwenden? Ich würde vorschlagen, den Text "Type here" zu entfernen, wenn das Textfeld den Fokus erhält . Wenn das Steuerelement den Fokus verliert und kein Text eingegeben wird, können Sie den Text erneut anzeigen.

Gleiches Ergebnis und keine knifflige Logik.

0
lboshuizen

Wenn Sie verhindern möchten, dass die Größe und Probleme der Datenbindung kontrolliert werden und der Code einfacher wird (ok, das ist fragwürdig), können Sie einfach eine Bezeichnung verwenden und die Sichtbarkeit umschalten. Dann 

    private void FilterComboBox_GotFocus(object sender, EventArgs e)
    {
        FilterWatermarkLabel.Visible = false;
    }

    private void FilterComboBox_LostFocus(object sender, EventArgs e)
    {
        if (!FilterWatermarkLabel.Visible && string.IsNullOrEmpty(FilterComboBox.Text))
        {
            FilterWatermarkLabel.Visible = true;
        }
    }

Ein weiterer Ansatz für Bilder und das Vermeiden von Datenbindungsproblemen ist hier https://msdn.Microsoft.com/en-us/library/bb613590(v=vs.100).aspx

0
Empus