Is there way to control the size of a tab?

[jeffreyguenther]

Hi Tomas,

Is there a way to control the size of the space emit in CodeArea when I press tab? By default, it looks like it is about two tabs in length. Is there any way to change it to spaces?

[TomasMikula]

Hi Jeff,

the actual width of a tab is whatever TextFlow decides it to be (based on the font used). This happens to be 8 spaces with a fixed-width font. I don't think there is a way to control the width of a tab in TextFlow.

You can, however, change the behavior for the Tab key. This is how to do that with the latest 0.5 version.

import static javafx.scene.input.KeyCode.TAB;
import static org.fxmisc.wellbehaved.event.EventPattern.keyPressed;

import org.fxmisc.wellbehaved.event.EventHandlerHelper;

EventHandler<? super KeyEvent> tabHandler = EventHandlerHelper
        .on(keyPressed(TAB)).act(event -> codeArea.replaceSelection("    "))
        .create();
EventHandlerHelper.install(codeArea.onKeyPressedProperty(), tabHandler);

[jeffreyguenther]

Thanks Tomas!

[isjns]

This fix is not sufficient when you're displaying the content of a file in CodeArea. If the file contains tabs, those will still be presented as 8 white spaces when the file is presented. Only tabs that you've created yourself in the CodeArea will be presented as 4 white spaces.

Is there any solution to this that copes with that scenario as well?

[JordanMartinez]

You could via 2 mapping functions. The first maps from model-to-view: given a TAB in the model (the ESD), display N spaces in the view (the STA), where N = user's desired spaces count. The second maps from view-to-model: when user moves the caret around and N spaces are encountered, determine whether those spaces are N literal spaces or whether they represent a tab character, then deal with the movement accordingly.
As you can see, this would increase complexity in the logic and lead to unexpected bugs if not done properly.

Additionally, you could if you "reinvent the wheel" by designing a move nimble TextFlow with that support.

[stevedefazio]

I know that this is closed, but I wanted to chime in and say that simply by changing to a non-monospace font, you can solve your problem. So before you put too much work into it, look at if you really need that font type.

[swpalmer]

This is https://bugs.openjdk.java.net/browse/JDK-8130738

[swpalmer]

@TomasMikula Now that JavaFX 14 is delivered with https://bugs.openjdk.java.net/browse/JDK-8130738 addressed, can we get an API for this in RichTextFX?

[Jugen]

Will look into it. In the meantime you should be able to use the following CSS -fx-tab-size: in JavaFX 14.

[swpalmer]

@Jugen I've used that CSS successfully for TextExt, but I can't get it to work in a CodeArea. Would you have any idea why that is?

[Jugen]

See if this section in the Wiki helps .... ?

[swpalmer]

I still haven't figured out the magic combination, even with that info. Note also the section about TextFlow CSS is wrong. There is no ".text-flow" class. You can change TextFlow using the simple class name, e.g.: "TextFlow { -fx-tab-size: 4; }" .

It is also worth noting that the ".text" CSS does not work for plain Text nodes. As it hints in the docs, it is for text inside controls, Text is not a Control, it is a Shape. So "Text { -fx-tab-size: 4;}" works for it, but ".text { -fx-tab-size: 4 }" does not.

I can get tabs to change in plain TextExt instances with "TextExt { -fx-tab-size: 4; }", but that doesn't affect the tab size in any StyledClassedTextAreas. This may be related to how some attributes for Text doesn't affect Text nodes inside a TextFlow. You have to set that attribute on the TextFlow for it to work. As the docs for TextFlow state: "When a Text node is inside of a TextFlow, some of its properties are ignored."