在 ACE 编辑器中更改行高？

Question

如何更改 ace 编辑器的行高？

有没有 API 可以做到这一点？增加行高也应该增加装订线高度和光标高度，但从他们的文档中似乎丢失了。

虽然我写这篇文章并不走运，

editor.setOptions({
    lineHeight: "40px"
});

我做了一些 CSS hack，但它再次破坏了编辑器布局

div.ace_gutter-cell, div.ace_line {
    padding-top: 10px;
    padding-bottom: 10px;
    height: 20px !important; 
    /* border: 1px solid #ccc; */
}

Answer 1

更改字体大小会更改行高，包括光标和间距。

editor.setOptions({
        fontSize: "20px"    
    });

Answer 2

您可以使用

editor.container.style.lineHeight = 2
editor.renderer.updateFontSize()

类似于 fontSize 选项的作用 https://github.com/ajaxorg/ace/blob/v1.2.3/lib/ace/virtual_renderer.js#L1703-L1710

Answer 3

您只需更改 css 中的 line-height 属性即可自动完成弹出容器。

.ace_editor.ace_autocomplete {
    line-height: 36px;
}

以上代码将使下拉选项的高度为 36px。

Answer 4

如果您想为应用中的每个 ace-editor 实例全局设置 fontSize，则可以使用

    ace.config.set('basePath', 'https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.9/');
    ace.config.set('fontSize', '25px');
    var htmlEditor = ace.edit("html-editor");

在 ACE 编辑器中更改行高？

Changing line height in ACE editor?

javascript

ace-editor