Scrollbar berechnung

Übersicht BlitzMax, BlitzMax NG Beginners-Corner

Neue Antwort erstellen

 

Schoppy

Betreff: Scrollbar berechnung

 BeitragDo, Dez 15, 2011 13:52
Antworten mit Zitat
Benutzer-Profile anzeigen
Hilfe, ich brüte schon seit Tagen über das Problem der Berechnung einer Scrollbar.

Hier erst mal einen Code Ausschnitt:

Code: [AUSKLAPPEN]

windowHoehe:Int = 300 'Größe des Festers
inhaltGesamtLaenge:Int = 900 'Gesamte Länge des Inhaltes


'Erzeuge Scrollbar wenn  inhaltGesamtLaenge > windowHoehe
   
Local NewGadget:GUItype
NewGadget = New GUItype

NewGadget.GUItyp = GUI_SCROLLBAR

NewGadget.pos_x = posX 'PositionX des Scrollbar
NewGadget.pos_y = posY 'PositionY des Scrollbar

NewGadget.breite = breite 'Breite Scrollbar
NewGadget.hoehe = hoehe 'Hoehe Scrollbar
         
   'Dragger / SrollBalken   
   NewGadget.pos_x_dragger = posX 'PositionX des Draggers
   NewGadget.pos_y_dragger = posY 'PositionY des Draggers
   
   NewGadget.pos_y_dragger_min = posY 'Speichert nochmals die PositionX des Draggers
   NewGadget.pos_y_dragger_max = posY + hoehe 'Speichert das Ende der Scrollpos
   
   'Berechnung der Dragger Göße
   NewGadget.draggerHoehe = (windowHoehe / inhaltGesamtLaenge) * windowHoehe

   NewGadget.Min_Value = 0
    NewGadget.Max_Value = inhaltGesamtLaenge
   NewGadget.Value = NewGadget.Min_Value
    NewGadget.page = windowHoehe

GadgetList.AddLast(NewGadget)



Jetzt die Hauptschleife
Code: [AUSKLAPPEN]

If Self.GUItyp = GUI_SCROLLBAR 'wenn der Scrollbar Eintrag erreicht wurde
If Self.IsMouseInside() 'wenn Maus in dem Dragger ist
If MouseDown(1) 'wenn die Maustaste gedrückt wird

   Self.pos_y_dragger = Self.pos_y_dragger + (MouseY() - mouse_y_alt)
   
      'Begrenzung nach oben
      If (Self.pos_y_dragger < Self.pos_y_dragger_min)
             Self.pos_y_dragger = Self.pos_y_dragger_min
      EndIf
       
      'Begrenzung nach unten                 
      If (Self.pos_y_dragger > Self.pos_y_dragger_max - Self.draggerHoehe)
             Self.pos_y_dragger = Self.pos_y_dragger_max - Self.draggerHoehe
      EndIf
      
      'Wenn in diesem Bereich
      If (Self.pos_y_dragger > Self.pos_y_dragger_min) And (Self.pos_y_dragger < Self.pos_y_dragger_max - Self.draggerHoehe)
         
         'berechne Y Bewegung für den Window Inhalt
         
         'berechne den Rest der inhaltGesamtLaenge
         'inhalt_rest = Self.Max_Value - Self.page
         
         'berechne die draggerbewegung
         'scroll_rest = Self.hoehe - Self.draggerHoehe 'also Höhe der Gesamten Scrollbar - Höhe des Draggers
            
         'bewegung_Inahlt = inhalt_rest / scroll_rest

         'bewege die Buttons
         For Local Gadgets:GUItype = EachIn GadgetList
            If Gadgets.GUItyp = GUI_BUTTON Then 'nur buttons
      
            Gadgets.pos_y = Gadgets.pos_y + bewegung_Inahlt
               
            EndIf
         Next

      End If
   
EndIf
EndIf
EndIf

Wenn ich den Dragger jetzt bewege nach unten oder nach oben fährt der inhalt immer nach unten
bzw. die berechnung ist auch irgendwie falsch. Irgendwo liegt da ein Denkfehler.

Midimaster

 BeitragSa, Dez 17, 2011 19:29
Antworten mit Zitat
Benutzer-Profile anzeigen
hat bisher keiner geholfen? oh! also....

Leider schreibst Du nicht um welche GUI es sich hier handelt. Daher weiß ich nicht genau, worin dein Problem besteht....

bei einer Scrollbar kommt es darauf an, was Du scrollen willst. Willst Du damit z.b. einen Fensterinhalt scrollen, ist also MAX-Wert nicht etwa die Größe des zu scrollenden Objektes, sondern nur die "nicht sichtbare" Differenz zwischen Fenster und Objekt einzutragen.

klingt komplizierter als es ist... Beispiel

Du scrollst ein Bild mit Höhe 1000 und hast dafür ein Fenster mit Höhe 600. Dann muss der Scrollwert nur von 0 bis 400 gehen. Denn bei y=400 würde ja das Bild ja bereits von Pixel 400 bis Pixel 1000 zu sehen sein.

Um nun die "richtige" Scrollrichtung zu erreichen verschiebst sich bei zunehmendem Scrollwert der Startpunkt des Bildes nach oben also Richtung -y

Beispiel bei einem Scrollwert 0 malst du das Objekt bei 0/0, bei einem Scrollwert 200 malst du das Bild bei 0/-200 usw.

Noch eleganter wird es wenn Du als Scroll-Min die 600 wählst (also die Fenstergröße) und als Scroll-Max 1000. Bei den meisten GUIs hast Du dann jetzt einen dicken Scroll-Balken, der den User erahnen lässt, wieviel es zu scrollen gibt. Die echte Malkoordinate für das Bild wäre dann natürlich ...

-ScrollWert+600

..., damit du wieder auf Werte zwischen 0 und -400 kommst.

War das dein Problem?
Gewinner des BCC #53 mit "Gitarrist vs Fussballer" http://www.midimaster.de/downl...ssball.exe
 

Schoppy

 BeitragSa, Dez 24, 2011 16:02
Antworten mit Zitat
Benutzer-Profile anzeigen
Hi, Danke dir.
Die funktionsweise habe ich jetzt verstanden.

Ich habe mal ein kleines Beispiel im BB geschrieben.
Zunächst Danke an Thomas Decker auf welchem dieser Code hier basiert.

Soweit funktioniert das ganze.
Nur wenn ich jetzt einen Pfeil für Oben und Unten an die Scrollbar dranhänge
gibt es noch einen kleinen Fehler.

Pfeil oben wird korrekt berechnet. Aber unten rutscht der Dragger in das Pfeil Image hineien.

Des Weiteren ist MouseYSpeed() bei der Maussteuerung nicht die Optimale Lösung. Der Dragger kommt der Maus auf der Y Achse nicht hinterher.

Hier mal der Code: (Einfach ein eignes Image verwenden)

Code: [AUSKLAPPEN]

;basierend auf den Code: Scrollbox von Thomas Decker - Februar 2007
Graphics 800,600, 0, 2
SetBuffer BackBuffer()

pic = LoadImage("contaent.png")

Global contaent_laenge = 1000
Global contaent_pos_y = 0

Global window_inner_pos_x = 80
Global window_inner_pos_y = 50
Global window_inner_hoehe = 336
Global window_inner_breite = 550

Global dragger_pos_x = window_inner_pos_x + window_inner_breite - 1
Global dragger_pos_y = 0
Global dragger_breite = 20

Global scrollbar_pfeil_breite =20

Global scrollbar_pfeil_oben_pos_x =  window_inner_pos_x + window_inner_breite
Global scrollbar_pfeil_oben_pos_y =window_inner_pos_y

Global scrollbar_pfeil_unten_pos_x =  window_inner_pos_x + window_inner_breite
Global scrollbar_pfeil_unten_pos_y =window_inner_pos_y + window_inner_hoehe - scrollbar_pfeil_breite

;berechne länge des draggers
Global dragger_hoehe = Float(window_inner_hoehe-scrollbar_pfeil_breite-scrollbar_pfeil_breite) / contaent_laenge* window_inner_hoehe



Global dragger_aktiv = 0
Repeat ;####################### HAUPTSCHLEIFE ########################


If KeyDown(200) Then contaent_pos_y= contaent_pos_y - 6
If KeyDown(208) Then contaent_pos_y = contaent_pos_y + 6

;jetzt Maus Abfrage
If MouseX() >= dragger_pos_x And MouseX() <=  dragger_pos_x + dragger_breite
If MouseY() >= dragger_pos_y And MouseY() <=  dragger_pos_y + dragger_hoehe
   If MouseDown(1) = 1
   dragger_aktiv = 1
   EndIf
EndIf
EndIf

If dragger_aktiv = 1
   If MouseDown(1) = 0 Then dragger_aktiv = 0
contaent_pos_y= contaent_pos_y + MouseYSpeed()
EndIf


If contaent_pos_y < 0 Then
contaent_pos_y = 0
Else
   If contaent_pos_y > contaent_laenge - window_inner_hoehe Then
   contaent_pos_y = contaent_laenge - window_inner_hoehe
   EndIf
EndIf


If window_inner_hoehe > contaent_laenge Then
contaent_pos_y = 0
EndIf



Cls
;zeichne content
DrawImageRect pic, window_inner_pos_x, window_inner_pos_y, 0, contaent_pos_y, window_inner_breite, window_inner_hoehe

;pos berechnung dragger
dragger_pos_y = window_inner_pos_y+scrollbar_pfeil_breite + ( Float(contaent_pos_y) / contaent_laenge * window_inner_hoehe )

;zeichne dragger
Color 255,255,255
If contaent_laenge> window_inner_hoehe Then;
Rect dragger_pos_x,  dragger_pos_y, dragger_breite, dragger_hoehe-scrollbar_pfeil_breite, 1
EndIf

;zeichne Pfeile
Color 0,0,255
Rect scrollbar_pfeil_oben_pos_x,  scrollbar_pfeil_oben_pos_y, scrollbar_pfeil_breite, scrollbar_pfeil_breite, 1
Rect scrollbar_pfeil_unten_pos_x,  scrollbar_pfeil_unten_pos_y, scrollbar_pfeil_breite, scrollbar_pfeil_breite, 1



Flip()

Until KeyDown(1)
End  ;##################################################################


PS: Frohe Weihnachten Wink

Midimaster

 BeitragSa, Dez 24, 2011 16:34
Antworten mit Zitat
Benutzer-Profile anzeigen
ich dachte, du schreibst das für BMax? Jetzt ist dein Code plötzlich BB... Steht dein Beitrag vielleicht im falschen Forum?
Gewinner des BCC #53 mit "Gitarrist vs Fussballer" http://www.midimaster.de/downl...ssball.exe
 

Schoppy

 BeitragSo, Dez 25, 2011 14:26
Antworten mit Zitat
Benutzer-Profile anzeigen
Ja meine GUI schreibe ich in Blitzmax. Dort nutze ich die Leadwerks Engine.

Habe irgendwie die Angewohnheit größere Problem wie hier in kleinen verständlichen Programmen zu schreiben. Hat für mich irgendwie nen Lerneffekt.

Sorry, wenn es jetzt im falschen Forum steht dann bitte verschieben.

Xeres

Moderator

BeitragSo, Dez 25, 2011 14:29
Antworten mit Zitat
Benutzer-Profile anzeigen
Bitte bleib dann bei einer Sprache - so kommt es hier nur zu Verwirrung, wenn jemand den Thread findet.
Win10 Prof.(x64)/Ubuntu 16.04|CPU 4x3Ghz (Intel i5-4590S)|RAM 8 GB|GeForce GTX 960
Wie man Fragen richtig stellt || "Es geht nicht" || Video-Tutorial: Sinus & Cosinus
THERE IS NO FAIR. THERE IS NO JUSTICE. THERE IS JUST ME. (Death, Discworld)

SpionAtom

Betreff: BB Lösung

 BeitragSo, Dez 25, 2011 15:53
Antworten mit Zitat
Benutzer-Profile anzeigen
Ich habe gesehen, dass mein alter Code ja noch nichtmal Mausunterstützung hatte.

https://www.blitzforum.de/foru...637#397637

Also hier die neue Version mit Maussteuerung. Ist mit Drag & Drop etwas happiger, drum solltest du aus Lernzwecken lieber erstmal selbst noch etwas rumprobieren
os: Windows 10 Home cpu: Intel Core i7 6700K 4.00Ghz gpu: NVIDIA GeForce GTX 1080

Neue Antwort erstellen


Übersicht BlitzMax, BlitzMax NG Beginners-Corner

Nach Oben

Gehe zu:

Powered by phpBB © 2001 - 2006, phpBB Group