i have a TableView with a vertical Slider{} component and a horizontal Slider{} component for the table. i don t to use the horizontalScrollBar and verticalScrollBar of the table. the table have 8 columns, but only 6 of them are displayed when i open the table and with the horizontal Slider{} component i want to scroll to see the other 2 columns. i make the implementation for the vertical Slider{} to work well, and then try to do the opposite for the horizontal Slider{}, there s the code:

import QtQuick.Window 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls 2.15
import QtQuick.Controls.Styles 1.4
import QtQuick.Layouts 1.3
import paymentsystem 1.0

Item {
    id: item
    property string imagineTabel: ""
    property bool margin: control.from > 0
    property bool sliderValueChanged: false
    property bool sliderValueChangedH: false
    property var model: null

    property var columns: []
    property int columnCount: {
        if(columns.length > 6) {
            horizontalScrollBar = Qt.ScrollBarAlwaysOff;
            sliderH = true;
            return 6;
        }
        else
        {  return columns.length; }
    }
    property var horizontalScrollBar: Qt.ScrollBarAlwaysOff
    property var verticalScrollBar: Qt.ScrollBarAlwaysOff
    property bool sliderH: false

//-------------------------------------------------------------------------------------------------
//slider orizontal
    Slider {
        id: controlH
        anchors.top: tableImg.bottom
        anchors.topMargin: scrMgr.size.height * 0.0072 //7
        from: tableView.maxLeftColumn
        to: 0
        visible: item.sliderH
        value: tableView.leftColumn

        onValueChanged: {
            if(sliderValueChangedH) {
                sliderValueChangedH = false;
                return;
            }
            var tmpValH = Math.round(controlH.value);
            tmpValH = Math.max(0, tmpValH);
            tmpValH = Math.min(tableView.maxLeftColumn, tmpValH);

            sliderValueChangedH = true;
            tableView.leftColumn = tmpValH;
        }

        background: Rectangle {
            x: controlH.leftPadding
            y: controlH.topPadding + controlH.availableHeight / 2 - height / 2
            implicitWidth: tableImg.width
            implicitHeight: scrMgr.size.height * 0.06 //32
            width: controlH.availableWidth
            height: implicitHeight
            color: "#00000000"

            CustomImage {
                source: resMgr.getResource("qrc:/Images/Slider/SliderbarH.svg")
                anchors.fill: parent
                utilBox {t_left: 3.3; t_right: 3.4; t_top: 0; t_bottom: 0;}
            }
        }

        handle: Rectangle {
            x: controlH.leftPadding + controlH.visualPosition * (controlH.availableWidth - width)
            y: controlH.topPadding + controlH.availableHeight / 2 - height / 2

            implicitWidth: scrMgr.size.width * 0.0364 //35
            implicitHeight: scrMgr.size.height * 0.0648 //35
            color: "#00000000"

            CustomImage {
                source: resMgr.getResource("qrc:/Images/Slider/Sliderdot.svg")
                anchors.fill: parent
                utilBox {t_left: 19; t_right: 20; t_top: 17; t_bottom: 23;}
            }
        }
    }
//-------------------------------------------------------------------------------------------------
//slider vertical
    Slider {
        id: control
        anchors.verticalCenter: tableImg.verticalCenter
        anchors.left: tableImg.right
        anchors.leftMargin: scrMgr.size.width * 0.0072 //7
        from: tableView.maxTopRow
        to: 0
        orientation: Qt.Vertical
        visible: item.margin //control.from > 0
        onValueChanged: {
            if(sliderValueChanged) {
                sliderValueChanged = false;
                return;
            }
            var tmpVal = Math.round(control.value);
            tmpVal = Math.max(0, tmpVal);
            tmpVal = Math.min(tableView.maxTopRow, tmpVal);

            sliderValueChanged = true;
            tableView.positionViewAtRow(tmpVal, ListView.Beginning);
        }

        background: Rectangle {
            x: control.leftPadding + control.availableWidth / 2 - width / 2
            y: control.topPadding
            implicitWidth: scrMgr.size.width * 0.0364 //35
            implicitHeight: tableImg.height
            width: implicitWidth
            height: control.availableHeight
            color: "#00000000"

            CustomImage {
                source: resMgr.getResource("qrc:/Images/Slider/Sliderbar.svg")
                anchors.fill: parent
                utilBox {t_left: 0; t_right: 0; t_top: 1.9; t_bottom: 4.3;}
            }
        }

        handle: Rectangle {
            x: control.leftPadding + control.availableWidth / 2 - width / 2
            y: control.topPadding + control.visualPosition * (control.availableHeight - height);

            implicitWidth: scrMgr.size.width * 0.0364 //35
            implicitHeight: scrMgr.size.height * 0.0648 //35
            color: "#00000000"

            CustomImage {
                source: resMgr.getResource("qrc:/Images/Slider/Sliderdot.svg")
                anchors.fill: parent
                utilBox {t_left: 19; t_right: 20; t_top: 17; t_bottom: 23;}
            }
        }
    }
//-------------------------------------------------------------------------------------------------
//imagine tabel
    CustomImage {
        id: tableImg
        source: item.imagineTabel
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.top: parent.top
        anchors.bottom: parent.bottom
    }
//-------------------------------------------------------------------------------------------------
    Connections {
        target: tableView.flickableItem
        function onMovementEnded() {
            tableView.positionViewAtRow(tableView.topRow, ListView.Beginning);
        }
    }
//-------------------------------------------------------------------------------------------------
//tabel
    TableView {
        id: tableView
        anchors.fill: tableImg
        backgroundVisible: false
        clip: true
        verticalScrollBarPolicy:   Qt.ScrollBarAlwaysOff;
        horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff;

        property int rowHeight: 40 * scrMgr.size.height / 1080
        property int startYContent: 0
        property int topYcontent: tableView.flickableItem.contentY
        property int topRow: topYcontent + tableView.rowAt(5,tableView.startYContent + 5) - topYcontent //keep add and substract in order to have active bindings
        property int maxVisibleRows: -1
        property int maxTopRow: Math.max(0, tableView.rowCount - maxVisibleRows)

        property int rowWidth: 400 * scrMgr.size.width / 1920
        property int startXContent: 0
        property int topXContent: tableView.flickableItem.contentX
        property int leftColumn: Math.floor(topXContent / tableView.rowWidth)
        property int maxVisibleColumns: -1
        property int maxLeftColumn: Math.max(0, tableView.columnCount - maxVisibleColumns)

        onLeftColumnChanged: {
            if(sliderValueChangedH) {
                sliderValueChangedH = false;
                return;
            }
            sliderValueChangedH = true;
            controlH.value = leftColumn;
        }

        onTopRowChanged: {
            if(sliderValueChanged) {
                sliderValueChanged = false;
                return;
            }
            sliderValueChanged = true;
            control.value = topRow;
        }

        resources:
        {
            var length = columns.length
            var temp = []
            for(var i = 0; i < length; i++)
            {
                temp.push(columnComponent.createObject(tableView, {"role": columns[i].role, "title": columns[i].title}));
            }

            return temp
        }

        model: item.model

        style: TableViewStyle {

            frame: Rectangle {
                color: "#00000000"
                border.color: "#00000000"
            }

            alternateBackgroundColor: "#00000000"

            itemDelegate: Item {
                x: scrMgr.size.width * 0.00556 //3
                y: -scrMgr.size.height * 0.00926 //-5
                height: tableView.rowHeight //19
                width: tableView.rowWidth
                Text {
                    id: textTable
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.fill: parent
                    verticalAlignment: Text.AlignVCenter
                    horizontalAlignment: styleData.role === "Descriere" ? Text.AlignLeft : Text.AlignHCenter
                    color: styleData.textColor
                    elide: styleData.elideMode
                    text: styleData.value
                    font.pixelSize: scrMgr.size.height * 0.028
                    visible: tableView.topRow >= 0 ? (styleData.row >= tableView.topRow) : true
                }
            }

            rowDelegate: Rectangle{
                width: tableView.rowWidth
                height: tableView.rowHeight
                color: "#00000000";
            }

            headerDelegate: Rectangle {
                id: headerComp
                height: textItem.implicitHeight * 1.2 + scrMgr.size.height * 0.0277 //15
                width: textItem.implicitWidth
                color: "#00000000";

                Text {
                    id: textItem
                    anchors.fill: parent
                    font.pixelSize: scrMgr.size.height * 0.028
                    verticalAlignment: Text.AlignVCenter
                    horizontalAlignment: Text.AlignHCenter
                    anchors.leftMargin: scrMgr.size.width * 0.0084 //8
                    anchors.topMargin: scrMgr.size.height * 0.015 //8
                    text: styleData.value
                    color: "white"
                }

                Component.onCompleted: {
                    tableView.startYContent = headerComp.y + headerComp.height;
                    tableView.maxVisibleRows = (((tableView.height - headerComp.y) / tableView.rowHeight) - 1) - (horizontalScrollBar == Qt.ScrollBarAlwaysOn ? 1 : 0);

                    tableView.startXContent = headerComp.x + headerComp.width;
                    tableView.maxVisibleColumns = (((tableView.width - headerComp.x) / tableView.rowWidth) - 1) - (verticalScrollBar == Qt.ScrollBarAlwaysOn ? 0 : 1);
                }
            }
        }
    }

    Component {
        id: columnComponent
        TableViewColumn{ width: tableView.width / item.columnCount; movable: false; }
    }
}

any solutions ? https://imgur.com/a/dpORSa8 here s a photo with the table after the column "Remaining" are 2 more columns and i want to see them p.s. i don t want to display all 8 columns at once in the table because they are to cramped