GUI for placing shapes in GraphicsView



  • Hey guys,

    I would like to make a GUI for placing shapes in GraphicsView window by input the values My GUI like this

    Form left to right is x1, y1, x2, y2. For two shapes.

    My code is:

    MainWindow::MainWindow(QWidget *parent) :
        QMainWindow(parent),
        ui(new Ui::MainWindow)
    {
        ui->setupUi(this);
    
        scene = new QGraphicsScene(this);
        ui->graphicsView->setScene(scene);
    
        QBrush redBrush(Qt::red);
        QBrush blueBrush(Qt::blue);
        QPen blackpen(Qt::black);
        blackpen.setWidth(2);
    
        ellipse = scene->addEllipse(x1,y1,100,100,blackpen,redBrush);
        //ellipse->setFlag(QGraphicsItem::ItemIsMovable);
        rectangle = scene->addRect(x2,y2,100,100,blackpen,blueBrush);
        //rectangle->setFlag(QGraphicsItem::ItemIsMovable);
    
    
    }
    
    MainWindow::~MainWindow()
    {
        delete ui;
    }
    
    
    
    void MainWindow::on_x1_valueChanged(int arg1)
    {
    
    }
    
    void MainWindow::on_y1_valueChanged(int arg1)
    {
    
    }
    
    

    I need some suggestion what command and codes should I put in my Spinbox and placing shapes by the number I input.

    Thank you guys so much.


  • Qt Champions 2016

    Hi
    How do you plan this to work?
    Since there are 2 values. how do u know when
    user wants to insert shape?

    Say user input 100 in x and 200 in y.

    Now u have 2 values and u could create shape.

    But what if user just change y.
    How will u know that he do not want to change x also?
    before making shape.

    So u need some sort of Create button or make it a rule that
    user MUST input both before you create.



  • @mrjj thanks for your reply.

    What if I build a button for each shape? When I input x1 and y1 then click the button for re-place that shape??

    Or can I make it if users do not change x, then it stay in the last x position??

    Any suggestion on my code?


  • Qt Champions 2016

    @Macive-Xiong
    Hi
    Its unclear to me if u want the user to use the values to create new or to move existing.
    Its 2 different cases.

    But yes if you add a button, to create it would work.

    Have you thought about use a dialog ?
    It works better for both cases as you
    can just see if user had shape selected and then use values to move or
    if none is selected, then create new, when user press OK for dialog.



  • @mrjj
    In this case, I would like to create a new shape. When the user input the new value for x and y, it creates a new shape on that position.
    Here's the GUI I modify

    I added a button for creating a new shape every time I input a new value.


  • Qt Champions 2016

    @Macive-Xiong
    ok. super.
    so when button calls the slot, you
    simply read the values, and insert the new item.
    This way you know when to create.



  • @mrjj

    OK, I put everything in the click button

    void MainWindow::on_creat_btn_clicked()
    {
        QBrush redBrush(Qt::red);
        QBrush blueBrush(Qt::blue);
        QPen blackpen(Qt::black);
        blackpen.setWidth(2);
        ellipse = scene->addEllipse(x, y, 10, 10,blackpen,redBrush);
    
    }
    

    Some suggestion for declaring the x and y ?? Thank you :)


  • Qt Champions 2016

    @Macive-Xiong

    hi
    the spinedit has a value function

    so
    int x= ui->spin1->value();
    int y= ui->spin2->value();



  • @mrjj

    OMG!! It works!!!! Thank you soooo much. And sorry for those dumb questions...I am a noob on Qt and trying to create multiple projects to practice. Next step I would like to add the different colors while create different shapes and area.

    Thank you again:)


  • Qt Champions 2016

    @Macive-Xiong
    No worries.
    Beginner questions are very allowed/welcome here :)

    To select color, you can use
    http://doc.qt.io/qt-5/qcolordialog.html#details

    its not much code to allow selection of color
    QColor color = QColorDialog::getColor(Qt::yellow, this );
    if( color.isValid() )
    {
    qDebug() << "Color Choosen : " << color.name();
    }

    for type of shape, you could use a QCombobox
    http://doc.qt.io/qt-4.8/qcombobox.html
    so it has list of types.



  • @mrjj

    Thanks for your information. It's really helpful. And I must say, your kindness and patience are really important for the novice like me. Thanks again:)


  • Qt Champions 2016

    @Macive-Xiong
    You are most welcome.
    Are you new to c++ too?



  • @mrjj

    Yep I kinda a new to C++. My projects are making connection with Qt and Arduino. Build a GUI on Qt and control Arduino. In this case, I would like to input position values on Qt and send these values to Arduino and do some math. Then send back to Qt and place the shape.


  • Qt Champions 2016

    @Macive-Xiong
    ok. just asking as if really new to C++ , some dont really realize that
    adding variables to mainwindow.h makes it accessible to all methods.

    class MainWindow : public QMainWindow {
    Q_OBJECT
    public:
    explicit MainWindow(QWidget* parent = 0);
    ~MainWindow();

    private slots:
    void on_pushButton_released();

    void on_pushButton_3_released();

    private:
    Ui::MainWindow* ui;
    <<<< good spot for variables.
    };

    Also, if you are going to use serial comm with Arduino
    then this sample is super to start with
    http://doc.qt.io/qt-5/qtserialport-terminal-example.html



  • @mrjj

    OK, thanks for the information.
    These are really helpful:)
    Will ask more questions if I get more problem.



  • @mrjj

    Hi, now I am facing a problem.
    When I input the value, say x = 500, y = 0. The ellipse shows at the center of my GraphicsView. My GraphicsView's boundary is 512*512.

    My code:

    void MainWindow::on_creat_btn_clicked()
    {
        QBrush redBrush(Qt::red);
        QBrush blueBrush(Qt::blue);
        QPen blackpen(Qt::black);
        blackpen.setWidth(1);
    
       int x  = ui->spin1->value();
       int y  = ui->spin2->value();
    
        
        ellipse = scene->addEllipse(x, y, 5, 5,blackpen,redBrush);
    
    
    
    }
    

    Any suggestion?? Thank you so much.


  • Qt Champions 2016

    well you should read
    http://doc.qt.io/qt-5/graphicsview.html
    section
    Scene Coordinates

    you can also define your own
    scene->setSceneRect(-180, -90, 360, 180);

    Short story.
    0,0, might not be where u think it is :)


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.