vb@rchiv
VB Classic
VB.NET
ADO.NET
VBA
C#
Mails senden, abrufen und decodieren - ganz easy ;-)  
 vb@rchiv Quick-Search: Suche startenErweiterte Suche starten   Impressum  | Datenschutz  | vb@rchiv CD Vol.6  | Shop Copyright ©2000-2024
 
zurück
Rubrik: HTML/Internet/Netzwerk · HTML/Email   |   VB-Versionen: VB2005, VB200824.05.10
Grundkentnisse für einen einfachen HTML-Editor

In diesem Tipp wird demonstriert, wie man einen simplen HTML-Editor erstellt.

Autor:   Stefan ScholbeBewertung:     [ Jetzt bewerten ]Views:  13.385 
ohne HomepageSystem:  Win8, Win10, Win11 Beispielprojekt auf CD 

Wenn man einen HTML-Editor machen möchte, denkt man oftmals erst an das Syntax-Highlightning. Das ist jedoch nicht das einzige was ein HTML-Editor benötigt (nicht obligatorisch gemeint), denn auch eine einfache Unterstützung für z. B. Die Schriftstil-Auswahl ist oft angenehm (Ich spreche aus Erfahrung). Dies lässt sich über die Substring-Funktion sehr leicht anstellen.

Dafür benötigen wir:

  1. TextBox (Name = txtCode, MultiLine = True)
  2. Button (Name = btnBold, Text = „B", Font = Times New Roman; 9.75pt; style=Bold)
  3. Button (Name = btnItallic, Text = „I", Font = Times New Roman; 9.75pt; style=Italic)
  4. Button (Name = btnUnderline, Text = „U", Font = Times New Roman; 9.75pt; style=Underline)
  5. Button (Name = btnStrikeout,Text = „S", Font = Times New Roman; 9.75pt; style=Strikeout)
  6. WebBrowser (Name = wbrPreview)

Die WebBrowser Komponente dient dafür, den Quelltext grafisch anzuzeigen.

Wenn alles platziert ist, sollte die Form etwa etwa so aussehen:

Grundkenntnisse für einen einfachen HTML-Editor

Nun zum Code (kommentiert)

Public Class Form1
 
  Private Sub btnStrikeout_Click(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles btnUnderline.Click, btnStrikeout.Click, _
    btnItallic.Click, btnBold.Click
 
    ' Über CType wird eine Select-Routine gestartet
    Select Case CType(sender, Button).Text
      Case "B"
        With txtCode
          ' Der Text wird mit Substring "zerschnitten", und mit <b> am Start 
          ' sowie Ende des ausgewählten Bereich gesetzt
          .Text = .Text.Substring(0, .SelectionStart) & "<b>" & .SelectedText & "</b>" & _
            .Text.Substring(.SelectionStart + .SelectionLength, .Text.Length - _
            (.SelectionStart + .SelectionLength))
        End With
 
      Case "I"
        With txtCode
          ' Ebenfalls wie oben, jedoch Aufschrift "I" also wird <i> gesetzt
          .Text = .Text.Substring(0, .SelectionStart) & "<i>" & .SelectedText & "</i>" & _
            .Text.Substring(.SelectionStart + .SelectionLength, .Text.Length - _
            (.SelectionStart + .SelectionLength))
        End With
 
      Case "U"
        With txtCode
          ' Prinzip wie bei <i>
          .Text = .Text.Substring(0, .SelectionStart) & "<u>" & .SelectedText & "</u>" & _
            .Text.Substring(.SelectionStart + .SelectionLength, .Text.Length - _
            (.SelectionStart + .SelectionLength))
        End With
 
      Case "S"
        With txtCode
          ' Prinzip wie bei <i>
          .Text = .Text.Substring(0, .SelectionStart) & "<s>" & .SelectedText & "</s>" & _
            .Text.Substring(.SelectionStart + .SelectionLength, .Text.Length - _
            (.SelectionStart + .SelectionLength))
        End With
    End Select
  End Sub
 
  Private Sub txtCode_TextChanged(ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles txtCode.TextChanged
 
    ' Setzt den Text in den Quelltext des WebBrowsers
    wbrPreview.DocumentText = txtCode.Text
  End Sub
End Class

Selbstverständlich können sie z. B. eine ComboBox für die Schriftart, ein Farbdialog für die Schriftfarbe etc. hinzufügen. Dies lässt sich mit diesen Kentnissen leicht anstellen.

Ich hoffe ich konnte Ihnen helfen.
Viel Spass!