I'm going to draw some sort of glassy buttons in java me (targeting devices with MIDP 2.0).
An Example:
Actually I need to impelement Gradient and Bevel-Emboss effects in Java ME, do you have any opinion or "guideline" on how to implement this?
EDIT: Now I know how to draw gradient background, but That is not sufficient.
Is it possible to draw such glassy button in Java ME?
I've worked with C# and I can draw these kinds of glassy buttons there, but I'm struggling on how to simulate something like these buttons in Java ME or at least something near to them, Note that I'm looking for a good guidance and help to move forward.
Do I need to provide more information? If so, please let me know.
Thanks In advance.
You can do it by using an alpha gradient paint. Heres an example:
Graphics2D g = (Graphics2D)screen.getGraphics();
g.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g.setFont(new Font("Serif", Font.BOLD, 30));
Color c1 = new Color(0,0,0,0);
Color c2 = new Color(0,0,0,100);
GradientPaint gradient = new GradientPaint(10,8,c1,10,40,c2,true);
g.setColor(Color.GREEN);
g.fillRect(0, 0, screen.width, screen.height);
g.setColor(Color.BLACK);
g.setPaint(gradient);
g.fillRoundRect(100, 100, 200, 50, 25, 25);
g.setPaint(Color.BLACK);
g.drawRoundRect(100, 100, 200, 50, 25, 25);
g.drawString("Hello World!", 118, 135);
it will look like this:
You can use LWUIT framework for developing java-me (MIDP 2.0) applications. Its good GUI framework for java-me application. Here you can create the theme manually using ResourceEdit. For more info see this discussion and LWUIT blog also.
yoy can not do so in me because it dont have such reach effect on UI
get image that have effect like that gredient and make it transparent using
btn.getStyle().setBgTransparency(100) // from 0-255
note: you must use images that is already semi transparent , if not than setBgTransparency would not work properly
I can not recommend you to use canvas
i recommend you to use use LWUIT
it have many more effects ads you required ,like
btnBuzz.getStyle().setBorder(Border.createBevelLowered());
it have different layout as well
Related
May I ask if it is possible to make the text in swing more clear?
Here's how the word "File" looks in JavaFX:
And here's how it looks in Swing:
The JavaFX one is absolutely better. Is there any way to make the font in Swing look like the one in JavaFX?
P.S. Both of them are using the font "Microsoft YaHei" at 12px
I found a method to open/close anti-alias like
#Override
public void paint(Graphics g) {
super.paint(g);
Graphics2D g2d = (Graphics2D) g;
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_OFF);
g2d.setRenderingHint(RenderingHints.KEY_STROKE_CONTROL,RenderingHints.VALUE_STROKE_DEFAULT);
g2d.setFont(new Font("Times New Roman", Font.PLAIN, 18));
g2d.drawString("File", 50, 50);
}
But it seems that it does not work well
These are my result in testing different fonts:
Times New Roman
Swing
"File" in times new roman
JavaFX
"File" in times new roman
I suppose it is the problem of my jdk. After I change it to jdk 11, it works well. (it is my font in jdk 11)
jdk11's "File"
First off, I have tried other solutions. Unfortunately they rely on you using a cross platform LAF.
A panel in OS X's System preferences:
looks identical to a JTabbedPane:
but without the tabs. I am trying to make something that feels native, but I can't find any other components with this UI, and I can't figure out how to hack a JTabbedPane so it displays normally just without tabs. Any ideas?
I can't figure out how to hack a JTabbedPane so it displays normally just without tabs.
I assume you are trying to display multiple panels in the same space. If so, then you can use a CardLayout. You can swap panels by specifying the name of the panel to display in the CardLayout.
Check out the section from the Swing tutorial on How to Use CardLayout for more information and examples.
So I ended up just working on my paintComponent method, and I think this makes it look pretty accurate:
#Override
public void paintComponent(Graphics g) {
Graphics2D g2 = (Graphics2D) g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2.setColor(new Color(212, 212, 212));
g2.fillRoundRect(0, 0, this.getWidth(), this.getHeight(), 10, 10);
g2.setColor(new Color(223, 223, 223));
g2.fillRoundRect(0, 1, this.getWidth(), this.getHeight()-1, 10, 10);
g2.setColor(new Color(227, 227, 227));
g2.fillRoundRect(1, 1, this.getWidth()-2, this.getHeight()-2, 10, 10);
}
I think it could be optimized a bit by changing fill() to draw() but this gets the job done. Unfortunately it won't look great on other operating systems, so I will have to handle those separately.
Edit: matched colors using Photoshop.
I've got a problem with setting an OutlinePaint to a line from LineAndShapeRenderer in JFreeChart.
I've found this article http://www.jfree.org/phpBB2/viewtopic.php?f=3&t=28347&p=78648&hilit=outlines+2d+line#p78648 which describes my problem also.
David.Gilbert writes "You'll have to modify the LineAndShapeRenderer code, because right now it just draws a single line between the data points (using the seriesPaint)." This was in 2009 and I can't find any todays solutions.
Does anybody has an idea how to modify the LineAndShapeRenderer to set the Outline of the line.
Thank you guys.
You'll have to override the drawItem() method of LineAndShapeRenderer. In your implementation, you'll need to recapitulate the existing code, using the public accessors, as shown here for XYLineAndShapeRenderer. The existing implementation uses the graphics context's fill() method to render a shape and draw() to stoke its outline; each invocation can have a different paint setting. No similar dichotomy exists for draw(line), but you can get a comparable effect using a composite Stroke, as shown here.
I don't know how to set each paint.
Starting form this example, draw() a Line2D with one color and the default Stroke:
Line2D shape = new Line2D.Double(PAD, PAD, SIZE - PAD, SIZE - PAD);
g.setColor(Color.blue);
g.draw(shape);
And draw() the outline with another color and a CompositeStroke:
BasicStroke s1 = new BasicStroke(16f);
BasicStroke s2 = new BasicStroke(1f);
g.setStroke(new CompositeStroke(s1, s2));
g.setColor(Color.red);
g.draw(shape);
See also this related example.
Ok, so I am trying to add ligting to my game but am having some problems in open gl using blending.
What I am trying to do, is cover the whole screen with a black square. Then, cut holes in it by applying another shape over it with a lower alpha level.
Gdx.gl.glEnable(GL20.GL_BLEND);
Gdx.gl.glBlendFunc(GL20.GL_SRC_ALPHA, GL20.GL_SRC_ALPHA);
Gdx.gl20.glBlendEquation(GL.GL_FUNC_SUBTRACT);
woods.shapes.begin(ShapeType.Filled);
woods.shapes.setColor(255, 255, 255, 200);
woods.shapes.rect(0, 0, 600, 600);
woods.shapes.setColor(255, 255, 255, 10);
woods.shapes.rect(300, 300, 50, 50);
woods.shapes.end();
Gdx.gl20.glBlendEquation(GL.GL_FUNC_ADD);
Gdx.gl.glDisable(GL20.GL_BLEND);
This is what I am using for it right now, but I can't seem to get it right, the results are never what I am expecting. I suspect it has something to do with my blendfunc or blendequation but I have tried tons of different combinations to no avail. Any help at all would be fantastic.
I am drawing a triangle on a Canvas, something like:
canvas.moveTo(0, 30);
canvas.lineTo(40, 0);
canvas.lineTo(40, 40);
canvas.lineTo(40, 40);
canvas.lineTo(0, 30);
And get proper triangle on my Canvas. But I need to curve the sides a little and fill that path with specific color. What is the easiest way to do this? Drawing arcs? But how to fill the object?
Thanks!
EDIT: I noticed you were using android's canvas, not HTML Canvas, sorry. The concept is exactly the same except you'll call quadTo() instead of quadraticCurveTo(), so my example should still get you going.
Also on android you use canvas.drawPath(path, paint) and pass in a paint that has its Paint.style set to FILL_AND_STROKE.
You will want to construct the path, fill() it, then stroke() it in order to get both a filled path with the stroke outline.
To get that particular shape, the easiest way is to draw two quadratic curves. A quadratic curve first needs a control point x,y then the end point x,y. The control point for both curves should be around the middle of your desired triangle. Here is an example:
ctx.fillStyle = "lightgray";
ctx.moveTo(0, 100);
ctx.quadraticCurveTo(50, 50, 50, 0);
ctx.quadraticCurveTo(50, 50, 100, 100);
ctx.lineTo(0, 100);
ctx.fill();
ctx.stroke();
Here is that example live for you.