Question

有谁知道如何删除这个间距？

以下这些行会减少它们但不会完全删除。

margins.top: 0
margins.bottom: 0
margins.left: 0
margins.right: 0

更新我添加了一些代码。可能这有助于确定我的问题。最初箭头所在的空白区域用于图例和刻度值。我没有改变源代码我无能为力。

ScopeView.qml

import QtQuick 2.0
import QtCharts 2.1

ChartView {
    id: chartView

    animationOptions: ChartView.NoAnimation
    theme: ChartView.ChartThemeQt
    legend.visible: false

    margins.top: 0
    margins.bottom: 0
    margins.left: 0
    margins.right: 0

    backgroundRoundness: 0

    property bool openGL: true
    onOpenGLChanged: {
        series("signal 1").useOpenGL = openGL;
    }

    ValueAxis {
        id: axisY1
        min: -1
        max: 4
        labelsVisible: false
        tickCount: 3

        color: "transparent"
    }

    ValueAxis {
        id: axisX
        min: 0
        max: 1024

        labelsVisible: false
        tickCount: 4

        color: "transparent"
    }

    LineSeries {
        id: lineSeries1
        name: "signal 1"
        axisX: axisX
        axisY: axisY1
        useOpenGL: chartView.openGL
        color: "#44D77B"
    }

    Timer {
        id: refreshTimer
        interval: 1 / 60 * 1000 // 60 Hz
        running: true
        repeat: true
        onTriggered: {
            dataSource.update(chartView.series(0));
        }
    }

    function changeSeriesType(type) {
        chartView.removeAllSeries();

        // Create two new series of the correct type. Axis x is the same for both of the series,
        // but the series have their own y-axes to make it possible to control the y-offset
        // of the "signal sources".
        if (type == "line") {
            var series1 = chartView.createSeries(ChartView.SeriesTypeLine, "signal 1",
                                                 axisX, axisY1);
            series1.useOpenGL = chartView.openGL
        } else {
            var series1 = chartView.createSeries(ChartView.SeriesTypeScatter, "signal 1",
                                                 axisX, axisY1);
            series1.markerSize = 2;
            series1.borderColor = "transparent";
            series1.useOpenGL = chartView.openGL
        }
    }

    function createAxis(min, max) {
        // The following creates a ValueAxis object that can be then set as a x or y axis for a series
        return Qt.createQmlObject("import QtQuick 2.0; import QtCharts 2.0; ValueAxis { min: "
                                  + min + "; max: " + max + " }", chartView);
    }

    function setAnimations(enabled) {
        if (enabled)
            chartView.animationOptions = ChartView.SeriesAnimations;
        else
            chartView.animationOptions = ChartView.NoAnimation;
    }

    function changeRefreshRate(rate) {
        refreshTimer.interval = 1 / Number(rate) * 1000;
    }
}

更新II

诀窍是使用clip并将chartView into放入矩形。

Rectangle {
    id: canvas
    anchors{
        left: parent.left
        right: parent.right
        top: parent.top
    }
    height: 250
    color: "#FFFFFF"
    z: propText.z - 1

    clip: true

    Rectangle {
        width: parent.width
        height: 40

        z: 1

        color: "#FFFFFF"
    }

    GraphView{ //ChartView
        id: graphView
        isTimerRunnig: isRunning
        channelId: channelId
    }
}

和ChartView aka GraphView

ChartView {
id: chartView

property alias channelId: dataSource.channelId
property alias isTimerRunnig: refreshTimer.running
property bool openGL: true

antialiasing: !openGL
legend.visible: false

margins.top: 0
margins.bottom: 0
margins.left: 0
margins.right: 0

x: -70
y: 20

width: 360
height: 262

backgroundRoundness: 0


onOpenGLChanged: {
    series("signal 1").useOpenGL = openGL;
}

DataSource {
    id: dataSource
    channelId: channelId
    isPaused: !isTimerRunnig

    onIsPausedChanged: {
        if(isPaused){
            lineSeries1.clear()
        }
    }
}

ValueAxis {
    id: axisY

    //gridVisible: false
    labelsVisible: false
    tickCount: 3

    color: "transparent"
}

ValueAxis {
    id: axisX
    min: 0
    max: 100

    //gridVisible: false
    labelsVisible: false
    tickCount: 4

    color: "transparent"
}

LineSeries {
    id: lineSeries1
    name: "signal 1"
    axisX: axisX
    axisY: axisY
    useOpenGL: chartView.openGL
    color: "#44D77B"
    width: 2
}

Timer {
    id: refreshTimer
    interval: 1 / 25 * 1000 // 25 Hz
    running: isTimerRunnig
    repeat: true
    onTriggered: {
        dataSource.updateFromQML(chartView.series(0), chartView.axisY(chartView.series(0)))
        //dataSource.printChannelId()
    }
}

}

Answer 1

可能的解决方案1：QMargins属性指定绘图区域周围的最小区域。尝试通过调整子（绘图）本身来填充剩余的填充。

plotArea：rect ChartView上用于绘图的区域系列。这是没有边距的ChartView矩形。

可能的解决方案2：设置边距后尝试重绘父布局。如果在创建窗口后调整边距，则可能不一定立即刷新视图。

Answer 2

我有同样的问题，但不太明白解决方案1中接受的答案意味着什么。我找到了解决问题的解决方案对我有用，所以我会将其作为另一个答案发布在这里。

（我希望更具体地了解被接受的灵魂是什么，但我还不能评论其他人的答案。）

我的解决方案无论如何（除了如问题所示将边距设置为0，并且图例和轴不可见）：

ChartView
{
    x: -10
    y: -10

    width: parent.width + 20
    height: parent.height + 20
}

只需手动将Chartview的绘图区域移动到父组件的左上角并适当调整其大小。我不知道数字10来自哪里，但这似乎是剩余边距的大小。这个问题的“真实”答案是如何以更强大的方式将其设置为0。

如果这个答案与接受的答案中提到的答案相同，或者答案确实是一个更强大的答案，请告诉我！

Answer 3

另一个技巧是将以下几行添加到ChartView

anchors { fill: parent; margins: -15 }
margins { right: 0; bottom: 0; left: 0; top: 0 }

Answer 4

阐明解决方案 1 如何为我工作（Qt 5.12.6）：

ChartView {
    id: chart

    width: parent.width
    height: parent.height
    plotArea: Qt.rect(chart.x, chart.y, chart.width, chart.height)

    anchors {
        fill: parent
        margins: 0
    }

    legend.visible: false
    backgroundRoundness: 0

Answer 5

我在模式对话框中也遇到了同样的错误：对话框周围有白色边框，并以某种方式解决了该问题：

contentItem: Rectangle {
    anchors.fill: parent
    color: "black"
    border.width: 1
    ...
}

在这里，我通过将页边距设置为零并将ChartView包装到另一个Rectangle中来解决此问题，该背景颜色与设置负固定页边距相同，但由于所需的值可能不同，因此不太正确：

Item {
    Rectangle {
        color: "black"
        anchors.fill: parent
    }

    ChartView {
        id: chart
        anchors.fill: parent
        antialiasing: true
        margins { top: 0; bottom: 0; left: 0; right: 0 }
//        plotArea: Qt.rect(0, 0, width, height)
        backgroundColor: "black"
        backgroundRoundness: 0
        legend.visible: false
        ...
    }
}

注释plotArea: Qt.rect(0, 0, width, height)也可以解决该问题，但不能解决：由于轴和轴标签在这种情况下由于某种原因而消失。

如何删除间距？ QML ChartView

5 个答案: