I am instantiating the canvas variable in the onCreate function and if i draw a line in onCreate function, it is displayed fine. However, if i draw the line in an onClick function of a button, it does not work. What could be the reason.
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
imageView = (ImageView) this.findViewById(R.id.imageView);
BitmapDrawable drawable = (BitmapDrawable) imageView.getDrawable();
Bitmap bitmap = drawable.getBitmap();
Bitmap mutableBitmap = bitmap.copy(Bitmap.Config.ARGB_8888, true);
canvas = new Canvas(mutableBitmap);
imageView.setImageBitmap(mutableBitmap);
paint = new Paint();
paint.setColor(Color.rgb(255, 153, 51));
paint.setStrokeWidth(10);
}
public void displayLine(View view) {
canvas.drawLine(10, 20, 400, 500, paint);
}
Not that I would necessarily do it this way... but have you tried adding an invalidate call? i.e.:
public void displayLine(View view) {
canvas.drawLine(10, 20, 400, 500, paint);
view.invalidate();
}
Related
I wanted to know if it was possible to crop a picture to any other shape not just square, rectangle or circle.
Basically what I am looking for is that, the user can select a template of a png file (already present) and it cuts the picture in that shape.
Check out this code:
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ImageView imageViewPreview = (ImageView) findViewById(R.id.imageview_preview);
new Thread(new Runnable() {
#Override
public void run() {
final Bitmap source = BitmapFactory.decodeResource(MainActivity.this.getResources(),
R.drawable.source);
final Bitmap mask = BitmapFactory.decodeResource(MainActivity.this.getResources(),
R.drawable.mask);
final Bitmap croppedBitmap = cropBitmap(source, mask);
runOnUiThread(new Runnable() {
#Override
public void run() {
imageViewPreview.setImageBitmap(croppedBitmap);
}
});
}
}).start();
}
private Bitmap cropBitmap(final Bitmap source, final Bitmap mask){
final Bitmap croppedBitmap = Bitmap.createBitmap(
source.getWidth(), source.getHeight(),
Bitmap.Config.ARGB_8888);
final Canvas canvas = new Canvas(croppedBitmap);
canvas.drawBitmap(source, 0, 0, null);
final Paint maskPaint = new Paint();
maskPaint.setXfermode(
new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));
canvas.drawBitmap(mask, 0, 0, maskPaint);
return croppedBitmap;
}
}
The main function is the "cropBitmap" function. Basically it receives two bitmaps, a source and a mask, and then it "crops" the source bitmap using the mask's shape.
This is my source bitmap:
This is the mask bitmap:
And this is the result:
Also, check out this great presentation, this might help you too: Fun with Android shaders and filters
I need to be able to create a custom image through code, and then set that image to an imageview
I want this image to have a solid background colour, a title and an icon.
I want it to be customisable so that I can call to create an image with values
for example
createImage(String bckgColourHex, String title, int iconResource){
// create image using value here
return image.
}
Then I can use the drawable to set it to my imageView
This is what I am trying so far
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView image = (ImageView) findViewById(R.id.imageView1);
BitmapDrawable customImage = writeOnDrawable(R.drawable.background_gradient, "TEXT GOES HERE");
image.setBackgroundDrawable(customImage);
}
public BitmapDrawable writeOnDrawable(int drawableId, String text){
Bitmap bm = BitmapFactory.decodeResource(getResources(), drawableId).copy(Bitmap.Config.ARGB_8888, true);
Paint paint = new Paint();
paint.setStyle(Style.FILL);
paint.setColor(Color.BLACK);
paint.setTextSize(20);
Canvas canvas = new Canvas(bm);
canvas.drawText(text, 0, bm.getHeight()/2, paint);
return new BitmapDrawable(bm);
}
Thank you
public static Drawable makeBorderedDrawable(Context mContext, int width, String xCode, Boolean unAvail) {
Paint p = new Paint();
Bitmap bkg = null;
final int FULL_ALPHA = 0xFF123456; // of whatever color you want
int pixel = FULL_ALPHA;
// first create a mutable bitmap
bkg = Bitmap.createBitmap(width, width, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bkg);
p.setColor(pixel);
c.drawCircle(width / 2, width / 2, width / 2, p);
// or draw rect, or lines, or drawtext....or whatever
return new BitmapDrawable(mContext.getResources(), bkg);
// or you could return a Bitmap if you prefer.
}
i have two imageviews one is gallery image and one is transparent image drawn throw canvas on second image and i want to clean that transparent image by finger
i trying to do like
Link:https://play.google.com/store/apps/details?id=com.steam.doodle&hl=en
i tryd below code
public class MainActivity extends Activity implements OnTouchListener {
ImageView image,transimage;
Paint paint;
Bitmap bitmap,resultbitmap;
Canvas canvas;
Button clear;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
image=(ImageView)findViewById(R.id.imageView1);
transimage=(ImageView)findViewById(R.id.imageView2);
//Bitmap mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.saibaba);
Bitmap mBitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.snw);
Bitmap bmOverlay = Bitmap.createBitmap(mBitmap2.getWidth(), mBitmap2.getHeight(), mBitmap2.getConfig());
Canvas canvas = new Canvas();
canvas.setBitmap(bmOverlay);
paint=new Paint();
paint.setAlpha(200);
// canvas.drawBitmap(mBitmap, 0, 0, null);
canvas.drawBitmap(mBitmap2, 0, 0, paint);
transimage.setImageBitmap(bmOverlay);
}
}
How to clean the canvas by finger
You just need to set Color= Transparent on the method onDraw. This is the tested code and is working.
#Override
protected void onDraw(Canvas canvas) {
if(isEraseMode){
paint.setColor(Color.TRANSPARENT);
canvas.drawPath(eraserPath, erasePaint);
//canvas.save();
}else{
canvas.drawPath(path, paint);
canvas.restore();
}
canvas.drawPath(path, paint);
super.dispatchDraw(canvas);
}
Hope this would help you..:)
I am Getting a problem drawing rectangle over imageview. Here is the peace of code. Xml is also there . my whole concern is if we can draw rect over imageview.??
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.cropimage);
paint=new Paint();
bobj = new BaldBooth1();
bm = BaldBooth1.bMap;
d = new BitmapDrawable(bm);
iv = ((ImageView) findViewById(R.id.image));
iv.setImageDrawable(d);
createRectInView(iv);
((ImageButton) findViewById(R.id.next)).setOnClickListener(this);
}
public void createRectInView(View v) {
paint.setColor(Color.BLACK);
paint.setStrokeWidth(3);
canvas=new Canvas();
canvas.drawRect(50, 50, 80, 80, paint);
v.draw(canvas);
}
Your method createRectInView(View v) does not draw a rectangle over ImageView, it just create a canvas, draw a rectangle on that canvas, then draw the content of ImageView on that canvas, so it does not do what you expect.
Here is one possible resolution: you can extend ImageView and override its onDraw() method, for example..
public class ExtendedImageView extends ImageView {
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint paint = new Paint();
paint.setColor(Color.BLACK);
paint.setStrokeWidth(3);
canvas.drawRect(50, 50, 80, 80, paint);
}
}
Updated:
Hi arun, I just test the code, and it works fine. Here are the details: for example, you can create the ExtendedImageView in package com.abc.widget, so in your cropImage.xml file, replace the <ImageView android:id="#+id/image" android:layout_width="wrap_content" android:layout_height="wrap_content"> to <com.abc.widget.ExtendedImageView android:id="#+id/image" android:layout_width="wrap_content" android:layout_height="wrap_content">. As you see, you only need to change the class name. Then changed the onCreate() method as:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.cropimage);
bobj = new BaldBooth1();
bm = BaldBooth1.bMap;
d = new BitmapDrawable(bm);
iv = ((ImageView) findViewById(R.id.image));
iv.setImageDrawable(d);
((ImageButton) findViewById(R.id.next)).setOnClickListener(this);
}
How can I create animation for moving a image like a curve from top to bottom? Here I used TranslateAnimation for this,
But it will move the image from top to bottom depends on the x, y co-ordinates. But, I want to move the image like a curve.
But in my code, it moves like a line.
public class ImageMoveActivity extends Activity {
/** Called when the activity is first created. */
TranslateAnimation transform;
TextView tv;
ImageView im1,im2,im3;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
transform = new TranslateAnimation(0, 150, 0, 300);
//transform = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 1, Animation.RELATIVE_TO_PARENT, 20, Animation.RELATIVE_TO_PARENT, 50, Animation.RELATIVE_TO_PARENT, 0);
//im1 = (ImageView)findViewById(R.id.imageView1);
im1 = (ImageView)findViewById(R.id.imageView1);
im2 = (ImageView)findViewById(R.id.imageView2);
im3 = (ImageView)findViewById(R.id.imageView3);
tv = (TextView)findViewById(R.id.Textview);
Bitmap bitmap = BitmapFactory.decodeResource(this
.getResources(), R.drawable.xxl);
/* set other image top of the first icon */
Bitmap bitmapStar = BitmapFactory.decodeResource(this
.getResources(), R.drawable.icon);
Bitmap bmOverlay = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Config.ARGB_8888);
// Bitmap bmOverlay1 = Bitmap.createBitmap(bitmapStar.getWidth(),
// bitmapStar.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(bmOverlay);
//Canvas canvas1 = new Canvas(bmOverlay1);
canvas.drawARGB(0x00, 0, 0, 0);
canvas.drawBitmap(bitmap, 0, 0, null);
//canvas1.drawARGB(0x00, 0, 0, 0);
canvas.drawBitmap(bitmapStar, 0, 0, null);
BitmapDrawable dr = new BitmapDrawable(bmOverlay);
//BitmapDrawable dr1 = new BitmapDrawable(bmOverlay1);
dr.setBounds(10, 30, 10, 30);
//dr1.setBounds(10, 30, 10, 30);
im1.setImageDrawable(dr);
//im3.setImageDrawable(dr1);
//im1.setImageDrawable(R.drawable.xxl);
im1.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
start();
hide();
}
private void start() {
// TODO Auto-generated method stub
im1.startAnimation(transform);
transform.setDuration(1000);
//transform.setFillAfter(true);
}
private void hide() {
// TODO Auto-generated method stub
im1.setVisibility(View.GONE);
}
});
}
}
Can any one help me on this?
TranslateAnimation can move Views from one point to another in a straight line. As far as I know you can't give any other path to it. Try using custom views and canvas for the the this, where you can pass x and y coordinates while drawing and invalidating the view. You need to override the following method while extending the View class. The changeCoordinate() method here can change the x,y coordinates in a curve.
public void onDraw(Canvas canvas){
canvas.drawBitmap(bitmap,x,y,null);
changeCoordinate();
invalidate()
}
You can create a series of translate animation from one point to another on curve and apply the animation to views.
Like if we have an imageView which is to be animated, and a1, and a2 are animations to be applied:
imgView.clearAnimation();
imgView.startAnimation(a1);
imgView.clearAnimation();
imgView.startAnimation(a2);