This site requires JavaScript, please enable it in your browser!
Greenfoot back
Twitter Twitter.hover
shooterbooth
shooterbooth wrote ...

2015/3/10

Need help with draw features/dimensions

shooterbooth shooterbooth

2015/3/10

#
Hi I'm trying to draw a soccer field onto my background. I have everything except one thing, the curved line at the top of each 18yd box. If you don't know what I mean, just google soccer field dimensions. It is about a quarter of a circle and I'm not sure how to draw it. I thought maybe trying drawPolygon but wasn't sure so I thought I'd ask first. This is some of my code in my myWorld() constructor. The world is set at (600, 400, 1). Thanks for any help 
background.setColor(Color.WHITE);
        background.drawLine(getWidth()/2, 0, getWidth()/2, getHeight());
        background.drawOval(getWidth()/2-getWidth()/10, getHeight()/2-getHeight()/6, 120, 120);
        background.drawRect(500, 100, 100, 200);
        background.drawRect(-1, 100, 101, 200);
        background.drawRect(566, 150, 34, 100);
        background.drawRect(-1, 150, 34, 100);
Super_Hippo Super_Hippo

2015/3/10

#
If you are talking about what I think, then it is half a circle each and not a quarter. What you could do is: for both sides: - draw a white circle - draw a green rectangle over the half of the circle which is not wanted - draw the rest
shooterbooth shooterbooth

2015/3/11

#
I am not talking about a half circle, I'm talking about a quarter circle, but your idea still might work so I'll try to play around with it a little bit. Thanks
danpost danpost

2015/3/11

#
Another way is to create a GreenfootImage object and draw the circle offset so that the center is off the image itself, capturing only the portion you want. Then draw that image onto your main image. For example: 
GreenfootImage image = new GreenfootImage(120, 120); // new image
image.setColor(Color.white); // drawing color
image.drawOval(-90, 0, 120, 120); // draw circle (arc)
background.drawImage(image, 100, 240); // add to background
Super_Hippo Super_Hippo

2015/3/11

#
Ah okay, I know what you mean. I guess I would draw a circle with same radius as the circle in the middle with center on the penalty spot and then, draw a green rectangle over the rest. (Or draw the white one before it.) The same way can be used if you want bigger lines: You can use fillRect/fillOval with white and then a smaller one in green.
danpost danpost

2015/3/11

#
The code in the constructor of this world class creates the soccer field. The final image could be drawn onto a larger image if desired. The value of the 'factor' field can be adjusted to vary the size of the image created or you could create a copy of the final image and scale it to any size. Here it is: 
import greenfoot.*;
import java.awt.Color;

public class Field extends World
{
    public static final int
        totalWidth = 115,
        totalHeight = 74,
        goalWidth = 6,
        goalHeight = 20,
        kickWidth = 18,
        kickHeight = 44,
        circleRadius = 10,
        cornerRadius = 1,
        cornerTicks = 10,
        factor = 8;
    public static final Color
        green = new Color(0, 128, 0),
        white = Color.white;
        
    public Field()
    {
        super(totalWidth*factor+16, totalHeight*factor+16, 1);
        GreenfootImage bg = getBackground();
        // the entire field
        bg.setColor(green);
        bg.fill();
        // the perimeter lines and corner ticks
        bg.setColor(white);
        bg.fillRect(4, 4, bg.getWidth()-8, bg.getHeight()-8);
        bg.fillRect(8+cornerTicks*factor-2, 0, 4, totalHeight*factor+16);
        bg.fillRect(totalWidth*factor+14-(8+cornerTicks*factor), 0, 4, totalHeight*factor+16);
        bg.fillRect(0, 8+cornerTicks*factor-2, totalWidth*factor+16, 4);
        bg.fillRect(0, totalHeight*factor+14-(8+cornerTicks*factor),totalWidth*factor+16, 4);
        // the play field
        bg.setColor(green);
        bg.fillRect(8, 8, totalWidth*factor, totalHeight*factor);
        // the corners
        GreenfootImage corner = new GreenfootImage(3+cornerRadius*factor, 3+cornerRadius*factor);
        corner.setColor(white);
        corner.fillOval(-3-cornerRadius*factor, -3-cornerRadius*factor, 6+2*cornerRadius*factor, 6+2*cornerRadius*factor);
        corner.setColor(green);
        corner.fillOval(-cornerRadius*factor, -cornerRadius*factor, 2*cornerRadius*factor, 2*cornerRadius*factor);
        bg.drawImage(corner, 8, 8);
        corner.rotate(90);
        bg.drawImage(corner, getWidth()-8-(3+cornerRadius*factor), 8);
        corner.rotate(90);
        bg.drawImage(corner, getWidth()-8-(3+cornerRadius*factor), getHeight()-8-(3+cornerRadius*factor));
        corner.rotate(90);
        bg.drawImage(corner, 8, getHeight()-8-(3+cornerRadius*factor));
        // the circle lines
        bg.setColor(white);
        bg.fillOval((4)+(12-circleRadius)*factor, (getHeight()/2-4)-circleRadius*factor, (8)+2*circleRadius*factor, (8)+2*circleRadius*factor);
        bg.fillOval((getWidth()/2-4)-circleRadius*factor, (getHeight()/2-4)-circleRadius*factor, (8)+2*circleRadius*factor, (8)+2*circleRadius*factor);
        bg.fillOval((getWidth()-8)-((4)+(12+circleRadius)*factor), (getHeight()/2-4)-circleRadius*factor, (8)+2*circleRadius*factor, (8)+2*circleRadius*factor);
        // the inner circles
        bg.setColor(green);
        bg.fillOval((8)+(12-circleRadius)*factor, getHeight()/2-circleRadius*factor, 2*circleRadius*factor, 2*circleRadius*factor);
        bg.fillOval(getWidth()/2-circleRadius*factor, getHeight()/2-circleRadius*factor, 2*circleRadius*factor, 2*circleRadius*factor);
        bg.fillOval((getWidth()-8)-(12+circleRadius)*factor, getHeight()/2-circleRadius*factor, 2*circleRadius*factor, 2*circleRadius*factor);
        // the kickbox rectangle lines (penalty area)
        bg.setColor(white);
        bg.fillRect((4), (getHeight()/2-4)-kickHeight*factor/2, (8)+kickWidth*factor, (8)+kickHeight*factor);
        bg.fillRect((getWidth()-8)-((4)+kickWidth*factor), (getHeight()/2-4)-kickHeight*factor/2, (8)+kickWidth*factor, (8)+kickHeight*factor);
        // the inner kickbox rectangles (penalty area)
        bg.setColor(green);
        bg.fillRect((8), (getHeight()-kickHeight*factor)/2, kickWidth*factor, kickHeight*factor);
        bg.fillRect((getWidth()-8)-kickWidth*factor, (getHeight()-kickHeight*factor)/2, kickWidth*factor, kickHeight*factor);
        // the goalbox rectangle lines
        bg.setColor(white);        
        bg.fillRect((4), (getHeight()/2-4)-goalHeight*factor/2, (8)+goalWidth*factor, (8)+goalHeight*factor);
        bg.fillRect(getWidth()-4-goalWidth*factor-8, getHeight()/2-goalHeight*factor/2-4, goalWidth*factor+8, goalHeight*factor+8);
        // the inner goalbox rectangles
        bg.setColor(green);
        bg.fillRect((8), (getHeight()-goalHeight*factor)/2, goalWidth*factor, goalHeight*factor);
        bg.fillRect((getWidth()-8)-goalWidth*factor, (getHeight()-goalHeight*factor)/2, goalWidth*factor, goalHeight*factor);
        // the center line and spot
        bg.setColor(white);
        bg.fillRect(getWidth()/2-2, 4, 4, getHeight()-8);
        bg.fillOval(getWidth()/2-5, getHeight()/2-5, 9, 9);
    }
}
shooterbooth shooterbooth

2015/3/19

#
Here's the code I ended up using in case anyone in the future ever comes across this post looking for a soccer field. It looks perfect and is for a world of 600 width and 400 height. 
public void createPitch()
    {
        background = getBackground();
        fieldColor = new Color(25,125,50);
        background.setColor(fieldColor);
        background.fill();
        background.setColor(Color.WHITE);
        background.drawLine(getWidth()/2, 0, getWidth()/2, getHeight());
        background.drawOval(getWidth()/2-getWidth()/10, getHeight()/2-getHeight()/6, 120, 120);
        background.drawRect(500, 100, 100, 200);
        background.drawRect(-1, 100, 101, 200);
        background.drawRect(566, 150, 34, 100);
        background.drawRect(-1, 150, 34, 100);
        background.drawOval(470, 163, 75, 75);
        background.drawOval(55, 163, 75, 75);
        background.setColor(fieldColor);
        background.fillRect(55, 163, 45, 76);
        background.fillRect(501, 163, 45, 76);
        background.setColor(Color.WHITE);
        background.fillOval(63, getHeight()/2, 5, 5);
        background.fillOval(getWidth()-70, getHeight()/2, 5, 5);
        background.drawOval(-10, 30, 20, 20);
        background.drawOval(-10, 350, 20, 20);
        background.drawOval(590, 350, 20, 20);
        background.drawOval(590, 30, 20, 20);
        background.drawRect(0, 40, 599, 319);
        background.setColor(Color.MAGENTA);
        background.fillRect(0, 0, 602, 40);
        background.fillRect(0, 360, 602, 40);
    }
You need to login to post a reply.