I am writing an Eclipse RCP-based application and am trying to draw a rectangle on top of a ViewPart. However, the rectangle seems to take up the whole screen even when specifiying the bounds. The following is my code.
public void createPartControl(Composite parent) {
Shell shell = parent.getShell();
Canvas canvas = new Canvas(parent, SWT.NONE);
LightweightSystem lws = new LightweightSystem(canvas);
RectangleFigure rectangle = new RectangleFigure();
rectangle.setBounds(new Rectangle(0, 0, 10, 10));
rectangle.setBackgroundColor(ColorConstants.green);
lws.setContents(rectangle);
}
I haven't used Draw2D, but I tried modifying your example by creating another rectangle figure and adding it to the first one, and that one shows up. I.e.
// from your code
rectangle.setBackgroundColor(ColorConstants.green);
// new code
RectangleFigure r2 = new RectangleFigure();
r2.setBounds(new Rectangle(0,0,10,10));
r2.setBackgroundColor(ColorConstants.blue);
rectangle.add(r2);
// back to your code
lws.setContents(rectangle);
It looks fine to me - there's a little blue rectangle in the top left corner of the totally green canvas. I guess that the figure you use as the contents of the canvas, by default (and probably by necessity), takes up the whole canvas.
Related
Disclaimer: I am using Java and Javafx 11. Just putting it out there :)
I am in the process of trying to create an Interpreter for Logo, but have run into a roadblock. You see, I defaulted to using a canvas to display all the things I needed as that is fitting for what I am doing. However, I did not account for the fact that my Turtle needed to move.
private void drawTurtle()
{
vertices[0] = new Vector2(position.x, position.y + 15); // The three points that make the triangle that is the turtle
vertices[1] = new Vector2(position.x - 15, position.y);
vertices[2] = new Vector2(position.x + 15, position.y);
vertices[1] = Renderer.rotatePoint(vertices[1], position, rotation); // applying rotation to vertices
vertices[2] = Renderer.rotatePoint(vertices[2], position, rotation);
vertices[0] = Renderer.rotatePoint(vertices[0], position, rotation);
Renderer.drawLine(vertices[2], vertices[1], currentPen); // drawing the vertices
Renderer.drawLine(vertices[2], vertices[0], currentPen);
Renderer.drawLine(vertices[1], vertices[0], currentPen);
}
Trails left due to rotating the turtle in realtime.
In order to achieve this without leaving "trails", I tried to erase the existing turtle by drawing with a white pen over it. That gave me... weird results.
This is after rotating the turtle 360 degrees.
Then I came across a post here on SO talking about how I should use a Line object on a Pane if I wanted to move stuff. And well, I tried combining it with a canvas to make a CanvasPane:
public class CanvasPane extends Pane
{
public final Canvas canvas;
public CanvasPane(double width, double height)
{
setWidth(width);
setHeight(height);
canvas = new Canvas(width, height);
getChildren().add(canvas);
canvas.widthProperty().bind(this.widthProperty()); // Change this so this canvas does not scale with the pane, and its size is constant.
canvas.heightProperty().bind(this.heightProperty());
}
}
And added line objects to this so I can then edit their start and end values to make the turtle move, but I got nothing out of it, no line to show, and I am quite confused and don't know what to do. Nothing on the great internet helped my either, so I am now asking this question to see if anyone has ideas on how I can move my turtle flawlessly. And no, I can't use clearRect()
TLDR: My turtle leaves trails when moving on a canvas, and using Line and Pane doesn't work, and I can't use clearRect() on my canvas. Help!
Use one Pane to hold both the Canvas Node and your "turtle" Node.
Canvas canvas = new Canvas(640, 480);
Shape turtle = new Polygon(); // fill in the points
Pane p = new Pane(canvas, turtle);
Now you can control the position of the turtle node by either setting the layout coordinates or applying a translation. As it was added last, it will be drawn over the Canvas. (You could also use a StackPane to make that layering more explicit.)
I'm creating simple app i have Tree object where i store filenames when user choose one SWTImageCanvas.loadImage(path) is being called. Every image has some points defined so points are displayed as gc.fillOval. When user move mouse over oval it name is being displayed i achive this by setting some additional variable and using SWTImageCanvas.redraw() method. Such redrawing cause blinking of canvas so i thought about double buffering i have read some tutorials about it but when i'm trying to run it my image is hovered by white layer with ovalls on it here is my drawing function
private void drawStations(Event e) {
Rectangle clientRect = mainSWTImageCanvas.getClientArea();
if(mainSWTImageCanvas.getSourceImage()!=null)
{
if(mainSWTImageCanvas.getScreenImage()!=null)
mainSWTImageCanvas.getScreenImage().dispose();
Image screenImage = new Image(mainSWTImageCanvas.getDisplay(),clientRect.width,clientRect.height);
this.gc = new GC(screenImage);
//drawing ovals on gc
.
.
.
this.gc.drawImage(screenImage, 0, 0);
this.gc.dispose();
e.gc.drawImage(screenImage, 0, 0);
}
It turns out that double buffering in swt display can by done by passing SWT.DOUBLE_BUFFERED in constructor.
Bitmap newBm = ...
Canvas canvas = new Canvas(newBm);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.WHITE);
paint.setTextSize((int) (44 * scale));
Rect bounds = new Rect();
paint.getTextBounds(gText, 0, gText.length(), bounds);
canvas.drawText(gText, x, y, paint);
I drew text on the Bitmap like so. How could I get a grey background that is the same height as the text but covers the whole screen??
You could use a Rect. Before drawing the text draw the Rect to the screen:
int screenWidth = getApplicationContext().getResources().getDisplayMetrics().widthPixels;
Rect greyBack = new Rect(0,top,screenWidth,bottom);
Paint paint = new Paint();
paint.setARGB(128, 100, 100, 100); //added alpha because Snapchat has translucent //grey background
canvas.drawRect(greyBack, paint);
top and bottom need to be coordinates above and below the text. You could use y's value and take away a bit for top and add a bit for bottom. How much you add/subtract is up to you and changes the height of the greyBack background.
The best way to see and learn how these sort of things are done with well written code is to look at the android source code itself. For example here is the onDraw method for a TextView it includes additional stuff you won't probably need like compoundPadding, but you can follow it through and get the basic concept of how it's done.
I have a canvas and a simple bitmap for background image, fills the whole screen. I created a rect painted black and set it's alpha to 250 in order to make a "dark" effect on the background image. My aim to make a simple circle object that reveals the place it's hovering above. I tried thinking in many ways how to excecute it and failed.
I think the best way is to create a simple circle that manages to decrease the darkness alpha on the position it hovers above, but I have no idea how to do it.
The relevant part of my code:
private ColorFilter filter = new LightingColorFilter(Color.BLACK, 1);
private Paint darkPaint = new Paint(Color.BLACK), paint = new Paint(), paint2 = new Paint();//The style of the text and dark.
public DarkRoomView(Context context) {
super(context);
myChild = this;
darkPaint.setColorFilter(filter);
darkPaint.setAlpha(250);
paint2.setAlpha(10);
paint.setAlpha(50);
}
private void loadGFX() {//Loads all of this view GFX file.
backgroundImage = BitmapFactory.decodeResource(getResources(), R.drawable.darkroomscreen);
lightImage = BitmapFactory.decodeResource(getResources(), R.drawable.light);
}
private void drawGFX(Canvas canvas) {
canvas.drawBitmap(backgroundImage, 0, 0, paint2);//The backgeound image.
canvas.drawRect(0, 0, WIDTH, HEIGHT, darkPaint);//The darkness.
canvas.drawBitmap(lightImage, 50, 50, paint);//A spotlight.
}
Any ideas how I should get it done?
Thanks!
For the spotlight, you could draw a circle of the original image over the darkness. You'd simply need to find the correct rectangle of the original image (based on where your finger is), and then draw a circle of that particular rectangle over the darkness. Trying to look "through" the darkness won't really get you anywhere; you need to place something over it.
By the time you draw the "spotlight", you've already darkened the image with the rectangle. It would be difficult to recover information lost during that draw.
A more flexible approach would be to draw a dark rectangle with a spotlight in a separate image (that is, compose the "darkness" and spotlight alpha and color mask image first), and then draw that mask image on top of the background as a separate step. This would also let you easily do things like e.g. give the spotlight fuzzy borders.
When i execute the code bellow and add in mySimpleXYPlot.getGraphWidget().getBorderPaint().setColor(Color.WHITE);
the app crashes when i launch it on my device.
what i'm trying to accomplish is getting rid of the black border around the entire graph. it is about 2cm thick on located on the top, left and bottom sides of the chart. Is there any way i can get rid of this black border?
public class MainActivity extends Activity {
private XYPlot mySimpleXYPlot;
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Create a couple arrays of y-values to plot:
Number[] days = { 1 , 2 , 3 , 4 , 5 , 6 , 7 };
Number[] values = { 380, 1433, 1965, 3200, 3651, 3215, 3217 };
// initialize our XYPlot reference:
mySimpleXYPlot = (XYPlot) findViewById(R.id.mySimpleXYPlot);
mySimpleXYPlot.getBackgroundPaint().setColor(Color.WHITE);
mySimpleXYPlot.setBorderStyle(XYPlot.BorderStyle.NONE, null, null);
mySimpleXYPlot.getGraphWidget().getBackgroundPaint().setColor(Color.WHITE);
mySimpleXYPlot.getGraphWidget().getGridBackgroundPaint().setColor(Color.WHITE);
// Domain
mySimpleXYPlot.getGraphWidget().setDomainLabelPaint(null);
mySimpleXYPlot.getGraphWidget().setDomainOriginLinePaint(null);
mySimpleXYPlot.setDomainStep(XYStepMode.INCREMENT_BY_VAL, days.length);
mySimpleXYPlot.setDomainValueFormat(new DecimalFormat("0"));
//Range
mySimpleXYPlot.getGraphWidget().setRangeOriginLinePaint(null);
mySimpleXYPlot.setRangeStep(XYStepMode.SUBDIVIDE, values.length);
mySimpleXYPlot.setRangeValueFormat(new DecimalFormat("0"));
//Remove legend
mySimpleXYPlot.getLayoutManager().remove(mySimpleXYPlot.getLegendWidget());
mySimpleXYPlot.getLayoutManager().remove(mySimpleXYPlot.getDomainLabelWidget());
mySimpleXYPlot.getLayoutManager().remove(mySimpleXYPlot.getRangeLabelWidget());
mySimpleXYPlot.getLayoutManager().remove(mySimpleXYPlot.getTitleWidget());
// Turn the above arrays into XYSeries':
XYSeries series1 = new SimpleXYSeries(
Arrays.asList(days),
Arrays.asList(values),
"Series1"); // Set the display title of the series
// Create a formatter to use for drawing a series using LineAndPointRenderer:
LineAndPointFormatter series1Format = new LineAndPointFormatter(
Color.rgb(0, 200, 0), // line color
Color.rgb(0, 100, 0), // point color
Color.CYAN); // fill color
// setup our line fill paint to be a slightly transparent gradient:
Paint lineFill = new Paint();
lineFill.setAlpha(200);
lineFill.setShader(new LinearGradient(0, 0, 0, 250, Color.WHITE, Color.GREEN, Shader.TileMode.MIRROR));
series1Format.setFillPaint(lineFill);
// add a new series' to the xyplot:
mySimpleXYPlot.addSeries(series1, series1Format);
// by default, AndroidPlot displays developer guides to aid in laying out your plot.
// To get rid of them call disableAllMarkup():
mySimpleXYPlot.disableAllMarkup();
}
}
If you want to get rid of all of the color behind your graph, you will need the following three methods. Each of which gets rid of different parts.
//This gets rid of the gray grid
mySimpleXYPlot.getGraphWidget().getGridBackgroundPaint().setColor(Color.TRANSPARENT);
//This gets rid of the black border (up to the graph) there is no black border around the labels
mysimpleXYPlot.getBackgroundPaint().setColor(Color.TRANSPARENT);
//This gets rid of the black behind the graph
mySimpleXYPlot.getGraphWidget().getBackgroundPaint().setColor(Color.TRANSPARENT);
//With a new release of AndroidPlot you have to also set the border paint
plot.getBorderPaint().setColor(Color.TRANSPARENT);
Hope this helps.
Border line can be hidden by this method:
plot.setBorderPaint(null);
plot.setPlotMargins(0, 0, 0, 0);
I was able to figure out how to fix the graph with this information but I had to pull together the information from several of these posts. There appears to be 4 different background areas:
* grid (and axis labels)
* area around the graph
* border around the graph.
* margin around the border
The background color for the grid and range/domain labels are set using
plot.getGraphWidget().getBackgroundPaint().setColor(background_color);
The area round the grid can get set by:
plot.getBackgroundPaint().setColor(background_color);
This still leaves a border that is drawn around the graph. You can either get rid of the border:
plot.setBorderPaint(null);
or set the background color
plot.getBorderPaint().setColor(background_color);
This leaves the margin around the entire plot. This can be removed using
plot.setPlotMargins(0, 0, 0, 0);
There should be a way to change the color for the margin instead of just removing it but didn't bother to figure that out.