PaperCircle
On this page you find the documentation for the paper figure PaperCircle.
This webpage only contains descriptions of the configuration methods that are specific to the PaperCircle figure. PaperCircle also supports the configuration methods described on the page PaperFigure.
Introduction
PaperCircle is a figure that you can use to draw a circle in a Paper component.
radius() - Setting the radius
Use the configuration method radius() to tell the PaperCircle figure which radius it should have. Pass it the radius as a number.
If you don't call radius(), the radius will be 25% of the coordinate system's width/height (whichever that is smallest).
class StartPage extends Page{
createGui(){
return Box.aspectRatio(10, 10).child(
Paper.coordinateSystem(10, 10).showCoordinates().backgroundColor(`orange`).children(
PaperCircle.radius(1),
)
)
}
}If your coordinate system is not uniformed (i.e. one unit in the X-direction is not equally big as one unit in the Y-direction), then the circle will look like an ellipse.
Open in Online Editorclass StartPage extends Page{
createGui(){
return Paper.coordinateSystem(10, 10).showCoordinates().backgroundColor(`orange`).children(
PaperCircle.radius(1),
)
}
}To prevent situations like this, always put your Paper component in a Box component with the same aspect ratio as the size of the coordinate system, so you are sure one unit in the X-direction is equally big as one unit in the Y-direction.
center() - Setting the center position
Use the configuration method center() to tell the PaperCircle figure where the center of the circle should be. Pass it two numbers:
- The X coordinate of the center
- The Y coordinate of the center
If you don't call center(), the circle will be positioned in the center of the coordinate system.
class StartPage extends Page{
createGui(){
return Box.aspectRatio(10, 10).child(
Paper.coordinateSystem(10, 10).showCoordinates().backgroundColor(`orange`).children(
PaperCircle.center(3, 3),
)
)
}
}