I read a tutorial online about drawing a Circle (1st part of tutorial):
Introduction to 2D drawing in Android with example
I got it worked. Now I want to separate them into 2 classes:
MainActivity.java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new SimpleView(this));
}
}
SimpleView.java
public class SimpleView extends SurfaceView {
public SimpleView(Context context) {
super(context);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int x = getWidth();
int y = getHeight();
int radius;
radius = 100;
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.GREEN);
canvas.drawPaint(paint);
// Use Color.parseColor to define HTML colors
paint.setColor(Color.parseColor("#CD5C5C"));
canvas.drawCircle(x / 2, y / 2, radius, paint);
}
}
However, I wasn't able to get them work: it never draws anything.
What did I do wrong here?
If you want to use a SurfaceView you can, all you need to do is to call setWillNotDraw(false) on the constructor so the class will look like this:
public class SimpleView extends SurfaceView {
public SimpleView(Context ctx) {
super(ctx);
setWillNotDraw(false); //notice this method call IMPORTANT
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int x = getWidth();
int y = getHeight();
int radius;
radius = 100;
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.GREEN);
canvas.drawPaint(paint);
// Use Color.parseColor to define HTML colors
paint.setColor(Color.parseColor("#CD5C5C"));
canvas.drawCircle(x / 2, y / 2, radius, paint);
}
}
Related
I have a custom view that is a circle. Here is the code for my CircleView:
public class CircleView extends View {
private static final int START_ANGLE_POINT = 90;
private final Paint paint;
private final RectF rect;
private float angle;
public CircleView(Context context, AttributeSet attrs) {
super(context, attrs);
final int strokeWidth = 40;
paint = new Paint();
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(strokeWidth);
//Circle color
paint.setColor(Color.RED);
rect = new RectF(strokeWidth, strokeWidth, 1000 + strokeWidth, 1000 + strokeWidth);
//Initial angle is zero
angle = 0;
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawArc(rect, START_ANGLE_POINT, angle, false, paint);
}
public float getAngle() {
return angle;
}
public void setAngle(float angle) {
this.angle = angle;
} }
and here is how I declare it in the xml layout of an activity:
<com.my_package.ui.recording.CircleView
android:id="#+id/circleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
All standard stuff. This is how my custom image looks like
Now, I want to place an imageView in the centre on the circleView? Does any one know how can I achieve that?
This is ideally what I would like to end up with:
Thank you in advance.
If you aren't set on using an ImageView and really just want to draw the bitmap in the center then have a look at canvas' drawBitmap method. This will allow you to draw it however/wherever you want.
I'm trying to draw 4 rectangles on the canvas so that the canvas is divided in 4 equal rectangles. With the code I now have, only the last rectangle in my code is drawn.
This is the code in my Activity:
protected void onCreate(Bundle savedInstanceState) {
...
setContentView(new MyView(this));
}
public class MyView extends View {
public MyView(Context context) {
super(context);
// TODO Auto-generated constructor stub
setFocusableInTouchMode(true);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int x = getWidth();
int y = getHeight();
Paint paintTopLeft = new Paint();
paintTopLeft.setStyle(Paint.Style.FILL);
paintTopLeft.setColor(Color.WHITE);
canvas.drawPaint(paintTopLeft);
// Use Color.parseColor to define HTML colors
paintTopLeft.setColor(Color.parseColor("#F44336"));
canvas.drawRect(0,0,x / 2,y / 2,paintTopLeft);
Paint paintTopRight = new Paint();
paintTopRight.setStyle(Paint.Style.FILL);
paintTopRight.setColor(Color.WHITE);
canvas.drawPaint(paintTopRight);
// Use Color.parseColor to define HTML colors
paintTopRight.setColor(Color.parseColor("#2196F3"));
canvas.drawRect(x / 2, 0, x, y / 2, paintTopRight);
}
}
What am I doing wrong?
Actually I see only two rectangles that are drawn with your code. But anyway, the problem is that you are calling canvas.drawPaint which clears/fills the complete canvas with that color. So you are erasing all rectangles that have been drawn already just before you draw the last one.
This code should work:
protected void onCreate(Bundle savedInstanceState) {
...
setContentView(new MyView(this));
}
public class MyView extends View {
public MyView(Context context) {
super(context);
// TODO Auto-generated constructor stub
setFocusableInTouchMode(true);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int x = getWidth();
int y = getHeight();
Paint paintTopLeft = new Paint();
paintTopLeft.setStyle(Paint.Style.FILL);
paintTopLeft.setColor(Color.WHITE);
//canvas.drawPaint(paintTopLeft); // don't do that
// Use Color.parseColor to define HTML colors
paintTopLeft.setColor(Color.parseColor("#F44336"));
canvas.drawRect(0,0,x / 2,y / 2,paintTopLeft);
Paint paintTopRight = new Paint();
paintTopRight.setStyle(Paint.Style.FILL);
paintTopRight.setColor(Color.WHITE);
// canvas.drawPaint(paintTopRight); // don't do that
// Use Color.parseColor to define HTML colors
paintTopRight.setColor(Color.parseColor("#2196F3"));
canvas.drawRect(x / 2, 0, x, y / 2, paintTopRight);
}
}
I want to add xml layout to custom view. It is done in commented section of code. But I am not able to draw after doing that. This Code paint red circle in center of screen. After uncommenting commented lines circle is not painted.
public class Main extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new MyView(this));
}
public class MyView extends View {
Paint paint;
public MyView(Context context) {
super(context);
// View view = inflate(context, R.layout.activity_main_zadanie, null);
// view.setFocusable(true);
// addView(view);
paint = new Paint();
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
int x = getWidth();
int y = getHeight();
int radius;
radius = 100;
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.WHITE);
canvas.drawPaint(paint);
// Use Color.parseColor to define HTML colors
paint.setColor(Color.parseColor("#CD5C5C"));
canvas.drawCircle(x / 2, y / 2, radius, paint);
}
}
}
Your new view is probably covering the canvas on your custom view. Try setting the background to translucent in R.layout.activity_main_zadanie.
I'm using this method to draw a circle in my app:
public void drawCircle(){
paint.setColor(Color.rgb(52, 73, 94));
paint.setFlags(Paint.ANTI_ALIAS_FLAG);
canvas.drawCircle(100, 200, 60, paint);
}
The problem is that the circle appears kind of oval and with pixellated edges.
I used the ANTI_ALIAS_FLAG but it didn't work.
How to draw a circle with smooth edges?
EDIT
I using a framework for games. from this book: http://www.amazon.com/Beginning-Android-Games-Mario-Zechner/dp/1430246774
Try This
#Override
public void onDraw(Canvas canvas){
super.onDraw(canvas);
canvas.drawCircle(x, y, radius, paint);
}
For a better reference on drawing custom views check out the official Android documentation
Good Luck!
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new MyView(this));
}
public class MyView extends View {
public MyView(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
int x = getWidth();
int y = getHeight();
int radius;
radius = 100;
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.WHITE);
canvas.drawPaint(paint);
// Use Color.parseColor to define HTML colors
paint.setColor(Color.parseColor("#CD5C5C"));
canvas.drawCircle(x / 2, y / 2, radius, paint);
}
}
I have this code.
Only the first drawLine gets drawn and the rest 2 are not. Can anyone explain why the other two drawlines do not work in the present case?
They work if I replace "factor" with "1/2" in the drawLine() statements.
Thanks
public class RenderView extends View {
Paint paint;
private float factor = 1/2;
public RenderView(Context context) {
// TODO Auto-generated constructor stub
super(context);
paint = new Paint(Paint.ANTI_ALIAS_FLAG);
}
#Override
protected void onDraw(Canvas canvas) {
int screenWidth = canvas.getWidth();
int screenHeight = canvas.getHeight();
paint.setColor(Color.RED);
canvas.drawLine(0, 0, screenWidth, screenHeight, paint);
canvas.drawLine(factor*screenWidth, 0, factor*screenWidth, screenHeight, paint);
canvas.drawLine(0, factor*screenHeight, screenWidth, factor*screenHeight, paint);
invalidate();
}
}
1/2 is 0 (by integer division). Try 1f/2 or just 0.5f.
I think the problem is that 1/2 is integer division, and so 1/2 = 0. Try 0.5f instead.