mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-18 18:46:19 +08:00
fix(editor): adapt font size in turbo renderer (#10858)
This commit is contained in:
@@ -39,6 +39,10 @@ export class ParagraphLayoutHandlerExtension extends BlockLayoutHandlerExtension
|
||||
};
|
||||
|
||||
paragraphNodes.forEach(paragraphNode => {
|
||||
const computedStyle = window.getComputedStyle(paragraphNode);
|
||||
const fontSizeStr = computedStyle.fontSize;
|
||||
const fontSize = parseInt(fontSizeStr);
|
||||
|
||||
const sentences = segmentSentences(paragraphNode.textContent || '');
|
||||
const sentenceLayouts = sentences.map(sentence => {
|
||||
const sentenceRects = getSentenceRects(paragraphNode, sentence);
|
||||
@@ -60,6 +64,7 @@ export class ParagraphLayoutHandlerExtension extends BlockLayoutHandlerExtension
|
||||
return {
|
||||
text: sentence,
|
||||
rects,
|
||||
fontSize,
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
@@ -9,6 +9,7 @@ import { BlockLayoutPainterExtension } from '@blocksuite/affine-gfx-turbo-render
|
||||
interface SentenceLayout {
|
||||
text: string;
|
||||
rects: TextRect[];
|
||||
fontSize: number;
|
||||
}
|
||||
|
||||
export interface ParagraphLayout extends BlockLayout {
|
||||
@@ -24,8 +25,7 @@ const meta = {
|
||||
|
||||
const debugSentenceBorder = false;
|
||||
|
||||
function getBaseline() {
|
||||
const fontSize = 15;
|
||||
function getBaseline(fontSize: number) {
|
||||
const lineHeight = 1.2 * fontSize;
|
||||
|
||||
const A = fontSize * (meta.hHeadAscent / meta.emSize); // ascent
|
||||
@@ -89,12 +89,14 @@ class ParagraphLayoutPainter implements BlockLayoutPainter {
|
||||
|
||||
if (!isParagraphLayout(layout)) return; // cast to ParagraphLayout
|
||||
|
||||
const fontSize = 15;
|
||||
ctx.font = `300 ${fontSize}px Inter`;
|
||||
const baselineY = getBaseline();
|
||||
const renderedPositions = new Set<string>();
|
||||
|
||||
layout.sentences.forEach(sentence => {
|
||||
const fontSize = sentence.fontSize;
|
||||
const baselineY = getBaseline(fontSize);
|
||||
if (fontSize !== 15) return; // TODO: fine-tune for heading font sizes
|
||||
|
||||
ctx.font = `${fontSize}px Inter`;
|
||||
ctx.strokeStyle = 'yellow';
|
||||
sentence.rects.forEach(textRect => {
|
||||
const x = textRect.rect.x - layoutBaseX;
|
||||
|
||||
Reference in New Issue
Block a user