# Putting a large pict in a text%: scroll bar problems

**URL:** <https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700>\
**Category:** Questions & Answers\
**Tags:** gui, pict\
**Created:** [February 4, 2024, 7:28pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700 "2024-02-04T19:28:17Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![benknoble](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/benknoble/32/16_2.png) [@benknoble](https://racket.discourse.group/u/benknoble)\
**Post date:** [February 4, 2024, 7:28pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/1 "2024-02-04T19:28:17Z")

</div>

To reproduce:

1. `raco pkg install https://github.com/benknoble/frosthaven-manager#rich-text-protocol`
2. `racket -l frosthaven-manager/t` (t for "test example" or some such)

 ![Screenshot of frosthaven-manager/t program showing initial GUI state where the scrollbar is at the top of the editor and shows some text](https://global.discourse-cdn.com/free1/uploads/racket/original/2X/a/aeae1a204e2c43dd7b7a36ff341e278eaffc30f6.png)  
 ![Screenshot of the same application after scrolling to the bottom. The image is displayed only to the ascent line and is otherwise cut off.](https://global.discourse-cdn.com/free1/uploads/racket/original/2X/6/6f7a934de4260850ef3eb8874039c4e69f1bcd33.png)

I get an `explain`ed `pict` and then a GUI Easy-built widget displaying some text and the same `pict` (in a `text%`, via `pict-snip%`). But the scroll-bar won't let me scroll to where I believe the bottom of the editor is unless I make the window bigger.

In my application, I can't reasonably make the window bigger: I'd like to make the scroll bar work as I expect (that is, the bottom of the editor extends to the bottom of the pict in this example).

I mentioned in Discord that I tried `baseless` because I suspected the ascent line was the problem (see the "cutoff"). This had no apparent effect.

I now think the descent line is actually the problem based on the Pict docs and the code in `pict-snip%`, but I'm not sure how to adjust it.

Does anyone know what's actually happening here and how to fix it?

[The code that creates the GUI widgets](https://github.com/benknoble/frosthaven-manager/blob/rich-text-protocol/gui/rich-text-display.rkt) is probably the most relevant, followed by the [example program](https://github.com/benknoble/frosthaven-manager/blob/rich-text-protocol/t.rkt).

---

<div class="post-metadata">

**Author:** ![robby](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/robby/32/7_2.png) [@robby](https://racket.discourse.group/u/robby)\
**Post date:** [February 4, 2024, 8:30pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/2 "2024-02-04T20:30:45Z")

</div>

Probably the pict-snip% needs some options where it allows scroll steps inside itself in certain situations. I'm not sure what the best way to go is, but I believe the snip object is part of the story in the scrollbar.

---

<div class="post-metadata">

**Author:** ![alexh](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/alexh/32/315_2.png) [@alexh](https://racket.discourse.group/u/alexh)\
**Post date:** [February 5, 2024, 8:55am UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/3 "2024-02-05T08:55:05Z")

</div>

To follow on from Robby's reply, `pict-snip%` needs to be extended with the `get-num-scroll-steps`, `get-scroll-step-offset` and `find-scroll-step` methods. `image-snip%` already impements those, so probably this is just an ommision that they are missing from `pict-snip%`.

Here is an example of how it would work:

```scheme
#lang racket/gui
(require pict/snip pict)

;; pixels per scroll step, can be set 1 for smooth scrolling
(define ppss 10.0)

(define pict-snip-with-fixed-scroll%
  (class pict-snip%
    (init)
    (super-new)

    (define/override (get-num-scroll-steps)
      (define height (pict-height (send this get-pict)))
      (exact-ceiling (/ height ppss)))

    (define/override (get-scroll-step-offset offset)
      (exact-floor (* offset ppss)))

    (define/override (find-scroll-step y)
      (exact-floor (/ y ppss)))))

(define f (new frame% [label "Test Frame"] [width 400] [height 300]))
(define c (new editor-canvas% [parent f]))
(define t (new text%))
(send c set-editor t)

(send t insert (new pict-snip-with-fixed-scroll% [pict (disk 513)]))
(send f show #t)

```

Alex.

---

<div class="post-metadata">

**Author:** ![benknoble](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/benknoble/32/16_2.png) [@benknoble](https://racket.discourse.group/u/benknoble)\
**Post date:** [February 5, 2024, 1:18pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/4 "2024-02-05T13:18:06Z")

</div>

Thanks; I'll try adding that via mixin and report back.

---

<div class="post-metadata">

**Author:** ![robby](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/robby/32/7_2.png) [@robby](https://racket.discourse.group/u/robby)\
**Post date:** [February 5, 2024, 1:35pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/5 "2024-02-05T13:35:10Z")

</div>

That's great; thank you @alexh ! I made a pull request based on your code:

[add the `pixels-per-scroll-step` init argument by rfindler · Pull Request #4 · racket/pict-snip · GitHub](https://github.com/racket/pict-snip/pull/4)

I made the new argument default to a value that is the same as the current behavior. It might be better to default to something clever based on the line that the snip is in but I've not tried to see if that's something one can do via the snip admin interface or not. Defaulting to `10` is reasonable to me too, if folks think that's better.

> [@benknoble](#):
>
> Thanks; I'll try adding that via mixin and report back.

Oh, sorry, @benknoble . I hope I didn't duplicate your work!

---

<div class="post-metadata">

**Author:** ![benknoble](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/benknoble/32/16_2.png) [@benknoble](https://racket.discourse.group/u/benknoble)\
**Post date:** [February 5, 2024, 3:04pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/6 "2024-02-05T15:04:53Z")

</div>

Not at all; I'm going to try locally 🙂

---

<div class="post-metadata">

**Author:** ![benknoble](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/benknoble/32/16_2.png) [@benknoble](https://racket.discourse.group/u/benknoble)\
**Post date:** [February 5, 2024, 3:11pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/7 "2024-02-05T15:11:09Z")

</div>

Yep, Alex's code worked. I'll switch to the next version of pict-snip when it releases 🙂

---

<div class="post-metadata">

**Author:** ![alexh](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/alexh/32/315_2.png) [@alexh](https://racket.discourse.group/u/alexh)\
**Post date:** [February 5, 2024, 10:50pm UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/8 "2024-02-05T22:50:20Z")

</div>

> [@robby](#):
>
> Defaulting to `10` is reasonable to me too, if folks think that's better

`image-snip%` uses a value of 50 (hard coded inside the module). `plot-snip%`, which is derived from `image-snip%`, also uses the same value. One option would be to use the value 50 in `pict-snip%` for consistency.

Another option would be to use 1 for both `pict-snip%` and `image-snip%`, and perhaps as the default scroll step for all snips, which would make the applications feel more modern, since smooth scrolling is used everywhere now. I experimented with a value of 1 (smooth scrolling) and seems to work fine (I have an older machine).

Alex.

---

<div class="post-metadata">

**Author:** ![robby](https://yyz2.discourse-cdn.com/free1/user_avatar/racket.discourse.group/robby/32/7_2.png) [@robby](https://racket.discourse.group/u/robby)\
**Post date:** [February 6, 2024, 12:50am UTC](https://racket.discourse.group/t/putting-a-large-pict-in-a-text-scroll-bar-problems/2700/9 "2024-02-06T00:50:12Z")

</div>

> [@alexh](#):
>
> Another option would be to use 1 for both `pict-snip%` and `image-snip%`, and perhaps as the default scroll step for all snips, which would make the applications feel more modern, since smooth scrolling is used everywhere now. I experimented with a value of 1 (smooth scrolling) and seems to work fine (I have an older machine).

I tried it out too (on the same example you posted above) and I do agree that something small would work thanks to some improvements in recent years for trackpad scrolling and refreshing. But, for me at least, 2 seemed to feel a bit better than 1. What do you think of 2?
