如何使用QML图表的ScrolLeft和ScrollRight方法

时间:2017-10-26 11:24:51

标签: qt qml qtquick2 qtchart

我需要使用stderr滚动QT图表,为此,我使用可以拖动的InputStreamOutputStream创建了我自己的自定义scrollbar。< / p>

当我尝试使用scrollbarRectangle方法滚动图表时,我无法将MouseArea ScrollRightScrollLeft内容关联/绑定X.以下是代码:

ScrollBar

1)如何将XChartView内容import QtQuick 2.6 import QtQuick.Window 2.2 import QtQuick.Controls 2.2 import QtCharts 2.0 Window { id: window width: 640 height: 480 visible: true ChartView { id: chartview width: parent.width height: 300 LineSeries { name: "LineSeries" axisX: ValueAxis { min: 0 max: 100 tickCount: 12 labelFormat: "%.0f" } axisY: ValueAxis { min: 0 max: 70 tickCount: 5 labelFormat: "%.0f" } XYPoint { x: 0; y: 0.0 } XYPoint { x: 1.1; y: 3.2 } XYPoint { x: 1.9; y: 2.4 } XYPoint { x: 2.1; y: 2.1 } XYPoint { x: 2.9; y: 2.6 } XYPoint { x: 3.4; y: 2.3 } XYPoint { x: 200.1; y: 3.1 } } } /* Rectangle base for horizontal scroll bar */ Rectangle{ id:rectHorScrollBase width:parent.width height:parent.height * 0.10 anchors.top:chartview.bottom anchors.topMargin: (parent.height * 0.01) color:"transparent" visible: true /* Rectangle indicating scroll path*/ Rectangle { id:rectHorScrollPath width: parent.width height: parent.height anchors.left:parent.left radius: 2 color: "lightblue" } /* Actual scroll rectaangle which will be dragged */ Rectangle { id: rectHorScroll property var prevX : 0 anchors.top : parent.top width: 50 height: parent.height color: "green" /* Mouser area to drag the rectangle and to move Chart */ MouseArea { id:mouseAreaHorScroll anchors.fill: parent drag.target: parent drag.minimumX: 0 drag.maximumX: chartview.width - width drag.axis: Drag.XAxis onReleased: { console.log("x in Released ===",rectHorScroll.x) rectHorScroll.prevX = rectHorScroll.x } } onXChanged: { // HOW TO HANDLE THE SCROLL BASED ON x ? if(mouseAreaHorScroll.drag.active) { if(x > prevX) { chartview.scrollRight(x) // NOT WORKING } else { chartview.scrollLeft(x) //NOT WORKING } } } } } } 进行对比?

2)scrollBar X不应超出X轴的最大值和最小值。怎么做?

3)ChartViewX之间应该有同步。

1 个答案:

答案 0 :(得分:1)

基本上它按预期工作。让我们分析一下你在做什么:

onXChanged: {

    // HOW TO HANDLE THE SCROLL BASED ON x ?
    if(mouseAreaHorScroll.drag.active)
    {
        if(x > prevX)
        {
            chartview.scrollRight(x) // NOT WORKING
        }
        else
        {
            chartview.scrollLeft(x) //NOT WORKING
        }
    }
}

首先,当scrollRight大于x时,你prevX - 效果很好。但是,对于scrollRight像素,您x会随着移动而增长,因此移动与滚动条的移动不是线性的。

scrollLeft确实(几乎)从未被调用过,这很明显:只有在prevXx === 0 ( = prevX)时才会更新scrollLeft(0) - 这不是prevX移动。

我们需要应用的第一个更改是在处理程序的末尾更新onXChanged: { // HOW TO HANDLE THE SCROLL BASED ON x ? if(mouseAreaHorScroll.drag.active) { if(x > prevX) { chartview.scrollRight(x - prevX) // Only move the difference } else { chartview.scrollLeft(prevX - x) //Only move the difference } prevX = x // Update prevX } } 第二个变化是,我们只想移动自上次运行代码以来我们移动句柄。

因此解决方案如下:

axisX: ValueAxis {
    min: rectHorScroll.x / (rectHorScrollBase.width - rectHorScroll.width) * 100
    max: rectHorScroll.x / (rectHorScrollBase.width - rectHorScroll.width) * 100 + 100
    tickCount: 12
    labelFormat: "%.0f"
}

不是手动处理这些东西,而是调用这些函数,你也可以将轴的可见部分映射到x - 删除你的句柄并相应地更改axisX:

Slider

在这里,您需要找到应用映射的正确方法,以获得正确的范围。

然后您还可以使用常规组件,例如import QtQuick 2.6 import QtQuick.Window 2.2 import QtQuick.Controls 2.0 import QtCharts 2.0 ApplicationWindow { id: window width: 640 height: 480 visible: true ChartView { id: chartview width: parent.width height: 300 LineSeries { name: "LineSeries" axisX: ValueAxis { property real minValue: 0 property real maxValue: 200 property real range: 100 min: minValue + sb.position * (maxValue - minValue - range) max: minValue + sb.position * (maxValue - minValue - range) + range tickCount: 12 labelFormat: "%.0f" } axisY: ValueAxis { min: 0 max: 70 tickCount: 5 labelFormat: "%.0f" } XYPoint { x: 0; y: 0.0 } XYPoint { x: 1.1; y: 3.2 } XYPoint { x: 1.9; y: 2.4 } XYPoint { x: 2.1; y: 2.1 } XYPoint { x: 2.9; y: 2.6 } XYPoint { x: 3.4; y: 2.3 } XYPoint { x: 200.1; y: 3.1 } } } Slider { id: sb anchors { bottom: parent.bottom left: parent.left right: parent.right } height: 30 } } 来模拟滚动条:

 class gestiontache extends JFrame{


JFrame f;
JPanel p1, p2, p3;
JTabbedPane tp;

JLabel l1, l2, l3,l4,l5;
JComboBox  tf3categor;
JComboBox  tf4Affiliation;
JComboBox  tf5montant;

JTextField tf1, tf2;
JScrollPane sp1;
JButton savebtn, resetbtn, editbtn;
private static String FILE = "c:/temp/DocumentPdf.pdf";
private static Font catFont = new Font(Font.FontFamily.TIMES_ROMAN, 18,
        Font.BOLD);
private static Font redFont = new Font(Font.FontFamily.TIMES_ROMAN, 12,
        Font.NORMAL, BaseColor.RED);
private static Font subFont = new Font(Font.FontFamily.TIMES_ROMAN, 16,
        Font.BOLD);
private static Font smallBold = new Font(Font.FontFamily.TIMES_ROMAN, 12,
        Font.BOLD);
gestiontache() {
    f = new JFrame("Form");
    GridLayout lay1= new GridLayout(12, 2);
    GridLayout lay2= new GridLayout(5, 2);
    p1 = new JPanel(lay1);
    p2 = new JPanel(lay2);
    lay1.setHgap(5); //Cinq pixels d'espace entre les colonnes (H comme Horizontal)
    lay1.setVgap(5); //Cinq pixels d'espace entre les lignes (V comme Vertical) 
    lay2.setHgap(5);
    lay2.setVgap(5);
    tp = new JTabbedPane();
    l1 = new JLabel("Nom");
    l2 = new JLabel("Prénom");
    l3 = new JLabel("Catégorie");
    l4 = new JLabel("Affiliation");
    l5 = new JLabel("Montant à payer");
    tf1 = new JTextField(12);
    tf2 = new JTextField(12);
    tf3categor = new JComboBox( new String[] { "Medecin", "Technicien", "Pharmacien","Autre" });
    tf4Affiliation =new JComboBox( new String[] { "K", "T", "Sf","Gab","Toze","Med","Tat","Na","B","G","Si","Ga","Ke","Kr" });
    tf5montant = new JComboBox( new String[] { "15 Dinars", "30 Dinars"});
    savebtn = new JButton(" Ajouter ");
    resetbtn = new JButton(" Annuler");
    editbtn = new JButton(" Imprimer");

    p1.add(l1);
    p1.add(tf1);
    p1.add(l2);
    p1.add(tf2);
    p1.add(l3);
    p1.add(tf3categor);
    p1.add(l4);
    p1.add(tf4Affiliation);
    p1.add(l5);
    p1.add(tf5montant);
    p1.add(savebtn);
    p1.add(resetbtn);
    p2.add(l1);
    p2.add(tf1);
    p2.add(l2);
    p2.add(tf2);
    p2.add(editbtn);
    resetbtn.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent ae) {
            clear();
        }
    });
    savebtn.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent ae) {
            String nom, prenom,categorie, affiliation, montant;
            nom = tf1.getText();
            prenom = tf2.getText();
            categorie=(String) tf3categor.getSelectedItem();
            affiliation=(String) tf4Affiliation.getSelectedItem();
            montant=(String) tf5montant.getSelectedItem();
            String url = "jdbc:mysql://localhost:3306/seminaire";
            String userid = "root";
            String password = "";
            try {
            Connection connection = DriverManager.getConnection(url,
                        userid, password);
            Statement st = connection.createStatement();

                if (nom != "" && prenom != ""&& categorie!= ""&& affiliation!= ""&& montant!= "") {
  st.executeUpdate("insert into participant values('" + nom
                            + "','" + prenom + "','" + categorie + "','"+affiliation+"','"+montant+"')");
 JOptionPane.showMessageDialog(null,"Données insérées avec succès");
                    clear();
                } else {
  JOptionPane.showMessageDialog(null, "merci de saisir vos données");
                }
            } catch (Exception ex) {
                ex.printStackTrace();
            }
        }
    });
            editbtn.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent ae) {
            String nom, prenom,categorie, affiliation, montant;
            nom = tf1.getText();
            prenom = tf2.getText();
            String url = "jdbc:mysql://localhost:3306/seminaire";
            String userid = "root";
            String password = "";
            try {
                Connection connection = DriverManager.getConnection(url,
                        userid, password);
                Statement st = connection.createStatement();

                if (nom != "" && prenom != "") {
                 ResultSet rs= st.executeQuery("SELECT * FROM participant 
                 WHERE nom=nom && prenom=prenom");
                    while (rs.next())
  {
    String nm = rs.getString("nom");
    String prnm = rs.getString("prenom");
    String cat = rs.getString("categorie");
    String afl=rs.getString("affiliation");
    String mnt=rs.getString("montant");  
    // print the results
    Document document = new Document();
    try {
        PdfWriter.getInstance(document, new FileOutputStream(FILE));
        //open
        document.open();
        Paragraph p = new Paragraph();
        p.add("Reçu");
        p.setAlignment(Element.ALIGN_CENTER);
        document.add(p);
        Paragraph p2 = new Paragraph();
        p2.add(nm); //no alignment
        document.add(p2);
        Font f = new Font();
        f.setStyle(Font.BOLD);
        f.setSize(8);
        document.add(new Paragraph("This is my paragraph 3", f));
        //close
        document.close();
        System.out.println("Done");
        } catch (FileNotFoundException | DocumentException e) {
        e.printStackTrace();
        } catch (IOException e) {
        e.printStackTrace();
         }
       }
       }    
       else {
      JOptionPane.showMessageDialog(null, "merci de saisir vos données");

                }

        }
            catch (Exception e)
            {
              System.err.println(e.getMessage());
            } 
          }});
        }
          void dis() {
       f.getContentPane().add(tp);
       tp.addTab("Ajouter participant", p1);
       tp.addTab("Imprimer attestation", p2);

        f.setSize(500, 400);
    f.setVisible(true);
    f.setResizable(true);
      }

     void clear()
    {
      tf1.setText("");
      tf2.setText("");
      tf3categor.setSelectedItem("");
      tf4Affiliation.setSelectedItem("");
      tf5montant.setSelectedItem("");
    } 

    public static void main(String z[]) {
    gestiontache data = new gestiontache();
    data.dis();
     }
        }