Du bist nicht angemeldet.

[VB.NET] Eigenes Form Design zeichnen

Lieber Besucher, herzlich willkommen bei: Visual-Basic-Forum VB-Paradise.de. Falls dies dein erster Besuch auf dieser Seite ist, lies bitte die Hilfe durch. Dort wird dir die Bedienung dieser Seite näher erläutert. Darüber hinaus solltest du dich registrieren, um alle Funktionen dieser Seite nutzen zu können. Benutze das Registrierungsformular, um dich zu registrieren oder informiere dich ausführlich über den Registrierungsvorgang. Falls du dich bereits zu einem früheren Zeitpunkt registriert hast, kannst du dich hier anmelden.

possible31776

Vieles könner xD

  • »possible31776« ist männlich
  • »possible31776« ist der Autor dieses Themas

Beiträge: 139

Dabei seit: 26. September 2010

Wohnort: Karlsruhe

Hilfreich-Bewertungen: 30

  • Private Nachricht senden

1

Donnerstag, 5. Januar 2012, 01:35

Eigenes Form Design zeichnen

Hallo erstmal.

Ich wollte schon immer eigene Controls. Bloß mit Pictureboxen wollte ich es nicht machen, weil es blöd aussieht und schlecht zu handhaben ist.
Also habe ich mal gegooglet und herausgefunden, wie man eigene Controls zeichnet.
Diese Technik kann man für alle Controls verwenden. (Form, Progressbar, Button, Textbox, etc)
Hier erkläre ich aber, wie man eine eigene Form zeichnet.

Und da schon viele hier gefragt haben, habe ich mal ein Tut dafür gemacht.
In den Spoilern ist der jeweilige abschnitt.
ACHTUNG!!! Copy&Paste wird hier nicht unterstützt. Ich erkläre alles, damit ihr was lernt!!!!!

Schritt 1:
Als erstes erstellen wir ein neues Projekt mit einer "Class Libary".
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2

Public Class Class1 
End Class

Schritt 2:
Zum zeichnen importieren wir System.Windows.Forms, System.Drawing.Drawing2D und System.Drawing.
Wenn ein Fehler auftritt, fügt dem Projekt eine Form hinzu. Direkt danach könnt ihr sie wieder löschen.
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3

Imports System.Windows.Forms 
Imports System.Drawing.Drawing2D 
Imports System.Drawing

Schritt 3:
Das Programm muss auch noch wissen, von was es erben soll.
Also Inherits Form. (Oder Inherits Progressbar, Button, Listbox)
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1

Inherits Form

Schritt 4:
Natürlich soll das Programm wissen, dass wir es selbst zeichnen.
Dafür erstellen wir den Sub "Public Sub New" und machen dort ein paar Einstellungen (Siehe Code)
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3
4
5
6

Public Sub New() 
MyBase.New() 
MyBase.SetStyle(ControlStyles.UserPaint, True) 'Sagt, dass wir selbst zeichnen 
MyBase.SetStyle(ControlStyles.DoubleBuffer, True) 'Sagt, dass die Form doppelt gebuffert wird 
MyBase.SetStyle(ControlStyles.SupportsTransparentBackColor, True) 'Eigentlich unwichtig. Sagt, dass Transparenter Hintergrund unterstützt wird 
End Sub

Schritt 5:
Somit haben wir die Grundlagen. Jetzt kommt der Part, wo wir die Form (bzw. das Control) zeichnen.
Dies erfolgt in einem Sub, der auslöst, wenn die Form neu gezeichnet wird.
Als erstes legen wir aber unsere Zeichenqualität fest.
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3

Private Sub Grafik(ByVal sender As Object, ByVal e As PaintEventArgs) Handles MyBase.Paint 
e.Graphics.SmoothingMode = SmoothingMode.HighQuality 
End Sub

Schritt 6:
Jetzt könnt ihr eurer Fantasie freien lauf lassen xD
Gezeichnet wird mit "e.Graphics.Draw..."
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3
4
5
6

e.Graphics.FillRectangle(Brushes.White, 0, 0, MyBase.Width - 1, MyBase.Height - 1) 'Die Form ansich 
e.Graphics.DrawRectangle(Pens.DarkGray, 0, 0, MyBase.Width - 1, MyBase.Height - 1) 'Rahmen um die Form 
e.Graphics.DrawRectangle(Pens.DarkGray, 0, 0, MyBase.Width - 1, 23) 'Die Leiste oben 
e.Graphics.DrawIcon(MyBase.Icon, New Rectangle(1, 1, 23, 23)) 'Zeichnet das Icon in der Leiste 
e.Graphics.DrawString(MyBase.Text, New Font("Arial", 12), Brushes.Black, 24, 3) 'Zeichnet den Titel des Fenster 
e.Graphics.DrawString("Schließen", New Font("Arial", 10), Brushes.Black, MyBase.Width - 70, 4) 'Zeichnet das "Schließen", kann auch Bild sein

Schritt 7:
So, die Form ist gezeichnet, aber lässt sich nicht verschieben.
Dies lösen wir, indem wir temporär diePosition der Maus und der Fensters speichern und bei einer bewegung die Diferenz ausrechnen und anwenden.
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

Private Sub MetroFormxd_MouseDown(sender As Object, e As MouseEventArgs) Handles Me.MouseDown 'Wenn Maustaste gedrückt wird 
If MousePosition.X > MyBase.Location.X And MousePosition.X < MyBase.Location.X + (MyBase.Width- 70) Then 'Wenn zwischen Anfang und Ende der Form in X-Richtung 
If MousePosition.Y > MyBase.Location.Y And MousePosition.Y < MyBase.Location.Y + 23 Then 'Wenn zwischen Anfang und Ende der Form in Y-Richtung 
temp_mouse_X = MousePosition.X 'Dann Positionen temporär speichern 
temp_mouse_Y = MousePosition.Y 
temp_windo_X = MyBase.Location.X 
temp_windo_Y = MyBase.Location.Y 
schieben = True ' Und speichern, dass verschoben wird 
End If 
End If 
End Sub 
Private Sub MetroFormxd_MouseMove(sender As Object, e As MouseEventArgs) Handles Me.MouseMove 'Wenn Maus bewegt wird 
If schieben = True Then 'Wenn die Form verschoben wird 
Dim tx As Integer = MousePosition.X - temp_mouse_X 'Dann differenz ausrechnen 
Dim ty As Integer = MousePosition.Y - temp_mouse_Y 
Dim sx As Integer = temp_windo_X + tx 'Und anwenden 
Dim sy As Integer = temp_windo_Y + ty 
MyBase.Location = New Point(sx, sy) 'Neue Position anwenden 
End If 
End Sub 
Private Sub MetroFormxd_MouseUp(sender As Object, e As MouseEventArgs) Handles Me.MouseUp 'Wenn Maustaste losgelassen wird 
schieben = False 'Dann speichern, dass das Fenster nicht verschoben wird 
End Sub

Schritt 8:
Dies ist vorerst der letzte Schritt.
Das Schließen der Form.
Dass machen wir wie in Schritt 7 ("MetroFormxd_MouseDown"), nur mit anderen Koordinaten.
Den Code fügen wir auch in den gleichen Sub wie in Schritt 7 ("MetroFormxd_MouseDown").
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3
4
5

If MousePosition.X > (MyBase.Width - 70) And MousePosition.X < MyBase.Width Then 'Wenn zwischen Anfang und Ende von "Schließen" in X-Richtung 
If MousePosition.Y > MyBase.Location.Y And MousePosition.Y < MyBase.Location.Y + 23 Then 'Wenn zwischen Anfang und Ende von Leiste in Y-Richtung 
Application.Exit() 'Dann Application schließen (Wenn noch andere Fenster offen von gleichem Projekt werden die auch geschlossen) 
End If 
End If


Zum Schluss nochmal der ganze Code an einem Stück.
Und denkt bitte dran. Von Copy&Paste lernt ihr rein gar nichts. Spätestens beim nächsten mal habt ihr es wieder vergessen und sucht den Link.
 Hier klicken für weitere Informationen

Visual Basic Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54

Imports System.Windows.Forms 
Imports System.Drawing.Drawing2D 
Imports System.Drawing 
Public Class MetroFormxd 
Inherits Form 
Dim schieben As Boolean = False 
Dim temp_mouse_X As Integer 
Dim temp_mouse_Y As Integer 
Dim temp_windo_X As Integer 
Dim temp_windo_Y As Integer 
Public Sub New() 
MyBase.New() 
MyBase.SetStyle(ControlStyles.UserPaint, True) 
MyBase.SetStyle(ControlStyles.DoubleBuffer, True) 
MyBase.SetStyle(ControlStyles.SupportsTransparentBackColor, True) 
End Sub 
Private Sub MetroFormxd_MouseDown(sender As Object, e As MouseEventArgs) Handles Me.MouseDown 
If MousePosition.X > MyBase.Location.X And MousePosition.X < MyBase.Location.X + (MyBase.Width - 70) Then 
If MousePosition.Y > MyBase.Location.Y And MousePosition.Y < MyBase.Location.Y + 23 Then 
temp_mouse_X = MousePosition.X 
temp_mouse_Y = MousePosition.Y 
temp_windo_X = MyBase.Location.X 
temp_windo_Y = MyBase.Location.Y 
schieben = True 
End If 
End If 
If MousePosition.X > (MyBase.Width - 70) And MousePosition.X < MyBase.Width Then 
If MousePosition.Y > MyBase.Location.Y And MousePosition.Y < MyBase.Location.Y + 23 Then 
Application.Exit() 
End If 
End If 
End Sub 
Private Sub MetroFormxd_MouseMove(sender As Object, e As MouseEventArgs) Handles Me.MouseMove 
If schieben = True Then 
Dim tx As Integer = MousePosition.X - temp_mouse_X 
Dim ty As Integer = MousePosition.Y - temp_mouse_Y 
Dim sx As Integer = temp_windo_X + tx 
Dim sy As Integer = temp_windo_Y + ty 
MyBase.Location = New Point(sx, sy) 
End If 
End Sub 
Private Sub MetroFormxd_MouseUp(sender As Object, e As MouseEventArgs) Handles Me.MouseUp 
schieben = False 
End Sub 
Private Sub Grafik(ByVal sender As Object, ByVal e As PaintEventArgs) Handles MyBase.Paint 
e.Graphics.SmoothingMode = SmoothingMode.HighQuality 
e.Graphics.FillRectangle(Brushes.White, 0, 0, MyBase.Width - 1, MyBase.Height - 1) 
e.Graphics.DrawRectangle(Pens.DarkGray, 0, 0, MyBase.Width - 1, MyBase.Height - 1) 
e.Graphics.DrawRectangle(Pens.DarkGray, 0, 0, MyBase.Width - 1, 23) 
e.Graphics.DrawIcon(MyBase.Icon, New Rectangle(1, 1, 23, 23)) 
e.Graphics.DrawString(MyBase.Text, New Font("Arial", 12), Brushes.Black, 24, 3) 
e.Graphics.DrawString("Schließen", New Font("Arial", 10), Brushes.Black, MyBase.Width - 70, 4) 
End Sub 
End Class


Ich hoffe och konnte wenigstens einigen helfen xD
Meine Projekte: .Net Metro Controls | KD-Generator

PowerPresentation: 5%
Es haben bereits 3 registrierte Benutzer diesen Beitrag als hilfreich eingestuft.

Benutzer, die diesen Beitrag hilfreich fanden:

vb-Anonym, PRESTiGE, Wincrash

der_Kurt

Co-Administrator

  • »der_Kurt« ist männlich

Beiträge: 2 070

Dabei seit: 25. Mai 2009

Wohnort: Wien

Hilfreich-Bewertungen: 391

  • Private Nachricht senden

2

Freitag, 6. Januar 2012, 10:51

Kleine Anmerkung zu Schritt 6, Zeile 6:
Edit: ...und Schritt 7, Zeile 2... (70 als Konstante is nicht gut)

Visual Basic Quellcode

 
1

e.Graphics.DrawString("Schließen", New Font("Arial", 10), Brushes.Black, MyBase.Width - 70, 4) 'Zeichnet das "Schließen", kann auch Bild sein


Ich schlage stattdessen folgende Zeilen vor:
Durch die MeasureString-Funktion bekommt man die Abmessungen des Textes in der gewünschten Schriftart zurück.
Dadurch kann jeder Text gut rechtsbündig ausgerichtet werden.
Außerdem hat man in crect dann die Abmessungen, falls man diese Worte - "Schließen" - auch mal mit einer entsprechenden Funktion versehen will.

Visual Basic Quellcode

 
1
2
3
4
5
6

Dim ctext As String = "Schließen"
Dim cfont As New Font("Arial", 10)
Dim crect As SizeF = e.Graphics.MeasureString(ctext, cfont)
Dim cbreite As Single = crect.Width

e.Graphics.DrawString(ctext, cfont, Brushes.Black, MyBase.Width - cbreite, 4)


PS: gut geschrieben, nett erklärt...
Neu bei VB? :: Wo fange ich an? :: Kennst du dein Arbeitswerkzeug? :: muss es immer Timer sein?
"Ich darf zum Brotschneiden kein Messer benutzen, denn "Messer ist veraltet", heute nimmt man eine Brotschneidemaschine, die kann viel mehr... Bullsh!t"

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »der_Kurt« (6. Januar 2012, 11:15)

TheMatI

DelûX

Beiträge: 181

Hilfreich-Bewertungen: 23

  • Private Nachricht senden

3

Freitag, 6. Januar 2012, 13:22

Und wie schreibt man jetzt den Code?
Also wie zeichnet man z.b einen Button mit Events?
Dazu müsste man das Viereck doch deklarieren oder?

Nachtrag:
Damit die Form nach resizen neuzeichnet einfach bei dem Event "ResizeEnd" Me.Invalidate einfügen.
------

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »TheMatI« (6. Januar 2012, 15:03)

possible31776

Vieles könner xD

  • »possible31776« ist männlich
  • »possible31776« ist der Autor dieses Themas

Beiträge: 139

Dabei seit: 26. September 2010

Wohnort: Karlsruhe

Hilfreich-Bewertungen: 30

  • Private Nachricht senden

4

Freitag, 6. Januar 2012, 16:51

@der Kurt: OK, dass wusste ich nicht. Werde es bei gelegenheit ändern. :)

@TheMatI: Für ein eigees Control brauchst du folgendes:
Die Imports
Den "Public Sub New"
Den Sub "Graphik"

Alles andere ist nur für die Form.
Jetzt zeichnest du das Viereck/Rechteck für den Button im "Graphik" Sub mit e.Graphics.FillRectangle(...).
Ich bin mir nicht sicher, aber ich glaube dass es automatisch nach dem ReSize neu gezeichnet wird. (bin mir nicht sicher)
Wenn nicht einfach ein Sub mit "Handles Mybase.ReSize"

Darin schreibst du dann MyBase.Invalidate, obwohl bei mir auch Me.Refresh funktioniert hat. KA was davon besser ist.
Wenns einer weiß bitte sagen xD
Meine Projekte: .Net Metro Controls | KD-Generator

PowerPresentation: 5%

Samus Aran

CSS Wizard Ninja Rockstar

  • »Samus Aran« ist männlich

Beiträge: 3 803

Dabei seit: 12. November 2009

Hilfreich-Bewertungen: 1018

  • Private Nachricht senden

5

Freitag, 6. Januar 2012, 17:22

Setze mit SetStyle das ResizeRedraw-Flag auf true. Vergiss Invalidate in Resize-Events.
Lässt sich in den Sessel fallen, die Knöchel knacken und schreibt Assembler

Ähnliche Themen

Verwendete Tags

Control, Design, Eigene, Eigene Controls, eigenes, Form, possible31776

Social Bookmarks