Giter Site home page Giter Site logo

blockyroads's Introduction

Blocky Roads

a game designed for Nexys4 FPGA



Overall Structure

  • MVC Frame

Overall Structure

  • Verilog Code of the TOP Module
module BR_Top(input and output signals);

    // Signal declaration
    . . .

    Renderer render_unit (parameters);
    Controller control_unit (parameters);
    Model model_unit (parameters);

endmudule

Model


Components

  • Seg_disp

    a module to display the highest score on the segment tube


Seg_disp

  • User-defined Characters
case (s)
    0: digit       = {1'b0, x[ 3: 0]};
    1: digit       = {1'b0, x[ 7: 4]};
    2: digit       = {1'b0, x[11: 8]};
    3: digit       = {1'b0, x[15:12]};
    4: digit       = 5'b1_0000;
    5: digit       = 5'b1_0001;
    6: digit       = 5'b1_0010;
    7: digit       = 5'b1_0011;
    default: digit = {1'b0, x[ 3: 0]};
endcase

In this case, we use {1'b0, x} to represent the highest score we get, and {1'b1, ...} to represent the characters we defined.


Seg_disp

Then, we can display different characters according to the digit:

case (digit)
    // 0 to F
    0:    SEGMENT = 7'b1000000;
    1:    SEGMENT = 7'b1111001;
    2:    SEGMENT = 7'b0100100;
    . . .
    'hE:  SEGMENT = 7'b0000110;
    'hF:  SEGMENT = 7'b0001110;
    // User defined character
    'h10: SEGMENT = 7'b0001011;	// h
    'h11: SEGMENT = 7'b0010000;	// g
    'h12: SEGMENT = 7'b1111001;	// I
    'h13: SEGMENT = 7'b0001001;	// H
endcase


Renderer


Components

  • Layers for different objects
  • Real-time rendering of the scrolling road

Layers

  1. Layer 0: Game-over prompt, score and digits (in TERMINATE status)
  2. Layer 1: Explosion animation (in ACTIVATE/PAUSE/TERMINATE status)
  3. Layer 2: My car and other obstacles (in ACTIVATE/PAUSE/TERMINATE status)
  4. Layer 3: Road, sildes and side (in ACTIVATE/PAUSE/TERMINATE status) OR background and start button (in PREPARE status)

Layers

Background Color Filter

  • Pseudo code:
  if (object_pos)
  begin
      if (object_data == background color)
    	Render next layer
      else
      	Render this object
  end

Layers

General Procedure of Rendering

  • Pseudo code:
  if (layer0)
  begin
      if (object0_pos)
          Color filter and render this object
      if (object1_pos)
          Color filter and render this object
      . . .
  end
  if (layer1)
      . . .

Scrolling Road

First, we need to pick out the static parts and dynamic parts of the image:

  • Static parts: 2 EDGE lines
  • Dynamic parts: 4 dot lines

Scrolling Road

Then,we can have the basic structure of the code:

if (EDGE lines' pos)
begin
    rgb <= line's color;
end
else if (dot lines' pos)
begin
    . . .
end
else
begin
    rgb <= background's color;
end

Scrolling Road

In order to render the dot lines, we declare some variables and constants to represent the position of each dot:

parameter slide_y  = 40;
parameter interval = 20;
integer i;
wire [9:0] dot_y;
assign dot_y = (pixel_y + scroll) % 480;

In this case, scroll is a variable that will change with time.


Scrolling Road

With all the preparation, we can use a for loop to implement it:

for (i = 0; i < 480; i = i + slide_y + interval)
begin
    if (dot_y >= i && dot_y < i + slide_y)
    begin
	    rgb <= dot's color;
    end
    else if (dot_y >= i + slide_y &&
             dot_y < i + slide_y + interval)
    begin
        rgb <= road's color;
    end
end

Controller


Components

  • Collision Detector
  • Random Generator

Collision Detector

To simplify the detection procedure, we just detect the four vertices of the car position rectangle.

Then, we get the four follwing situations:



Random Generator

In order to generate a random number, the idea is as follows:

  1. set time as the seed
  2. use a counter to follow the change of time
  3. When the user presses a key, generate a perturbation to disturb the counting circuit
  4. Mod a prime number (such as 5) to make the reuslt more discrete

Random Generator

  • Pseudo code:
if (key pressed)
    cnt <= cnt + 1023else
    cnt <= cnt + 1;

result = cnt % 5;

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.