Draw multiple rectangles android canvas - android

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);
}
}

Related

Android: How do I separate it into 2 class?

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);
}
}

How to set android xml layout to custom view and be able to draw on it

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.

Android - How to change canvas to relative layout

I want to add canvas to relative layout. How, I do this ?
public class Board extends View{
Canvas c;
public Board(Context context) {
super(context);
// TODO Auto-generated constructor stub
character = BitmapFactory.decodeResource(getResources(), R.drawable.female_char_2);
bg = BitmapFactory.decodeResource(getResources(), R.drawable.ice_texture);
//ARENA LAYOUT is Relative Layout
arenaLayout = (RelativeLayout) findViewById(R.id.arena_layout);
}
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.setBitmap(bg.copy(Bitmap.Config.ARGB_8888, true));
//set Background
Rect area = new Rect();
area.set(0,0,canvas.getWidth(), canvas.getHeight());
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.BLUE);
canvas.drawRect(area, paint);
//menggambar
menggambar(x,y,canvas);
if(x < canvas.getWidth()) {
x = x + 10;
} else {
y = y + 10;
x = 0;
}
}
private void menggambar(int x2, int y2, Canvas canvas) {
// TODO Auto-generated method stub
canvas.drawBitmap(character, x2, y2, paint);
arenaLayout.addView(getApplicationContext());
}
}
I want to add canvas to relative layout which possess name arenaLayout. How to add canvas to 'arenaLayout' relative layout.
If you confuse read my source code. You can give simple code to add canvas to relative layout
may be you want something in this way...
public class MainActivity extends Activity
{
...........
..........
onCreate(Bundle savedInstances)
{
........
super.oncreate(savedInstances);
arenaLayout = (RelativeLayout) findViewById(R.id.arena_layout);
Board board = new Board(this);
setContentView(board) ;
..........
}
}
or you can add the view to relativeLayout here.

How to draw a circle in android?

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);
}
}

Cannot refresh canvas - pass through draw but doesn't change

I have problem with refreching canvas in my widget. I create custom widget and I want to repaint first cell on click.
There ins activity
public class TestView extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ElementView ev = (ElementView)findViewById(R.id.surface2);
ev.setOnClickListener(evOnClick);
}
public OnClickListener evOnClick = new OnClickListener() {
#Override
public void onClick(View v) {
ElementView temp=(ElementView)v;
temp.paint.setColor(Color.RED);
temp.canvas.drawRect(new Rect(0,0,90,90),temp.paint);
temp.postInvalidate();
}
};
}
and there is ElementView ( widget which I want to repaint )
public class ElementView extends View {
private final int width=100;
private final int height=100;
public Paint paint=null;
public Canvas canvas=null;
public ElementView(Context context) {
super(context);
paint = new Paint();
}
public ElementView(Context context, AttributeSet attr) {
super(context, attr);
paint = new Paint();
}
public ElementView(Context context, AttributeSet attr, int defaultStyles) {
super(context, attr, defaultStyles);
paint = new Paint();
}
#Override
protected void onMeasure(int widthSpec, int heightSpec) {
int measuredWidth = MeasureSpec.getSize(widthSpec);
int measuredHeight = MeasureSpec.getSize(heightSpec);
setMeasuredDimension(this.width,this.height);
}
#Override
protected void onDraw(Canvas canvas) {
this.canvas=canvas;
// get the size of your control based on last call to onMeasure
int height = getMeasuredHeight();
int width = getMeasuredWidth();
// Now create a paint brush to draw your widget
paint.setColor(Color.GREEN);
//define border
this.canvas.drawLine(0, 0, 0, 99, paint);
this.canvas.drawLine(0, 0, 99,0, paint);
this.canvas.drawLine(99, 0, 99, 99, paint);
this.canvas.drawLine(0, 99, 99,99, paint);
//define cells
this.canvas.drawLine(0,50,99,50,paint);
this.canvas.drawLine(30,0,30,50,paint);
//draw green rectangle
this.canvas.drawRect(new Rect(0,0,50,50),paint);
//draw some text
paint.setTextSize(8);
paint.setColor(Color.RED);
String displayText = "test";
Float textWidth = paint.measureText(displayText);
int px = width / 2;
int py = height / 2;
this.canvas.drawText(displayText, px - textWidth / 2, py, paint);
}
#Override
public boolean dispatchTouchEvent(MotionEvent event) {
paint.setColor(Color.RED);
//change color of first cell
canvas.drawRect(new Rect(0,0,50,50),paint);
return super.dispatchTouchEvent(event);
}
}
When I click on ElementView it enter in Activity in onClick and pass through code without mistake or exception , but doesn't change view . Can anybody tell me where is mistake ?
I don't think writing to the Canvas outside of the onDraw method will have any effect on the screen.
Try setting a flag in your onClick method that you read in onDraw which will trigger your drawing routine.

Categories

Resources