scroll: started buttons

demo/ScrollBox/MainUnit.lfm

@@ -3,7 +3,7 @@ object MainForm: TMainForm
   FormLeft = 450
   FormTop = 100
   FormWidth = 350
-  FormHeight = 555
+  FormHeight = 605
   Stylesheet.Strings = (
     '#ScrollDiv1 {'
     '  padding: 5px; '
@@ -14,7 +14,7 @@ object MainForm: TMainForm
   OnCreate = MainFormCreate
   Visible = true
   object Body1: TBody
-    style = 'font-size: 15px;'
+    style = 'font-size: 14px;'
     object ScrollDiv1: TDiv
       Style = 'background-color: blue;'#10'border-color: black;'#10'height:50px;'
       object Label1: TLabel
@@ -100,21 +100,31 @@ object MainForm: TMainForm
         Caption = 'Overlay'
         OnClick = OnOverlayClicked
       end
-      object ThinCheckBox: TDemoCheckBox
+      object HaveButtonsCheckBox: TDemoCheckBox
         Style = 'margin: 6px;'
-        Caption = 'Thin (scrollbar-width)'
-        OnClick = OnThinClicked
+        Caption = 'Have Buttons'
+        OnClick = OnHaveButtonsClicked
       end
       object RTLCheckBox: TDemoCheckBox
         Style = 'margin: 6px;'
         Caption = 'RTL (direction)'
         OnClick = OnRTLClicked
       end
+      object ThinCheckBox: TDemoCheckBox
+        Style = 'margin: 6px;'
+        Caption = 'Thin (scrollbar-width)'
+        OnClick = OnThinClicked
+      end
       object BothEdgesCheckBox: TDemoCheckBox
         Style = 'margin: 6px;'
         Caption = 'Both Edges (scrollbar-gutter)'
         OnClick = OnBothEdgesClicked
       end
+      object ColorCheckBox: TDemoCheckBox
+        Style = 'margin: 6px;'
+        Caption = 'Color (scrollbar-color)'
+        OnClick = OnColorClicked
+      end
     end
   end
 end

demo/ScrollBox/MainUnit.pas

@@ -36,17 +36,21 @@ type
     OverflowYAuto: TDemoRadioButton;
     AutoHideCheckBox: TDemoCheckBox;
     OverlayCheckBox: TDemoCheckBox;
-    ThinCheckBox: TDemoCheckBox;
+    HaveButtonsCheckBox: TDemoCheckBox;
     RTLCheckBox: TDemoCheckBox;
+    ThinCheckBox: TDemoCheckBox;
     BothEdgesCheckBox: TDemoCheckBox;
+    ColorCheckBox: TDemoCheckBox;
     procedure MainFormCreate(Sender: TObject);
     procedure OnAutoHideClicked(Event : TAbstractEvent);
     procedure OnOverflowXClicked(Event : TAbstractEvent);
     procedure OnOverflowYClicked(Event : TAbstractEvent);
     procedure OnOverlayClicked(Event : TAbstractEvent);
-    procedure OnThinClicked(Event : TAbstractEvent);
+    procedure OnHaveButtonsClicked(Event : TAbstractEvent);
     procedure OnRTLClicked(Event : TAbstractEvent);
+    procedure OnThinClicked(Event : TAbstractEvent);
     procedure OnBothEdgesClicked(Event : TAbstractEvent);
+    procedure OnColorClicked(Event : TAbstractEvent);
   private
   public
     procedure ApplyScrollbarGutter;
@@ -69,12 +73,12 @@ begin
   OverflowXAuto.Checked:=true;
   OverflowYAuto.Checked:=true;
 
-  OverlayCheckBox.Checked:=ScrollbarsOverlay;
   AutoHideCheckBox.Checked:=ScrollbarsAutoHide;
+  HaveButtonsCheckBox.Checked:=ScrollbarsHaveButtons;
+  OverlayCheckBox.Checked:=ScrollbarsOverlay;
 
   // todo: step buttons
   // todo: stable
-  // todo: scrollbar-color: red #f004
 end;
 
 procedure TMainForm.OnAutoHideClicked(Event: TAbstractEvent);
@@ -105,6 +109,11 @@ begin
   ScrollbarsOverlay:=OverlayCheckBox.Checked;
 end;
 
+procedure TMainForm.OnHaveButtonsClicked(Event: TAbstractEvent);
+begin
+  ScrollbarsHaveButtons:=HaveButtonsCheckBox.Checked;
+end;
+
 procedure TMainForm.OnThinClicked(Event: TAbstractEvent);
 begin
   if ThinCheckBox.Checked then
@@ -126,6 +135,14 @@ begin
   ApplyScrollbarGutter;
 end;
 
+procedure TMainForm.OnColorClicked(Event: TAbstractEvent);
+begin
+  if ColorCheckBox.Checked then
+    ScrollDiv1.SetStyleAttr('scrollbar-color','red #f006')
+  else
+    ScrollDiv1.SetStyleAttr('scrollbar-color','');
+end;
+
 procedure TMainForm.ApplyScrollbarGutter;
 var
   s: String;

src/base/fresnel.dom.pas

@@ -1676,6 +1676,7 @@ type
     FLayouter: TFresnelLayouter;
     FOnDomChanged: TNotifyEvent;
     FScrollbarsAutoHide: boolean;
+    FScrollbarsHaveButtons: boolean;
     FScrollbarsOverlay: boolean;
     FScrollbarsThinWidth: array[boolean] of TFresnelLength;
     FScrollbarsWidth: array[boolean] of TFresnelLength;
@@ -1691,6 +1692,7 @@ type
     procedure SetScrollbarsAutoHide(AValue: boolean);
     procedure SetScrollbarsColors(Col: TFresnelScrollbarColor; AValue: TFPColor
       );
+    procedure SetScrollbarsHaveButtons(AValue: boolean);
   protected
     class var FFresnelEventsRegistered: boolean;
   protected
@@ -1820,6 +1822,7 @@ type
     property DPI[IsHorizontal: boolean]: TFresnelLength read GetDPI write SetDPI;
 
     property ScrollbarsAutoHide: boolean read FScrollbarsAutoHide write SetScrollbarsAutoHide;
+    property ScrollbarsHaveButtons: boolean read FScrollbarsHaveButtons write SetScrollbarsHaveButtons;
     property ScrollbarsOverlay: boolean read FScrollbarsOverlay write SetScrollbarsOverlay;
     property ScrollbarsWidth[IsHorizontal: boolean]: TFresnelLength read GetScrollbarsWidth write SetScrollbarsWidth;
     property ScrollbarsThinWidth[IsHorizontal: boolean]: TFresnelLength read GetScrollbarsThinWidth write SetScrollbarsThinWidth;
@@ -6738,6 +6741,13 @@ begin
   Invalidate;
 end;
 
+procedure TFresnelViewport.SetScrollbarsHaveButtons(AValue: boolean);
+begin
+  if FScrollbarsHaveButtons=AValue then Exit;
+  FScrollbarsHaveButtons:=AValue;
+  Invalidate;
+end;
+
 function TFresnelViewport.GetDPI(IsHorizontal: boolean): TFresnelLength;
 begin
   Result:=FDPI[IsHorizontal];

src/base/fresnel.renderer.pas

@@ -714,7 +714,7 @@ var
   LNode: TUsedLayoutNode;
   BarWidth, BarHeight: TFresnelLength;
   r, aPaddingBox: TFresnelRect;
-  aScrollbar: TRendererScrollBar;
+  HorzScrollbar, VertScrollbar: TRendererScrollBar;
   IsLeft, HasVertBar, HasHorzBar: Boolean;
   VP: TFresnelViewport;
 begin
@@ -741,7 +741,7 @@ begin
   aPaddingBox:=El.GetUsedPaddingBox;
   //writeln('TFresnelRenderer.DrawScrollBars ',El.Name,' PaddingBox=',aPaddingBox.ToString);
 
-  aScrollbar:=TRendererScrollBar(El.ScrollBarVertical);
+  VertScrollbar:=TRendererScrollBar(El.ScrollBarVertical);
   if HasVertBar then
   begin
     r:=aPaddingBox;
@@ -753,24 +753,24 @@ begin
       r.Bottom:=Max(r.Top,r.Bottom-BarHeight);
 
     if r.IsEmpty then
-      aScrollbar.Free
+      VertScrollbar.Free
     else begin
-      if aScrollbar=nil then
-        aScrollbar:=CreateScrollBar(El,false);
-      aScrollbar.Size:=LNode.ScrollHeight;
-      aScrollbar.Page:=El.ClientHeight;
-      aScrollbar.Position:=El.ScrollTop;
-      aScrollbar.Box:=r;
-      aScrollbar.HasColor:=El.GetComputedScrollbarColor(aScrollbar.ThumbColor,aScrollbar.TrackColor);
+      if VertScrollbar=nil then
+        VertScrollbar:=CreateScrollBar(El,false);
+      VertScrollbar.Size:=LNode.ScrollHeight;
+      VertScrollbar.Page:=El.ClientHeight;
+      VertScrollbar.Position:=El.ScrollTop;
+      VertScrollbar.Box:=r;
+      VertScrollbar.HasColor:=El.GetComputedScrollbarColor(VertScrollbar.ThumbColor,VertScrollbar.TrackColor);
 
       {$IFDEF VerboseFresnelScrolling}
       writeln('TFresnelRenderer.DrawScrollBars ',El.Name,' Vertical ScrollHeight=',FloatToCSSStr(El.ScrollHeight),' ClientHeight=',FloatToCSSStr(El.ClientHeight),' ScrollTop=',FloatToCSSStr(El.ScrollTop)+' BarWidth='+FloatToCSSStr(BarWidth)+' r='+r.ToString);
       {$ENDIF}
     end;
-  end else if aScrollbar<>nil then
-    aScrollbar.Free;
+  end else if VertScrollbar<>nil then
+    VertScrollbar.Free;
 
-  aScrollbar:=TRendererScrollBar(El.ScrollBarHorizontal);
+  HorzScrollbar:=TRendererScrollBar(El.ScrollBarHorizontal);
   if HasHorzBar then
   begin
     r:=aPaddingBox;
@@ -784,25 +784,24 @@ begin
     end;
 
     if r.IsEmpty then
-      aScrollbar.Free
+      HorzScrollbar.Free
     else begin
-      if aScrollbar=nil then
-        aScrollbar:=CreateScrollBar(El,true);
-      aScrollbar.Size:=LNode.ScrollWidth;
-      aScrollbar.Page:=El.ClientWidth;
+      if HorzScrollbar=nil then
+        HorzScrollbar:=CreateScrollBar(El,true);
+      HorzScrollbar.Size:=LNode.ScrollWidth;
+      HorzScrollbar.Page:=El.ClientWidth;
       if El.ComputedDirection=CSSRegistry.kwRTL then
-        aScrollbar.Position:=El.ScrollLeft+aScrollbar.Size-aScrollbar.Page
+        HorzScrollbar.Position:=El.ScrollLeft+HorzScrollbar.Size-HorzScrollbar.Page
       else
-        aScrollbar.Position:=El.ScrollLeft;
-      aScrollbar.Box:=r;
-      aScrollbar.HasColor:=El.GetComputedScrollbarColor(aScrollbar.ThumbColor,aScrollbar.TrackColor);
+        HorzScrollbar.Position:=El.ScrollLeft;
+      HorzScrollbar.Box:=r;
 
       {$IFDEF VerboseFresnelScrolling}
       writeln('TFresnelRenderer.DrawScrollBars ',El.Name,' Horizontal ScrollWidth=',FloatToCSSStr(El.ScrollWidth),' ClientWidth=',FloatToCSSStr(El.ClientWidth),' ScrollLeft=',FloatToCSSStr(El.ScrollLeft)+' BarHeight='+FloatToCSSStr(BarHeight)+' r='+r.ToString);
       {$ENDIF}
     end;
-  end else if aScrollbar<>nil then
-    aScrollbar.Free;
+  end else if HorzScrollbar<>nil then
+    HorzScrollbar.Free;
 
   if HasVertBar or HasHorzBar then
   begin
@@ -813,15 +812,21 @@ begin
         and (VP.GetFirstPointerCaptureEl(El)=nil)
     then
       exit;
-    if HasHorzBar then
+    if HorzScrollbar<>nil then
     begin
-      aScrollbar:=TRendererScrollBar(El.ScrollBarHorizontal);
-      aScrollbar.Draw(Self);
+      HorzScrollbar.HasColor:=El.GetComputedScrollbarColor(HorzScrollbar.ThumbColor,HorzScrollbar.TrackColor);
+      HorzScrollbar.Draw(Self);
     end;
-    if HasVertBar then
+    if VertScrollbar<>nil then
     begin
-      aScrollbar:=TRendererScrollBar(El.ScrollBarVertical);
-      aScrollbar.Draw(Self);
+      if HorzScrollbar<>nil then
+      begin
+        VertScrollbar.HasColor:=HorzScrollbar.HasColor;
+        VertScrollbar.ThumbColor:=HorzScrollbar.ThumbColor;
+        VertScrollbar.TrackColor:=HorzScrollbar.TrackColor;
+      end else
+        VertScrollbar.HasColor:=El.GetComputedScrollbarColor(VertScrollbar.ThumbColor,VertScrollbar.TrackColor);
+      VertScrollbar.Draw(Self);
     end;
     if HasVertBar and HasHorzBar then
     begin
@@ -836,7 +841,7 @@ begin
         r.Left:=Max(aPaddingBox.Left,r.Right-BarWidth);
       end;
       if not r.IsEmpty then
-        aScrollbar.DrawCorner(Self,r);
+        HorzScrollbar.DrawCorner(Self,r);
     end;
   end;
 end;