GithubHelp home page GithubHelp logo

UI line number about xi-mac HOT 12 CLOSED

xi-editor avatar xi-editor commented on September 26, 2024 1
UI line number

from xi-mac.

Comments (12)

takkuumi avatar takkuumi commented on September 26, 2024 2

@cbrewster @cmyr i am a web developer. in CSS compute fonts width throw font-size*characters. i dont know any help for you.

from xi-mac.

cmyr avatar cmyr commented on September 26, 2024 2

@cbrewster yea I was thinking about the corollary of this problem during the initial implementation: in a file with 10m lines, it looks weird to have a really wide gutter with a single number.

I agree with you in the general case, and I think for the time being just using gutterColumns * stringWidth("9") seems reasonable?

from xi-mac.

raphlinus avatar raphlinus commented on September 26, 2024 1

from xi-mac.

cbrewster avatar cbrewster commented on September 26, 2024

This happens when using a non-monospaced font.

from xi-mac.

cmyr avatar cmyr commented on September 26, 2024

yea we don't know how to measure 'character width' in a non-monospaced font. That's a holdover from older code, though, we could definitely be doing better here, by actually measuring the string in updateGutterWidth()

from xi-mac.

rkusa avatar rkusa commented on September 26, 2024

I am wondering if the naive solution of gutterColumns * max(stringWidth("0"), stringWidth("1"), stringWidth("2"), ..., stringWidth("9")) (i.e. find out which of the numbers from 0-9 is the widest und use that as a replacement for the current textMetrics.fontWidth) is good enough?

This does not take kerning and ligatures into account, but since they usually tighten the spacing instead of widening it (this assumption could be wrong), they might not be an issue.

Otherwise, we could calculate the actual stringWidth of the numbers and maintain a cache for the widest number per column count.

from xi-mac.

cmyr avatar cmyr commented on September 26, 2024

I don't particularly dislike this approach? Seems like a reasonable hack. Another option to consider is just baking in Inconsolata, and not letting the gutter font be changed... 🤔

from xi-mac.

cmyr avatar cmyr commented on September 26, 2024

Another option: when we're drawing each line number, we calculate expected drawing bounds. We could check this against the current gutter width, and if the width is inadequate we could fire a notification or otherwise indicate that the gutterview needs to be resized.

We could also just stash the max of this in the gutterview, and invalidate if the line count decreases?

from xi-mac.

cbrewster avatar cbrewster commented on September 26, 2024

Take the following example:
There is a file with 100+ lines, but we are only viewing the top 30 lines. The gutter will be the max width for 2 characters, but then as you scroll with lines 100+, the gutter would then resize to 3 characters wide. It would seem odd for the gutter to change width while scrolling.

from xi-mac.

jansol avatar jansol commented on September 26, 2024

Shouldn't the gutter, being fixed UI, be using the System font anyway? (San Francisco or whatever the System font happens to be) There are functions for getting that and NSFont IIRC has a method for measuring strings.

from xi-mac.

cmyr avatar cmyr commented on September 26, 2024

@jansol this is definitely a design decision. Xcode, for instance, has a predefined gutter font (which may not be the system default?), but sublime text uses the user font.

from xi-mac.

jansol avatar jansol commented on September 26, 2024

Either way, this looks like the way to go. At least as long as our screens aren't going to fit 10k lines.

from xi-mac.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.