horizontal scroll

This commit is contained in:
Jan Prochazka 2020-02-01 18:51:49 +01:00
parent 6f12b4fd14
commit 8291885d56
2 changed files with 27 additions and 13 deletions

View File

@ -95,6 +95,10 @@ export default function DataGrid({ params }) {
setFirstVisibleRowScrollIndex(value);
};
const handleColumnScroll = value => {
setFirstVisibleColumnScrollIndex(value);
};
function countColumnSizes() {
let canvas = document.createElement('canvas');
let context = canvas.getContext('2d');
@ -111,22 +115,23 @@ export default function DataGrid({ params }) {
// columnSizes.setExtraordinaryIndexes(this.getHiddenColumnIndexes(), this.getFrozenColumnIndexes());
columnSizes.setExtraordinaryIndexes([], []);
// for (let colIndex = 0; colIndex < columns.length; colIndex++) {
// //this.columnSizes.PutSizeOverride(col, this.columns[col].Name.length * 8);
// let column = columns[colIndex];
for (let colIndex = 0; colIndex < columns.length; colIndex++) {
//this.columnSizes.PutSizeOverride(col, this.columns[col].Name.length * 8);
let column = columns[colIndex];
// if (column.columnClientObject != null && column.columnClientObject.notNull) context.font = "bold 14px Helvetica";
// else context.font = "14px Helvetica";
context.font = "bold 14px Helvetica";
// let text = column.headerText;
// let headerWidth = context.measureText(text).width + 32;
let text = column.name;
let headerWidth = context.measureText(text).width + 32;
// if (column.columnClientObject != null && column.columnClientObject.icon != null) headerWidth += 16;
// if (this.getFilterOnColumn(column.uniquePath)) headerWidth += 16;
// if (this.getSortOrder(column.uniquePath)) headerWidth += 16;
// this.columnSizes.putSizeOverride(colIndex, headerWidth);
// }
columnSizes.putSizeOverride(colIndex, headerWidth);
}
// let headerWidth = this.rowHeaderWidthDefault;
// if (this.rowCount) headerWidth = context.measureText(this.rowCount.toString()).width + 8;
@ -234,6 +239,7 @@ export default function DataGrid({ params }) {
minimum={0}
maximum={columns.length - 1}
viewportRatio={gridScrollAreaWidth / columnSizes.getVisibleScrollSizeSum()}
onScroll={handleColumnScroll}
/>
<VerticalScrollBar
minimum={0}

View File

@ -46,8 +46,16 @@ export function HorizontalScrollBar({
if (node) node.scrollLeft = Math.floor(position);
}, [valueToSetDate]);
const handleScroll = () => {
const position = node.scrollLeft;
const ratio = position / (contentSize - width);
if (ratio < 0) return 0;
let res = ratio * (maximum - minimum + 1) + minimum;
onScroll(Math.floor(res + 0.3));
};
return (
<StyledHorizontalScrollBar ref={ref}>
<StyledHorizontalScrollBar ref={ref} onScroll={handleScroll}>
<StyledHorizontalScrollContent style={{ width: `${contentSize}px` }}>&nbsp;</StyledHorizontalScrollContent>
</StyledHorizontalScrollBar>
);