strepsirrhini/libreoffice-online
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Center header/group lines in the pixel grid

Browse source 
Signed-off-by: Paris Oplopoios <paris.oplopoios@collabora.com>
Change-Id: I0b3abf10ee646a8f09d1dcc0a811df9299548e3c
This commit is contained in:
Paris Oplopoios 2024-01-08 14:25:39 +02:00 committed by Paris Oplopoios
parent 73a8f533af
commit 5d32ecc2ed
5 changed files with 40 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
browser/src/control/Control.ColumnGroup.ts
View file

@ -101,7 +101,7 @@ export class ColumnGroup extends GroupBase {
this.context.fillStyle = this.backgroundColor;
this.context.fillRect(this.transformRectX(startX, this._groupHeadSize), startY, this._groupHeadSize, this._groupHeadSize);
this.context.strokeStyle = 'black';
this.context.lineWidth = app.dpiScale;
this.context.lineWidth = 1.0;
this.context.strokeRect(this.transformRectX(startX + 0.5, this._groupHeadSize), startY + 0.5, this._groupHeadSize, this._groupHeadSize);
if (!group.hidden) {
@ -132,10 +132,12 @@ export class ColumnGroup extends GroupBase {
startX += this._groupHeadSize;
startX = startX >= this._cornerHeaderWidth + this._groupHeadSize ? startX: this._cornerHeaderWidth + this._groupHeadSize;
startY += this._groupHeadSize * 0.5;
startX = Math.round(startX) + 1;
startY = Math.round(startY);
this.context.strokeStyle = 'black';
this.context.lineWidth = app.dpiScale;
this.context.moveTo(this.transformX(startX + 0.5), startY + 0.5);
this.context.lineTo(this.transformX(endX - app.roundedDpiScale + 0.5), startY + 0.5);
this.context.lineWidth = 2.0;
this.context.moveTo(this.transformX(startX), startY);
this.context.lineTo(this.transformX(endX - app.roundedDpiScale), startY);
this.context.stroke();
}
}
@ -150,7 +152,7 @@ export class ColumnGroup extends GroupBase {
const startY = levelSpacing + (ctrlHeadSize + levelSpacing) * level;
ctx.strokeStyle = 'black';
ctx.lineWidth = app.dpiScale;
ctx.lineWidth = 1.0;
ctx.strokeRect(this.transformRectX(startX + 0.5, ctrlHeadSize), startY + 0.5, ctrlHeadSize, ctrlHeadSize);
// draw level number
ctx.fillStyle = this._textColor;

5
browser/src/control/Control.ColumnHeader.ts
View file

@ -150,8 +150,9 @@ export class ColumnHeader extends Header {
// draw column borders.
this.context.strokeStyle = this._borderColor;
this.context.lineWidth = app.dpiScale;
this.context.strokeRect(startX - 0.5, 0.5, entry.size, this.size[1]);
var offset = this.getLineOffset();
this.context.lineWidth = this.getLineWidth();
this.context.strokeRect(startX - offset, offset, entry.size, this.size[1]);
}
getHeaderEntryBoundingClientRect (index: number): Partial<DOMRect> {

14
browser/src/control/Control.RowGroup.ts
View file

@ -101,7 +101,7 @@ export class RowGroup extends GroupBase {
this.context.fillStyle = this.backgroundColor;
this.context.fillRect(this.transformRectX(startX, this._groupHeadSize), startY, this._groupHeadSize, this._groupHeadSize);
this.context.strokeStyle = 'black';
this.context.lineWidth = app.dpiScale;
this.context.lineWidth = 1.0;
this.context.strokeRect(this.transformRectX(startX + 0.5, this._groupHeadSize), startY + 0.5, this._groupHeadSize, this._groupHeadSize);
if (!group.hidden) {
@ -132,12 +132,14 @@ export class RowGroup extends GroupBase {
startY += this._groupHeadSize;
startY = startY >= this._cornerHeaderHeight + this._groupHeadSize ? startY: this._cornerHeaderHeight + this._groupHeadSize;
startX += this._groupHeadSize * 0.5;
startX = Math.round(startX);
startY = Math.round(startY) + 1;
this.context.strokeStyle = 'black';
this.context.lineWidth = app.dpiScale;
this.context.moveTo(this.transformX(startX + 0.5), startY + 0.5);
this.context.lineTo(this.transformX(startX + 0.5), endY - app.roundedDpiScale + 0.5);
this.context.lineWidth = 2.0;
this.context.moveTo(this.transformX(startX), startY);
this.context.lineTo(this.transformX(startX), endY - app.roundedDpiScale);
this.context.stroke();
this.context.lineTo(this.transformX(startX + this._groupHeadSize / 2), endY - app.roundedDpiScale + 0.5);
this.context.lineTo(Math.round(this.transformX(startX + this._groupHeadSize / 2)), endY - app.roundedDpiScale);
this.context.stroke();
}
}
@ -152,7 +154,7 @@ export class RowGroup extends GroupBase {
const startY = Math.round((this._cornerHeaderHeight - ctrlHeadSize) * 0.5);
ctx.strokeStyle = 'black';
ctx.lineWidth = app.dpiScale;
ctx.lineWidth = 1.0;
ctx.strokeRect(this.transformRectX(startX + 0.5, ctrlHeadSize), startY + 0.5, ctrlHeadSize, ctrlHeadSize);
// draw level number
ctx.fillStyle = this._textColor;

5
browser/src/control/Control.RowHeader.ts
View file

@ -147,8 +147,9 @@ export class RowHeader extends cool.Header {
// draw row borders.
this.context.strokeStyle = this._borderColor;
this.context.lineWidth = app.dpiScale;
this.context.strokeRect(0.5, startY - 0.5, this.size[0], entry.size);
var offset = this.getLineOffset();
this.context.lineWidth = this.getLineWidth();
this.context.strokeRect(offset, startY - offset, this.size[0], entry.size);
}
getHeaderEntryBoundingClientRect (index: number): Partial<DOMRect> {

21
browser/src/layer/tile/CanvasSectionContainer.ts
View file

@ -436,6 +436,22 @@ class CanvasSectionObject {
return false;
}
public getLineWidth(): number {
if (app.dpiScale > 1.0) {
return app.roundedDpiScale;
} else {
return app.dpiScale;
}
}
public getLineOffset(): number {
if (app.dpiScale > 1.0) {
return app.roundedDpiScale % 2 === 0 ? 0 : 0.5;
} else {
return 0.5;
}
}
constructor (options: SectionInitProperties) {
this.name = options.name;
this.backgroundColor = options.backgroundColor ? options.backgroundColor: null;
@ -2106,9 +2122,10 @@ class CanvasSectionContainer {
this.sections[i].onDraw(frameCount, elapsedTime, subsetBounds);
if (this.sections[i].borderColor) { // If section's border is set, draw its borders after section's "onDraw" function is called.
this.context.lineWidth = app.dpiScale;
var offset = this.sections[i].getLineOffset();
this.context.lineWidth = this.sections[i].getLineWidth();
this.context.strokeStyle = this.sections[i].borderColor;
this.context.strokeRect(0.5, 0.5, this.sections[i].size[0], this.sections[i].size[1]);
this.context.strokeRect(offset, offset, this.sections[i].size[0], this.sections[i].size[1]);
}
this.context.translate(-this.sections[i].myTopLeft[0], -this.sections[i].myTopLeft[1]);