Eigene GUI

Übersicht BlitzBasic Allgemein

Neue Antwort erstellen

 

Aldi

Betreff: Eigene GUI

 BeitragMi, Jan 05, 2005 20:21
Antworten mit Zitat
Benutzer-Profile anzeigen
Hi!

Ich hab mir heut doch mal gedacht eine eigene GUi zu beginnen. Ich habe erst mal mit Schaltflächen angefangen. Welches Prog findet ihr besser?

Dieses:
Code: [AUSKLAPPEN]

Type Buttons
 Field Name$
 Field x,y
 Field height,width
 Field aktiv
End Type

For I= 1 To 4
 Button.Buttons= New Buttons
 Button\x= 100*I
 Button\y= 240
 Button\width= 50
 Button\height= 20
 Button\Name= Str$(I)
Next

Graphics 640,480,32,1
SetBuffer BackBuffer()
Button.Buttons= First Buttons
Repeat
Cls
For Button.Buttons= Each Buttons
If RectsOverlap(MouseX(),MouseY(),1,1,Button\x,Button\y,Button\width,Button\height)= 1 And MouseDown(1)= 1 Then
 Button\aktiv= 1
 Else Button\aktiv= 0
EndIf
If Button\aktiv= 0 Then
 Color 255,50,50
 Line Button\x - 1,Button\y - 1,Button\x + Button\width,Button\y - 1
 Line Button\x - 1,Button\y,Button\x - 1,Button\y + Button\height + 1
 Color 150,0,0
 Line Button\x + Button\width,Button\y,Button\x + Button\width,Button\y + Button\height + 1
 Line Button\x,Button\y + Button\height + 1,Button\x + Button\width - 1,Button\y + Button\height + 1
EndIf
If Button\aktiv= 1 Then
 Color 150,0,0
 Line Button\x - 1,Button\y - 1,Button\x + Button\width,Button\y - 1
 Line Button\x - 1,Button\y,Button\x - 1,Button\y + Button\height + 1
 Color 255,50,50
 Line Button\x + Button\width,Button\y,Button\x + Button\width,Button\y + Button\height
 Line Button\x,Button\y + Button\height + 1,Button\x + Button\width,Button\y + Button\height + 1
EndIf
Color 255,0,0
Text Button\x + Button\width/2,Button\y + Button\height/2,Button\Name$,1,1
Next
Plot MouseX(),MouseY()
Delay 10
Flip
Until KeyHit(1)
End

oder das:
Code: [AUSKLAPPEN]

Type Buttons
 Field Name$
 Field x,y
 Field height,width
 Field aktiv
End Type

For I= 1 To 4
 Button.Buttons= New Buttons
 Button\x= 100*I
 Button\y= 240
 Button\width= 50
 Button\height= 20
 Button\Name= Str$(I)
Next

Graphics 640,480,32,1
SetBuffer BackBuffer()
Button.Buttons= First Buttons
Repeat
Cls
For Button.Buttons= Each Buttons
If RectsOverlap(MouseX(),MouseY(),1,1,Button\x,Button\y,Button\width,Button\height)= 1 And MouseDown(1)= 1 Then
 Button\aktiv= 1
 Else Button\aktiv= 0
EndIf
If Button\aktiv= 0 Then
 Color 255,130,130
 Line Button\x - 1,Button\y - 1,Button\x + Button\width,Button\y - 1
 Line Button\x - 1,Button\y,Button\x - 1,Button\y + Button\height
 Color 150,0,0
 Line Button\x + Button\width,Button\y,Button\x + Button\width,Button\y + Button\height
 Line Button\x,Button\y + Button\height,Button\x + Button\width - 1,Button\y + Button\height
EndIf
If Button\aktiv= 1 Then
 Color 150,0,0
 Line Button\x - 1,Button\y - 1,Button\x + Button\width,Button\y - 1
 Line Button\x - 1,Button\y,Button\x - 1,Button\y + Button\height
 Color 255,130,130
 Line Button\x + Button\width,Button\y,Button\x + Button\width,Button\y + Button\height
 Line Button\x,Button\y + Button\height,Button\x + Button\width,Button\y + Button\height
EndIf
Color 255,0,0
Rect Button\x,Button\y,Button\width,Button\height
Color 0,0,0
Text Button\x + Button\width/2,Button\y + Button\height/2,Button\Name$,1,1
Next
Color 255,255,255
Plot MouseX(),MouseY()
Delay 10
Flip
Until KeyHit(1)
End


Habt ihr Ideen, Verbesserungsvorschläge,...

thx, Aldi
goto jollyroger.cabanova.de
 

Aldi

 BeitragDo, Jan 06, 2005 18:43
Antworten mit Zitat
Benutzer-Profile anzeigen
Sei doch nicht gleich so sauer. Ist schließlich einer meiner wenigen halbwegs ordentlichen Progs Neutral . Ihr könnts ja in den Beginner-Bereich verschieben, als Type- bzw. GUI-Beispiel. Übrigens hab ich noch Textfelder hinzugefügt.
Code: [AUSKLAPPEN]

Type Buttons
 Field Name$
 Field x,y
 Field height,width
 Field aktiv
End Type

Type txtfelds
 Field x,y
 Field width,height
End Type

For I= 1 To 2
 txtfeld.txtfelds= New txtfelds
 txtfeld\x= 100*I
 txtfeld\y= 100
 txtfeld\width= 80
 txtfeld\height= 100
Next

For I= 1 To 4
 Button.Buttons= New Buttons
 Button\x= 100*I
 Button\y= 300
 Button\width= 50
 Button\height= 20
 Button\Name= Str$(I)
Next

Graphics 640,480,32,1
SetBuffer BackBuffer()
ClsColor 255,0,0 ;<<-------------------------------- Entfernt mal diese Zeile!
Button.Buttons= First Buttons
txtfeld.txtfelds= First txtfelds
Repeat
Cls
Maus= 1
For Button.Buttons= Each Buttons
If RectsOverlap(MouseX(),MouseY(),1,1,Button\x,Button\y,Button\width,Button\height)= 1 And MouseDown(1)= 1 Then
 Button\aktiv= 1
 Else Button\aktiv= 0
EndIf
If Button\aktiv= 0 Then
 Color 255,130,130
 Line Button\x - 1,Button\y - 1,Button\x + Button\width,Button\y - 1
 Line Button\x - 1,Button\y,Button\x - 1,Button\y + Button\height
 Color 150,0,0
 Line Button\x + Button\width,Button\y,Button\x + Button\width,Button\y + Button\height
 Line Button\x,Button\y + Button\height,Button\x + Button\width - 1,Button\y + Button\height
EndIf
If Button\aktiv= 1 Then
 Color 150,0,0
 Line Button\x - 1,Button\y - 1,Button\x + Button\width,Button\y - 1
 Line Button\x - 1,Button\y,Button\x - 1,Button\y + Button\height
 Color 255,130,130
 Line Button\x + Button\width,Button\y,Button\x + Button\width,Button\y + Button\height
 Line Button\x,Button\y + Button\height,Button\x + Button\width,Button\y + Button\height
EndIf
Color 255,0,0
Rect Button\x,Button\y,Button\width,Button\height
Color 0,0,0
Text Button\x + Button\width/2,Button\y + Button\height/2,Button\Name$,1,1
Next

For txtfeld.txtfelds= Each txtfelds
Color 150,0,0
Line txtfeld\x - 1,txtfeld\y - 1,txtfeld\x + txtfeld\width,txtfeld\y - 1
Line txtfeld\x - 1,txtfeld\y,txtfeld\x - 1,txtfeld\y + txtfeld\height
Color 255,130,130
Line txtfeld\x,txtfeld\y + txtfeld\height,txtfeld\x + txtfeld\width,txtfeld\y + txtfeld\height
Line txtfeld\x + txtfeld\width,txtfeld\y,txtfeld\x + txtfeld\width,txtfeld\y + txtfeld\height
If RectsOverlap(MouseX(),MouseY(),1,1,txtfeld\x,txtfeld\y,txtfeld\width,txtfeld\height)= 1 Then Maus= 2
Next
Color 255,255,255
If Maus= 1 Then Plot MouseX(),MouseY()
If Maus= 2 Then Line MouseX(),MouseY(),MouseX(),MouseY() + 15
Delay 10
Flip
Until KeyHit(1)
End
goto jollyroger.cabanova.de

Mooch

Betreff: ...

 BeitragFr, Jan 07, 2005 17:59
Antworten mit Zitat
Benutzer-Profile anzeigen
Eigentlich gar nicht so schlecht...Aber könntest du nicht mal die Farben ändern?
Pentium IV 3.0Ghz; nVidia Geforce 6800;
Microsoft Windows XP Home SP2; BlitzBasic 3D

.:: Sites ::.
.:: http://www.fl4sh-clan.de/ ::.


 

woox

 BeitragMo, Feb 14, 2005 13:05
Antworten mit Zitat
Benutzer-Profile anzeigen
Warum...sieht doch geil aus Very Happy
Ich finds cool!!
 

#pointer#

Gast

BeitragMo, Feb 14, 2005 14:17
Antworten mit Zitat
also wenn schon, dann würde ich den 2. Vorschlag nehmen.

Mattis_the_brain

 BeitragMo, Feb 14, 2005 20:54
Antworten mit Zitat
Benutzer-Profile anzeigen
Hier mal ein ganz ganz simpler GUIAnsatz von mir der dir aber sicher ein paar brauchbare sachen zeigen kann:


Code: [AUSKLAPPEN]
[syntax="bb"]
Graphics(1024, 768, 16, 1)

;MOUSE
   Global GUI_MousePosX, GUI_MousePosY
   Global GUI_MouseKey1, GUI_MouseKey2
   
   Function GUI_MouseUpdate()
      GUI_MousePosX = MouseX()
      GUI_MousePosY = MouseY()
      
      GUI_MouseKey1 = MouseHit(1)
      GUI_MouseKey2 = MouseHit(2)
      
      SetBuffer(BackBuffer())
      Rect(GUI_MousePosX, GUI_MousePosY, 2, 2, 1)
   End Function

;FONTS
   Global FONT_HeadLine = LoadFont("Trebuchet MS", 17, 1, 0, 0)

;WINDOW
   Type GUI_Window
      Field Name$
      Field PosX, PosY
      Field SizeX, SizeY
      Field Buffer, WinMask
   End Type
   Global GUI_W.GUI_Window
   Global GUI_LastWindow.GUI_Window
   
   Global GUI_WindowDropX, GUI_WindowDropY, GUI_WindowDrop
   
   Function GUI_WindowCreate.GUI_Window(Name$, PosX, PosY, SizeX, SizeY)
      GUI_W = New GUI_Window
      GUI_W\Name = Name
      GUI_W\PosX = PosX
      GUI_W\PosY = PosY
      GUI_W\SizeX = SizeX
      GUI_W\SizeY = SizeY
   
      GUI_W\Buffer = CreateImage(SizeX, SizeY)
      GUI_W\WinMask = CreateImage(SizeX, SizeY)
      
      MaskImage(GUI_W\WinMask, 255, 0, 128)
      
      SetBuffer(ImageBuffer(GUI_W\WinMask))
      ClsColor(255, 0, 128)
      Cls
      
      Color(20, 20, 20)
      Rect(0, 0, SizeX, 20, 1)
      Color(255, 255, 255)
      Rect(0, 0, SizeX, SizeY, 0)
      Rect(0, 0, SizeX, 20, 0)
      
      SetFont(FONT_HeadLine)
      Text(5, 2, Name)
         
      Return(GUI_W)
   End Function
   
   Function GUI_WindowUpdate()
      GUI_LastWindow = Null
   
      For GUI_W = Each GUI_Window
         DrawBlock(GUI_W\Buffer, GUI_W\PosX, GUI_W\PosY)
         DrawImage(GUI_W\WinMask, GUI_W\PosX, GUI_W\PosY)
         
         If(GUI_MouseKey1)
            If(RectsOverlap(GUI_MousePosX, GUI_MousePosY, 1, 1, GUI_W\PosX, GUI_W\PosY, GUI_W\SizeX, GUI_W\SizeY))
               GUI_LastWindow = GUI_W
            EndIf
         EndIf
      Next
      
      If(GUI_LastWindow <> Null) Insert GUI_LastWindow After Last GUI_Window
      
      GUI_W = Last GUI_Window
      If(GUI_MouseKey1)
         If(RectsOverlap(GUI_MousePosX, GUI_MousePosY, 1, 1, GUI_W\PosX, GUI_W\PosY, GUI_W\SizeX, 20))
            GUI_WindowDropX = GUI_MousePosX - GUI_W\PosX
            GUI_WindowDropY = GUI_MousePosY - GUI_W\PosY
            GUI_WindowDrop = True         
         EndIf
      EndIf
      
      If(MouseDown(1))
         If(GUI_WindowDrop = True)
            GUI_W\PosX = GUI_MousePosX - GUI_WindowDropX
            GUI_W\PosY = GUI_MousePosY - GUI_WindowDropY
         EndIf
      Else
         GUI_WindowDrop = False
      EndIf
   End Function

;BUTTON
   Type GUI_Button
      Field Window.GUI_Window
      Field Status
      Field Name$
      Field PosX, PosY
      Field SizeX, SizeY
      Field Image
   End Type
   Global GUI_B.GUI_Button

   Function GUI_ButtonCreate.GUI_Button(Window.GUI_Window, Name$, PosX, PosY, SizeX, SizeY)
      GUI_B = New GUI_Button
      GUI_B\Window = Window
      GUI_B\Name = Name
      GUI_B\PosX = PosX
      GUI_B\PosY = PosY
      GUI_B\SizeX = SizeX
      GUI_B\SizeY = SizeY
      
      GUI_B\Image = CreateImage(SizeX, SizeY, 2)
      
      SetBuffer(ImageBuffer(GUI_B\Image, 0))
      Color(0, 0, 0)
      Rect(0, 0, SizeX, SizeY, 1)
      Color(255, 255, 255)
      Rect(0, 0, SizeX, SizeY, 0)
      Text(SizeX / 2 - StringWidth(Name) / 2, SizeY / 2 - StringHeight(Name) / 2, Name)
      
      SetBuffer(ImageBuffer(GUI_B\Image, 1))
      Color(20, 20, 20)
      Rect(0, 0, SizeX, SizeY, 1)
      Color(255, 255, 255)
      Rect(0, 0, SizeX, SizeY, 0)
      Text(SizeX / 2 - StringWidth(Name) / 2, SizeY / 2 - StringHeight(Name) / 2, Name)
      
      Return(GUI_B)
   End Function

   Function GUI_ButtonUpdate()
      For GUI_B = Each GUI_Button
         Frame = 0
         If(GUI_B\Window = Last GUI_Window)
            Frame = 0
         
            GUI_B\Status = False
            If(RectsOverlap(GUI_MousePosX, GUI_MousePosY, 1, 1, GUI_B\PosX + GUI_B\Window\PosX, GUI_B\PosY + GUI_B\Window\PosY, GUI_B\SizeX, GUI_B\SizeY))
               Frame = 1
               If(GUI_MouseKey1) GUI_B\Status = True
            EndIf
         EndIf
      
         SetBuffer(ImageBuffer(GUI_B\Window\Buffer))
         DrawBlock(GUI_B\Image, GUI_B\PosX, GUI_B\PosY, Frame)   
      Next
   End Function

;GUI
   Function GUI_Update()
      GUI_WindowUpdate()
      GUI_ButtonUpdate()
      GUI_MouseUpdate()
   End Function

Win3.GUI_Window = GUI_WindowCreate("TestWindow3", 200, 140, 400, 200)
Win2.GUI_Window = GUI_WindowCreate("TestWindow2", 450, 40, 200, 400)
Win1.GUI_Window = GUI_WindowCreate("TestWindow1", 10, 10, 400, 200)

But1.GUI_Button = GUI_ButtonCreate(Win1, "Ende", 10, 30, 100, 20)
But2.GUI_Button = GUI_ButtonCreate(Win2, "Button1", 10, 30, 100, 20)
But3.GUI_Button = GUI_ButtonCreate(Win2, "Button2", 10, 60, 100, 50)

While(KeyHit(1) = False)
   
   If(But1\Status) End
   
   SetBuffer(BackBuffer())
   ClsColor(0, 0, 0)
   Cls()
   
   GUI_Update()
   
   Flip(True)
Wend
End
[/syntax]
[/code]

Travis

 BeitragDi, Feb 15, 2005 1:26
Antworten mit Zitat
Benutzer-Profile anzeigen
@ Aldi

Von der Funktion her schon mal ganz gut, an der Technik könnte man aber noch arbeiten. Ich würde vorschlagen, für alles eine Funktion anzulegen und nicht alles in die Hauptschleife zu packen.

1. Funktion zum Button erstellen
2. Funktion zum Button anzeigen und abfragen
3. Funktion zum Abrufen des Buttons

Dann kann man auch ein Bild für den Button verwenden, das man beim Erstellen des Buttons generiert. Jetzt zeigt man im Programm nur noch diese Bilder an. Das geht wesentlich schneller als alles mit Line oder Rect immer wieder neu zu zeichnen.

Hier mal ein Beispiel aus meinem GUI-Projekt. (Der Button funktioniert aber noch nicht wie ein Originalbutton, der erst betätigt wird, wenn man die Maustaste wieder loslässt)

@ Mattis_the_brain
Gefällt mir. Besonders, das mit den verschiedenen Fenstern. Das werde ich mir wohl mal genauer angucken, wie das mit den Layern funktioniert Wink



Code: [AUSKLAPPEN]

Global GUI_Font1 = LoadFont("Arial",15,0,0,0) ; NumFields, Textfields ect.
Global GUI_Font2 = LoadFont("Arial",14,0,0,0) ; Menu

Global SelectedID, ActualID = 1

Type Button
 Field window
 Field x,y,w,h,name$,value,ID
 Field Image[2]
End Type

Graphics 800,600,16,2

Btn1 = CreateButton(100,100,150,30,"Ich mag's blau")
Btn2 = CreateButton(100,150,150,30,"Ich mag's grün")
Btn3 = CreateButton(100,200,150,30,"Beenden")

r=212: g=208: b=200

SetBuffer BackBuffer()
 Repeat
  ClsColor r,g,b
  Cls
 
  Text 5,5, "Press Tab to select a button. Press Space or Enter to push down the selected button."

  UpdateButton()

  If KeyHit(15) Then SelectedID = SelectedID + 1
  If SelectedID > ActualID Then SelectedID = 1

  If Button(Btn1) Then r=85:g=175:b=255
  If Button(Btn2) Then r=85:g=255:b=175
  If Button(Btn3) Then End
 
  Flip
 Until KeyHit(1)
End

Function CreateButton(x,y,w,h,name$)
 b.button = New button
 b\window = Window
 b\x = x
 b\y = y
 b\w = w
 b\h = h
 b\name$ = name$
 b\ID = ActualID
 ActualID = ActualID + 1


 b\image[0] = CreateImage(w,h)
 SetBuffer ImageBuffer(b\image[0])
 MaskImage b\image[0], 255,0,255

  Color 212,208,200
  Rect 1,1,w-2,h-2
 
  Color 255,255,255
  Line 0,0,w-2,0
  Line 0,0,0,h-2

  Color 128,128,128
  Line w-1,h-1,0,h-1
  Line w-1,h-1,w-1,0

  Color 0,0,0
  Text b\x+(b\w/2),b\y+(b\h/2)-1, b\name$, 1, 1


 b\image[1] = CreateImage(w,h)
 SetBuffer ImageBuffer(b\image[1])
 MaskImage b\image[1], 255,0,255

  Color 0,0,0
  Rect 0,0,w,h,1

  Color 255,255,255
  Line 1,1,w-3,1
  Line 1,1,1,h-3

  Color 128,128,128
  Line w-3,h-3,2,h-3
  Line w-3,h-3,w-3,2

  Color 212,208,200
  Rect 2,2,w-4,h-4,1

  Color 0,0,0
  Text b\x+(b\w/2),b\y+(b\h/2)-1, b\name$, 1, 1
   

 b\image[2] = CreateImage(w,h)
 SetBuffer ImageBuffer(b\image[2])
 MaskImage b\image[2], 255,0,255

  Color 212,208,200
  Rect 1,1,w-2,h-2
 
  Color 128,128,128
  Line 0,0,w-2,0
  Line 0,0,0,h-2

  Color 255,255,255
  Line w-1,h-1,0,h-1
  Line w-1,h-1,w-1,0

  Color 0,0,0
  Text b\x+(b\w/2),b\y+(b\h/2), b\name$, 1, 1

 Return Handle(b)
End Function


Function Button(id)
 b.button = Object.button(id)
 Return b\value
End Function


Function UpdateButton()
 For b.button = Each button
  b\value = 0

   If MouseOver(b\x,b\y,b\w,b\h) Then
    If Not MouseDown(1) Or KeyHit(28) Then
     b\value = 0
     DisplayMode = 1
    Else
     b\value = 1
     SelectedID = b\ID
     DisplayMode = 2
    EndIf
   Else
    DisplayMode = 0
   EndIf


   If b\ID = SelectedID Then
    DisplayMode = 1
    If MouseOver(b\x,b\y,b\w,b\h) And MouseDown(1) Then DisplayMode = 2
    If KeyDown(28) Or KeyDown(57) Then
     b\value = 1
     FlushKeys()
     DisplayMode = 2
    EndIf
   EndIf

   DrawImage b\image[DisplayMode], b\x, b\y
 
   Color 0,0,0
   Text b\x+(b\w/2),b\y+(b\h/2)-1+b\value, b\name$, 1, 1

 Next
End Function


Function MouseOver(x,y,w,h)
 mx = MouseX()
 my = MouseY()
 If mx > x And mx < x+w And my > y And my < y+h Then Return 1
End Function
www.funforge.org

Ich hasse WASD-Steuerung.

Man kann alles sagen, man muss es nur vernünftig begründen können.

Mattis_the_brain

 BeitragDi, Feb 15, 2005 10:15
Antworten mit Zitat
Benutzer-Profile anzeigen
Wenigstens einer der meine Arbeit schätzt^^

kog

 BeitragSa, März 25, 2006 17:36
Antworten mit Zitat
Benutzer-Profile anzeigen
Guten Tag, ich hätte da noch eine frage zu dem GUI von Mattis_the_brain..
Ich bastle gerade einbisschen mit dem Code herum und jetzt wollte ich ein Schliess button machen, oben rechts im fenster..
Wie mache ich das, das man ein Fenster schliessen kann?

Delete GUI_W

geht nicht
pls Help me!

mfg
k.o.g.

*edit
Ich meine den Rot Markierten Button:
user posted image

Kryan

 BeitragSa, März 25, 2006 21:08
Antworten mit Zitat
Benutzer-Profile anzeigen
du musst danach auch die funktion verlassen...mit return

sonst benutzt er ja den handle danach noch und es geht nicht Wink
Webspaceanbieter?
Klick hier!
Kultige Spieleschmiede?
Klick hier!
 

super_castle

 BeitragSo, März 26, 2006 9:18
Antworten mit Zitat
Benutzer-Profile anzeigen
hallo Travi und Ald, isteine tolle sache was ihr da gemacht habt.
kann man sehr gut ausbauen.
ich habe es mal im b3d-fenster eingebaut und stelle fest, das die entitys in der bewegung nicht merklich beeinflusst werden.
ich habe mal 15 button in einem b3d-fenster für verschiedene aufgaben reingesetzt.
travi: wie kann die button jetzt in ein fenster zum verschieben unterbringen?

mfg castle

Neue Antwort erstellen


Übersicht BlitzBasic Allgemein

Nach Oben

Gehe zu:

Powered by phpBB © 2001 - 2006, phpBB Group