如何绘制自定义形状的元素?

时间:2018-10-19 00:43:10

标签: c++ qt qt5 qrect

我目前正在使用一款本质上是乒乓球游戏的应用程序。该游戏具有两个当前为矩形格式的球拍,以简化对球(当前为正方形)的碰撞检测。

我正在使用“ QRect”元素作为桨,因为它提供了“ .intersect”方法,因此很容易检查碰撞。 我对矩形桨的实现如下:

Paddle::Paddle(int initial_x, int initial_y) {

  QImage image.load(":images/paddle.png");
  QRect rect = image.rect();
  resetState(initial_x, initial_y);
}

我正在尝试绘制类似于桨和击打盒的拱形,类似于下面的代码:

QRectF rectangle(10.0, 20.0, 80.0, 60.0);
int startAngle = 30 * 16;
int spanAngle = 120 * 16;

QPainter painter(this);
painter.drawChord(rectangle, startAngle, spanAngle);

上面的代码唯一的问题是它仅在paintEvent函数内部起作用,而对我不起作用。

paddle.h

#ifndef PADDLE_H

#pragma once

#include <QImage>
#include <QRect>

class Paddle {

  public:
    Paddle(int, int);
    ~Paddle();

  public:
    void resetState(int, int);
    void move();
    void setDx(int);
    void setDy(int);
    QRect getRect();
    QImage & getImage();

  private:
    QImage image;
    QRect rect;
    int dx;
    int dy;
    static const int INITIAL_X1 = 70;
    static const int INITIAL_Y1 = 350;
};

#define PADDLE_H

#endif // PADDLE_H

paddle.cpp

#include <iostream>
#include "paddle.h"

Paddle::Paddle(int initial_x, int initial_y) {

  dy = 0;
  image.load(":images/paddle.png");
  rect = image.rect();
  resetState(initial_x, initial_y);
}

Paddle::~Paddle() {

 std::cout << ("Paddle deleted") << std::endl;
}

void Paddle::setDy(int y) {
  dy = y;
}

void Paddle::move() {

    int x = rect.x();
    int y = rect.top() + dy;

    rect.moveTo(x, y);
}

void Paddle::resetState(int initial_x, int initial_y) {

  rect.moveTo(initial_x, initial_y);
}

QRect Paddle::getRect() {

  return rect;
}

QImage & Paddle::getImage() {

  return image;
}

mainGame.h

#ifndef BREAKOUT_H

#pragma once

#include <QWidget>
#include <QKeyEvent>
#include <QFrame>
#include "ball.h"
#include "brick.h"
#include "paddle.h"

class Breakout : public QFrame {
    Q_OBJECT

  public:
    Breakout(QWidget *parent = 0);
    ~Breakout();

signals:
    void leftScoreChanged(int leftScore);
    void rightScoreChanged(int rightScore);
    void ballLost(int ballsLeft);

  protected:
    void paintEvent(QPaintEvent *);
    void timerEvent(QTimerEvent *);
    void keyPressEvent(QKeyEvent *);
    void keyReleaseEvent(QKeyEvent *);
    void drawObjects(QPainter *);
    void finishGame(QPainter *, QString);
    void moveObjects();

    void startGame();
    void pauseGame();
    void stopGame();
    void victory();
    void validateScoreChange(int);
    void checkCollision();

  private:
    int x;
    int timerId;
    int ballsLeft;
    int leftScore;
    int rightScore;
    static const int N_OF_BRICKS = 30;
    static const int DELAY = 5;

    static const int TOP_EDGE = 0;
    static const int LEFT_EDGE = 0;
    static const int BOTTOM_EDGE = 700;
    static const int RIGHT_EDGE = 1200;

    Ball *ball;
    Paddle *leftPaddle;
    Paddle *rightPaddle;
    Brick *bricks[N_OF_BRICKS];
    bool gameOver;
    bool gameWon;
    bool gameStarted;
    bool paused;
};

#define BREAKOUT_H

#endif // BREAKOUT_H

Breakout :: paintEvent()

void Breakout::paintEvent(QPaintEvent *e) {

      Q_UNUSED(e);

      QPainter painter(this);

      if (gameOver) {

        finishGame(&painter, "Game lost");

      } else if(gameWon) {

        finishGame(&painter, "Victory");
      }
      else {

        drawObjects(&painter);
      }

      QWidget::paintEvent(e);
    }

1 个答案:

答案 0 :(得分:2)

据我了解,您不想从.png文件中加载<html> <head> <meta charset="utf-8"> <title>云南地图</title> </head> <body> <script src="d3.v3.min.js"></script> <script src="http://www.ourd3js.com/library/multext.js" charset="utf-8"></script> <script> var width = 630; var height = 630; var svg = d3.select("body")//定位页面位置 .append("svg")//添加画布 .attr("width", width)//添加宽度 .attr("height", height)//添加高度 .append("g")//添加元素 .attr("transform", "translate(0,0)"); //投影函数 var projection = d3.geo.mercator()//投影方式 .center([102, 25])//设置中心位置,数据是指经纬度 .scale(3800)//设置放大比例 .translate([width/2, height/2]);//设置平移 //地理生成器:根据地理数据生成SVG的path元素的路径值 var path = d3.geo.path()//svg的预定义元素:rect矩形、circle圆形、eclipse椭圆、line线段、polyline折线、polygon多边形、path路径 .projection(projection);//从球面投影到平面 // var color = d3.scale.category20(); // console.log(path); d3.json("yunnan.json", function(error, root) { if (error) return console.error(error); // console.log(root.features); svg.selectAll("path") .data( root.features )//引入数据 .enter() .append("path")//添加路径 .attr("stroke","#fff")//设置边线颜色 .attr("stroke-width",1)//设置边线宽度 .attr("fill","#b6c9f7")//设置填充颜色 .attr("d", path ) .on("mouseover",function(d,i){//设置鼠标悬浮样式 d3.select(this) .attr("fill","#778de6"); }) .on("mouseout",function(d,i){//设置鼠标离开样式 d3.select(this) .attr("fill","#b6c9f7"); }); var name=[]; var local=[]; for(var i=0;i<root.features.length;i++){ name.push(root.features[i].properties.name); local.push(root.features[i].properties.cp); } for(var j=0;j<name.length;j++){ var localPosition=projection(local[j]); appendMultiText(svg,name[j],localPosition[0]-30,localPosition[1]-10,70,14); } }); </script> </body> </html> ,而是想要绘制它,如果可以,可以使用$('document').ready(function(){ var pagetrans = Barba.BaseTransition.extend({ start: function() { Promise.all([this.newContainerLoading, this.left()]).then(this.right.bind(this)); }, left: function() { var transon = $(".transition").animate({left: '0px'}); return $(this.oldContainer).transon.Promise(); }, right: function(el) { var _this = this; var el = $(this.newContainer); $(this.oldContainer).hide(); el.css({ visibility : 'visible', opacity : 0 }); var transoff = $(".transition").animate({left: '100%'}); el.transoff, 400, function() { _this.done(); }; } }); Barba.Pjax.getTransition = function() { return pagetrans; }; Barba.Pjax.start(); }); 来创建图像,如下所示:

QImage