I want to make 2 diagonal triangle buttons like in this question.
How can I achieve this? Should I make a drawable xml with a rectangle and rotate it somehow? Should I make an image and make it clickable only on the triangle parts with the help of mathematics?
package com.example.buttonsView;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Path.FillType;
import android.graphics.Point;
import android.graphics.RectF;
import android.graphics.Region;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
public class TwoButtons extends View {
private Path path;
private Path path1;
private Region region;
private Region region1;
private static int GAP=10;
private ButtonClickEvents buttonClickEvent;
public interface ButtonClickEvents{
public void redButtonClick();
public void blueButtonClick();
}
public void setOnButtonClickEvent(ButtonClickEvents buttonClickEvent) {
this.buttonClickEvent=buttonClickEvent;
}
public TwoButtons(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
private void init() {
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
canvas.drawColor(Color.GRAY);
Paint paint = new Paint();
paint.setColor(android.graphics.Color.BLACK);
canvas.drawPaint(paint);
paint.setStrokeWidth(0);
paint.setColor(android.graphics.Color.RED);
paint.setStyle(Paint.Style.FILL_AND_STROKE);
paint.setAntiAlias(true);
Point a = new Point(GAP, GAP);
Point b = new Point(GAP, getHeight()-2*GAP);
Point c = new Point(getWidth()-2*GAP, GAP);
path = new Path();
path.setFillType(FillType.EVEN_ODD);
path.moveTo(a.x, a.y);
path.lineTo(b.x, b.y);
path.lineTo(c.x, c.y);
path.close();
canvas.drawPath(path, paint);
RectF rectF = new RectF();
path.computeBounds(rectF, true);
region = new Region();
region.setPath(path, new Region((int) rectF.left, (int) rectF.top, (int) rectF.right, (int) rectF.bottom));
paint.setColor(Color.BLUE);
Point a1 = new Point(getWidth()-GAP, getHeight()-GAP);
Point b1 = new Point(getWidth()-GAP, 2*GAP);
Point c1 = new Point(2*GAP, getHeight()-GAP);
path1 = new Path();
path1.setFillType(FillType.EVEN_ODD);
path1.moveTo(a1.x, a1.y);
path1.lineTo(b1.x, b1.y);
path1.lineTo(c1.x, c1.y);
path1.close();
canvas.drawPath(path1, paint);
RectF rectF1 = new RectF();
path1.computeBounds(rectF1, true);
region1 = new Region();
region1.setPath(path1, new Region((int) rectF1.left, (int) rectF1.top, (int) rectF1.right, (int) rectF1.bottom));
}
#Override
public boolean onTouchEvent(MotionEvent event) {
// TODO Auto-generated method stub
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
Point point = new Point();
point.x = (int) event.getX();
point.y = (int) event.getY();
invalidate();
if(region.contains((int)point.x,(int) point.y))
{
if(buttonClickEvent!=null)
buttonClickEvent.redButtonClick();
}else if(region1.contains((int)point.x,(int) point.y))
{
if(buttonClickEvent!=null)
buttonClickEvent.blueButtonClick();
}
return true;
}
return false;
}
}
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.buttonsView.MainActivity" >
<com.example.buttonsView.TwoButtons
android:id="#+id/twoButtons1"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
MainActivity.java
package com.example.buttonsView;
import android.app.Activity;
import android.os.Bundle;
import android.widget.Toast;
import com.afbb.preferencessample.R;
import com.example.buttonsView.TwoButtons.ButtonClickEvents;
public class MainActivity extends Activity {
TwoButtons buttons;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
buttons = (TwoButtons) findViewById(R.id.twoButtons1);
buttons.setOnButtonClickEvent(new ButtonClickEvents() {
#Override
public void redButtonClick() {
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "red",
Toast.LENGTH_SHORT).show();
}
#Override
public void blueButtonClick() {
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "blue",
Toast.LENGTH_SHORT).show();
}
});
}
}
output :
Related
This question already has answers here:
What is a NullPointerException, and how do I fix it?
(12 answers)
Closed 2 years ago.
When I run my android app, it crashes and says that Android app has stopped. It also gives this error message:
java.lang.NullPointerException: Attempt to invoke virtual method 'com.esimerkki.doodl2.DoodleView com.esimerkki.doodl2.FirstFragment.getDoodleView()' on a null object reference
What is wrong with this? Is the reference really null? How could I make this work? I thought these original settings in doodleView have start values?
Here is the code of doodleView class:
package com.esimerkki.doodl2;
import android.content.Context;
import android.view.View;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Point;
import android.provider.MediaStore;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.MotionEvent;
import android.widget.Toast;
import androidx.print.PrintHelper;
import java.util.HashMap;
import java.util.Map;
public class DoodleView extends View {
public DoodleView(Context context, Paint paintScreen, Paint paintLine) {
super( context );
this.paintScreen = paintScreen;
this.paintLine = paintLine;
}
private static final float TOUCH_TOLERANCE = 10;
private Bitmap bitmap; // drawing area
private Canvas bitmapCanvas; //
private final Paint paintScreen; //
private final Paint paintLine; //
private final Map<Integer, Path> pathMap = new HashMap<>();
private final Map<Integer, Point> previousPointMap = new HashMap<>();
public DoodleView(Context context, AttributeSet attrs) {
super(context, attrs); // kutsutaan yliluokanalustajaa
paintScreen = new Paint(); // bittikartan näyttämiseen ruudulla
paintLine = new Paint();
paintLine.setAntiAlias(true);
paintLine.setColor(Color.BLACK);
paintLine.setStyle(Paint.Style.STROKE);
paintLine.setStrokeWidth(5);
paintLine.setStrokeCap(Paint.Cap.ROUND);
#Override
public void onSizeChanged(int w, int h, int OldW, int oldH) {
bitmap = Bitmap.createBitmap(getWidth(), getHeight(),
Bitmap.Config.ARGB_8888);
bitmapCanvas = new Canvas(bitmap);
bitmap.eraseColor(Color.WHITE);
}
public void clear() {
pathMap.clear();
previousPointMap.clear();
bitmap.eraseColor(Color.WHITE);
invalidate();
}
public void setDrawingColor(int color) {
paintLine.setColor(color);
}
public int getDrawingColor() {
return paintLine.getColor();
}
public void setLineWidth(int width) {
paintLine.setStrokeWidth(width);
}
public int getLineWidth() {
return (int) paintLine.getStrokeWidth();
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(bitmap, 0, 0, paintScreen);
for (Integer key : pathMap.keySet())
canvas.drawPath(pathMap.get(key), paintLine); // piirretään viiva
}
#Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getActionMasked(); // tapahtumatyyppi
int actionIndex = event.getActionIndex(); // osoitin
if (action == MotionEvent.ACTION_DOWN ||
action == MotionEvent.ACTION_POINTER_DOWN) {
touchStarted(event.getX(actionIndex), event.getY(actionIndex),
event.getPointerId(actionIndex));
}
else if (action == MotionEvent.ACTION_UP ||
action == MotionEvent.ACTION_POINTER_UP) {
touchEnded(event.getPointerId(actionIndex));
}
else {
touchMoved(event);
}
invalidate();
return true;
}
private void touchStarted(float x, float y, int lineID) {
Path path; // tallennetaan tietyn id:n polku
Point point; // tallennetaan polun viimeinen piste
if (pathMap.containsKey(lineID)) {
path = pathMap.get(lineID);
path.reset();
point = previousPointMap.get(lineID);
}
else {
path = new Path();
pathMap.put(lineID, path);
point = new Point();
previousPointMap.put(lineID, point);
}
path.moveTo(x, y);
point.x = (int) x;
point.y = (int) y;
}
private void touchMoved(MotionEvent event) {
for (int i = 0; i < event.getPointerCount(); i++) {
// luetaan pointtein id ja indeksi
int pointerID = event.getPointerId(i);
int pointerIndex = event.findPointerIndex(pointerID);
if (pathMap.containsKey(pointerID)) {
float newX = event.getX(pointerIndex);
float newY = event.getY(pointerIndex);
Path path = pathMap.get(pointerID);
Point point = previousPointMap.get(pointerID);
// lasketaan kuinka kauas liikuttu
float deltaX = Math.abs(newX - point.x);
float deltaY = Math.abs(newY - point.y);
if (deltaX >= TOUCH_TOLERANCE || deltaY >= TOUCH_TOLERANCE) {
path.quadTo(point.x, point.y, (newX + point.x) / 2,
(newY + point.y) / 2);
point.x = (int) newX;
point.y = (int) newY;
}
}
}
}
private void touchEnded(int lineID) {
Path path = pathMap.get(lineID);
bitmapCanvas.drawPath(path, paintLine);
path.reset(); // tyhjennetään polku
}
public void saveImage() {
final String name = "Doodlz" + System.currentTimeMillis() + ".jpg";
String location = MediaStore.Images.Media.insertImage(
getContext().getContentResolver(), bitmap, name,
"Doodlz Drawing"
);
if (location != null) {
Toast message = Toast.makeText(getContext(),
R.string.message_saved,
Toast.LENGTH_SHORT);
message.setGravity(Gravity.CENTER, message.getXOffset() / 2,
message.getYOffset() / 2);
message.show();
}
else {
Toast message = Toast.makeText(getContext(),
R.string.message_error_saving, Toast.LENGTH_SHORT);
message.setGravity(Gravity.CENTER, message.getXOffset() / 2,
message.getYOffset() / 2);
message.show();
}
}
public void printImage() {
if (PrintHelper.systemSupportsPrint()) {
PrintHelper printHelper = new PrintHelper(getContext());
printHelper.setScaleMode(printHelper.SCALE_MODE_FIT);
printHelper.printBitmap("Doodlz Imate", bitmap);
}
else {
Toast message = Toast.makeText(getContext(),
R.string.message_error_printing, Toast.LENGTH_SHORT);
message.setGravity(Gravity.CENTER, message.getXOffset() / 2,
message.getYOffset() / 2);
message.show();
}
}
}
And here is the code of a LineWidthFragment class:
package com.esimerkki.doodl2;
import android.app.Activity;
import android.app.AlertDialog;
import android.app.Dialog;
import android.content.Context;
import android.content.DialogInterface;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.os.Bundle;
//import android.support.v4.app.DialogFragment;
import android.view.View;
import android.widget.ImageView;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;
import androidx.fragment.app.DialogFragment;
public class LineWidthFragment extends DialogFragment {
private ImageView widthImageView;
#Override
public Dialog onCreateDialog(Bundle bundle) {
AlertDialog.Builder builder =
new AlertDialog.Builder(getActivity());
View lineWidthDialogView =
getActivity().getLayoutInflater().inflate(
R.layout.fragment_line_width, null);
builder.setView(lineWidthDialogView); // lisätään GUI dialogiin
builder.setTitle(R.string.title_line_width_dialog);
widthImageView = (ImageView) lineWidthDialogView.findViewById(
R.id.widthImageView);
final DoodleView doodleView = getDoodleFragment().getDoodleView();
final SeekBar widthSeekBar = (SeekBar)
lineWidthDialogView.findViewById(R.id.widthSeekBar);
widthSeekBar.setOnSeekBarChangeListener(lineWidthChanged);
widthSeekBar.setProgress(doodleView.getLineWidth());
builder.setPositiveButton(R.string.button_set_line_width,
new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface dialog, int id) {
doodleView.setLineWidth(widthSeekBar.getProgress());
}
}
);
return builder.create();
}
private FirstFragment getDoodleFragment() {
return (FirstFragment) getChildFragmentManager().findFragmentById(
R.id.doodleFragment);
}
#Override
public void onAttach(Context context) {
super.onAttach(context);
FirstFragment fragment = getDoodleFragment();
if (fragment != null)
fragment.setDialogOnScreen(true);
}
#Override
public void onDetach() {
super.onDetach();
FirstFragment fragment = getDoodleFragment();
if (fragment != null)
fragment.setDialogOnScreen(false);
}
private final OnSeekBarChangeListener lineWidthChanged =
new OnSeekBarChangeListener() {
final Bitmap bitmap = Bitmap.createBitmap(
400, 100, Bitmap.Config.ARGB_8888);
final Canvas canvas = new Canvas(bitmap); // piirtää bittikarttaan
#Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
Paint p = new Paint();
p.setColor(
getDoodleFragment().getDoodleView().getDrawingColor());
p.setStrokeCap(Paint.Cap.ROUND);
p.setStrokeWidth(progress);
bitmap.eraseColor(
getResources().getColor(android.R.color.transparent,
getContext().getTheme()));
canvas.drawLine(30, 50, 370, 50, p);
widthImageView.setImageBitmap(bitmap);
}
#Override
public void onStartTrackingTouch(SeekBar seekBar) { // tarvitaan
}
#Override
public void onStopTrackingTouch(SeekBar seekBar) { // tarvitaan
}
};
}
Your error says the following:
null object reference
This means that 1 object gives the value 0.
Your code looks fine but if you rewrite the code once again you may solve the mistake.
It is caused by a pitty error in your code.
When rewriting it. You can find that error.
Even if this was a bug with some plugin or anything else.
Also after you rewrote it, if you get the same error then you need to look onto a reference.
I want to set my bitmap converted image in relative layout with the help of custom view but my image not set in the center of relative layout and its not showing complete image
My relative layout where I set my bitmap image`package org.boostram.justcolor;
import android.app.ActionBar;
import android.app.Activity;
import android.app.ProgressDialog;
import android.content.Context;
import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Point;
import android.graphics.Rect;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.os.AsyncTask;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.RequiresApi;
import android.transition.TransitionManager;
import android.util.Log;
import android.view.Display;
import android.view.Gravity;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.Toast;
import com.flask.colorpicker.ColorPickerView;
import com.flask.colorpicker.OnColorChangedListener;
import com.flask.colorpicker.OnColorSelectedListener;
import org.boostram.justcolor.Utils.util;
import static android.R.attr.src;
public class FillPaintActivity extends Activity implements View.OnTouchListener {
private RelativeLayout dashBoard;
Paint paint;
private MyView myView;
int a = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
myView = new MyView(this);
setContentView(R.layout.activity_fill_paint);
ColorPickerView colorPickerView = (ColorPickerView) findViewById(R.id.color_picker_view);
// colorPickerView.setColor(Color.WHITE,true);
paint.setColor(Color.WHITE);
colorPickerView.setInitialColor(Color.WHITE, true);
colorPickerView.addOnColorChangedListener(new OnColorChangedListener() {
#Override
public void onColorChanged(int selectedColor) {
a = 1;
paint.setColor(selectedColor);
// Handle on color change
// Log.d("ColorPicker", "onColorChanged: 0x" + Integer.toHexString(selectedColor));
}
});
colorPickerView.addOnColorSelectedListener(new OnColorSelectedListener() {
#Override
public void onColorSelected(int selectedColor) {
paint.setColor(selectedColor);
// myView.changePaintColor(selectedColor);
Toast.makeText(FillPaintActivity.this, "selectedColor: " +
Integer.toHexString(selectedColor).toUpperCase(),
// Toast.LENGTH_SHORT).show();
}
});
dashBoard = (RelativeLayout) findViewById(R.id.dashBoard);
dashBoard.addView(myView);
}
#Override
public boolean onTouch(View view, MotionEvent motionEvent) {
return false;
}
public class MyView extends View {
// private Paint paint;
private Path path;
public Bitmap mBitmap;
public ProgressDialog pd;
final Point p1 = new Point();
public Canvas canvas;
public MyView(Context context) {
super(context);
paint = new Paint();
paint.setAntiAlias(true);
pd = new ProgressDialog(context);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeJoin(Paint.Join.ROUND);
// paint.setStrokeWidth(5f);
// BitmapDrawable drawable = (BitmapDrawable)
context.getDrawable(R.drawable.unnamed);
// Bitmap bmp = drawable.getBitmap();
// Bitmap mBitmap = Bitmap.createScaledBitmap(bmp, 120, 120,
false);
mBitmap = BitmapFactory.decodeResource(getResources(),
util.Id).copy(Bitmap.Config.ARGB_8888, true);
//mBitmap =
Bitmap.createScaledBitmap((BitmapFactory.decodeResource(getResources(),
util.Id).copy(Bitmap.Config.ARGB_8888, true)),1500,1380,false);
this.path = new Path();
}
#Override
protected void onDraw(Canvas canvas) {
this.canvas = canvas;
// Display display = getWindowManager().getDefaultDisplay();
// int displayWidth = display.getWidth();
// BitmapFactory.Options options = new BitmapFactory.Options();
// options.inJustDecodeBounds = true;
// BitmapFactory.decodeResource(getResources(), util.Id, options);
// int width = options.outWidth;
// if (width > displayWidth)
// {
// int widthRatio = Math.round((float) width / (float)
displayWidth);
// options.inSampleSize = widthRatio;
// }
// options.inJustDecodeBounds = false;
// Bitmap scaledBitmap =
BitmapFactory.decodeResource(getResources(),util.Id , options);
canvas.drawBitmap(mBitmap,0,0 ,paint);
// mBitmap = BitmapFactory.decodeResource
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if (a == 0) {
Toast.makeText(FillPaintActivity.this, "Select Any Color First",
Toast.LENGTH_SHORT).show();
}
// Toast.makeText(FillPaintActivity.this, myView.getWidth()+""+myView.getHeight(), Toast.LENGTH_LONG).show();
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
p1.x = (int) x;
p1.y = (int) y;
if (p1.x < mBitmap.getWidth() && p1.y < mBitmap.getHeight()) {
final int sourceColor = mBitmap.getPixel((int) x, (int) y);
final int targetColor = paint.getColor();
new TheTask(mBitmap, p1, sourceColor, targetColor).execute();
invalidate();
}
// else {
// Toast.makeText(FillPaintActivity.this, "You touched outside the Image", Toast.LENGTH_SHORT).show();
// }
}
return true;
}
public void clear() {
path.reset();
invalidate();
}
public void changePaintColor(int color) {
paint.setColor(color);
}
class TheTask extends AsyncTask<Void, Integer, Void> {
Bitmap bmp;
Point pt;
int replacementColor, targetColor;
public TheTask(Bitmap bm, Point p, int sc, int tc) {
this.bmp = bm;
this.pt = p;
this.replacementColor = tc;
this.targetColor = sc;
}
#Override
protected void onPreExecute() {
// pd.show();
}
#Override
protected void onProgressUpdate(Integer... values) {
}
#Override
protected Void doInBackground(Void... params) {
FloodFill floodFill = new FloodFill(bmp, targetColor, replacementColor);
floodFill.floodFill(pt.x, pt.y);
return null;
}
#Override
protected void onPostExecute(Void result) {
invalidate();
}
}
}
}
https://i.stack.imgur.com/AHpcb.png
My bitmap converted image not set in center of relative layout through view. Kindly help me i'm stuck here for almost two week. Help
I made straight lines with the canvas.drawPath command. But now I want that the color is selectable. So you click on a button and afterwards, the path is in this color, but the previous paths remain in their colors.. The thin with the button comes later, the colour is random at the moment...
I did it, i changed the code from here! Change path color without changing previous paths
Main Activity
package com.example.drawproject;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.app.ActionBar;
import android.support.v4.app.Fragment;
import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.os.Build;
public class MainActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
DrawArea da = new DrawArea(this);
setContentView(da);
}
}
Draw Activity
import android.content.Context;
import android.graphics.*;
import android.util.SparseArray;
import android.view.MotionEvent;
import android.view.View;
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
public class DrawArea extends View {
private List<Stroke> _allStrokes; //all strokes that need to be drawn
private SparseArray<Stroke> _activeStrokes; //use to retrieve the currently drawn strokes
private Random _rdmColor = new Random();
int count = 1;
public DrawArea(Context context) {
super(context);
_allStrokes = new ArrayList<Stroke>();
_activeStrokes = new SparseArray<Stroke>();
setFocusable(true);
setFocusableInTouchMode(true);
}
public void onDraw(Canvas canvas) {
if (_allStrokes != null) {
for (Stroke stroke: _allStrokes) {
if (stroke != null) {
Path path = stroke.getPath();
Paint painter = stroke.getPaint();
if ((path != null) && (painter != null)) {
if(count%2 != 0){
canvas.drawPath(path, painter);
}
}
}
}
}
}
#Override
public boolean onTouchEvent(MotionEvent event) {
final int action = event.getActionMasked();
final int pointerCount = event.getPointerCount();
switch (action) {
case MotionEvent.ACTION_DOWN: {
count++;
if(count%2 != 1)
{pointDown((int)event.getX(), (int)event.getY(), event.getPointerId(0));
break;
}
if (count%2 != 0){
for (int pc = 0; pc < pointerCount; pc++) {
pointDown((int)event.getX(pc), (int)event.getY(pc), event.getPointerId(pc));
}
}
}
case MotionEvent.ACTION_MOVE: {
break;
}
case MotionEvent.ACTION_UP: {
break;
}
}
invalidate();
return true;
}
private void pointDown(int x, int y, int id) {
if(count%2 !=1){
//create a paint with random color
Paint paint = new Paint();
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(10);
paint.setColor(_rdmColor.nextInt());
//create the Stroke
Point pt = new Point(x, y);
Stroke stroke = new Stroke(paint);
stroke.addPoint(pt);
_activeStrokes.put(id, stroke);
_allStrokes.add(stroke);
}
if (count%2 != 0){
//retrieve the stroke and add new point to its path
Stroke stroke = _activeStrokes.get(id);
if (stroke != null) {
Point pt = new Point(x, y);
stroke.addPoint(pt);
}
}
}
}
Lines
package com.example.drawproject;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Point;
public class Stroke {
private Path _path;
private Paint _paint;
public Stroke (Paint paint) {
_paint = paint;
}
public Path getPath() {
return _path;
}
public Paint getPaint() {
return _paint;
}
public void addPoint(Point pt) {
if (_path == null) {
_path = new Path();
_path.moveTo(pt.x, pt.y);
} else {
_path.lineTo(pt.x, pt.y);
}
}
}
For each path declare separate paint object and change paint object of the path that you want to change.
canvas.drawPath(path1, paint1);
canvas.drawPath(path2, paint2);
canvas.drawPath(path3, paint3);
canvas.drawPath(path4, paint4);
The main idea:
public class temp extends View{
private Map<Path,Paint> MyMap = new HashMap<Path,Paint>();
public ViewFeld(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
init();
}
private void init() {
for (int i = 0; i < number of pathes ; i++) {
Path path = new Path();
paint = new Paint();
paint.setColor(Color.MAGENTA);
paint.setStrokeWidth(2);
paint.setStyle(Paint.Style.FILL);
MyMap.put(path, paint);
}
}
protected void onDraw(Canvas canvas) {
for (Path p : MyMap.keySet()) {
canvas.drawPath(p, MyMap.get(p));
}
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float eventX = event.getX();
float eventY = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
Paint p = MyMap.get(path you want to change the color);
// change the color of p
case MotionEvent.ACTION_MOVE:
break;
case MotionEvent.ACTION_UP:
// nothing to do
break;
default:
return false;
}
// Schedules a repaint.
invalidate();
return true;
}
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
public class SingleTouchEventView extends View {
private Paint paint = new Paint();
private Path path = new Path();
public boolean cc = false;
public SingleTouchEventView(Context context, AttributeSet attrs) {
super(context, attrs);
paint.setAntiAlias(true);
paint.setStrokeWidth(18f);
paint.setColor(Color.LTGRAY);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeJoin(Paint.Join.ROUND);
paint.setStrokeCap(Paint.Cap.ROUND);
}
#Override
protected void onDraw(Canvas canvas) {
if(cc)
{
Bitmap back = BitmapFactory.decodeResource(getResources(), R.drawable.black_square);
Bitmap cb = Bitmap.createScaledBitmap(back, 0, 0, false);
canvas.drawBitmap(cb,0,0,null);
cc = false;
}
canvas.drawPath(path, paint);
}
public void clearCanvas()
{
cc =true;
invalidate();
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float eventX = event.getX();
float eventY = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
path.moveTo(eventX, eventY);
return true;
case MotionEvent.ACTION_MOVE:
path.lineTo(eventX, eventY);
break;
case MotionEvent.ACTION_UP:
// nothing to do
break;
default:
return false;
}
// Schedules a repaint.
invalidate();
return true;
}
}
The above file is my SingleTouchEventView.Java
Here is my MainActivity.java
public class MainActivity extends Activity {
Button reset;;
LinearLayout canvasAlphabets;
SingleTouchEventView myView;
#Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.main_activity);
reset = (Button)findViewById(R.id.reset_canvas);
myView = new SingleTouchEventView(this, null);
canvasAlphabets = (LinearLayout)findViewById(R.id.canvas_Alphabets);
canvasAlphabets.addView(myView);
reset.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
}
});
}
}
My question is what code should I use in reset button to delete all contents of canvas.
Please help me
I have tried implementing myView.clearCanvas() but that doesn't help. If I add this code to reset buutons on Click it causes FC
Thanks
path = new Path();
Paint clearPaint = new Paint();
clearPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
canvas.drawRect(0, 0, 0, 0, clearPaint);
cc = false;
I got it fixed with above code
Maybe I do not understand what you want to draw, but have you tried this:
protected void onDraw(Canvas canvas)
{
if (cc)
{
Bitmap back = BitmapFactory.decodeResource(getResources(), R.drawable.black_square);
Bitmap cb = Bitmap.createScaledBitmap(back, 0, 0, false);
canvas.drawBitmap(cb,0,0,null);
cc = false;
}
else
canvas.drawPath(path, paint);
}
}
Otherwise, if you want to erase all, you can use this new paint:
Paint transparent = new Paint();
transparent.setAlpha(0);
You can panit everything with a transparent color, to clear everything.
I'm drawing some graphics and i would like to add a couple of buttons to it. But with the surface view how do we add these buttons programatically ?
Enclose your surfaceView with a FrameLayout in your xml Layout. Then add your buttons to the same FrameLayout. Make sure they are placed below the surface view so they get drawn on top of it. (Might be a good idea to bundle them in another Layout and add that to the FrameLayout.)
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<SurfaceView android:id="#+id/surfaceView1" android:layout_width="wrap_content" android:layout_height="wrap_content"></SurfaceView>
<LinearLayout android:id="#+id/linearLayout1" android:layout_width="wrap_content" android:layout_height="wrap_content">
<Button android:text="Button" android:id="#+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<Button android:text="Button" android:id="#+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
</LinearLayout>
</FrameLayout>
Thank you so much Androidica..
Your xml has helped me to figure out the following solution programatically without using any xml..
public class LudoActivity extends Activity implements OnClickListener {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
FrameLayout game = new FrameLayout(this);
GameView gameView = new GameView (this);
LinearLayout gameWidgets = new LinearLayout (this);
Button endGameButton = new Button(this);
TextView myText = new TextView(this);
endGameButton.setWidth(300);
endGameButton.setText("Start Game");
myText.setText("rIZ..i");
gameWidgets.addView(myText);
gameWidgets.addView(endGameButton);
game.addView(gameView);
game.addView(gameWidgets);
setContentView(game);
endGameButton.setOnClickListener(this);
}
public void onClick(View v) {
Intent intent = new Intent(this, LudoActivity.class);
startActivity(intent);
// re-starts this activity from game-view. add this.finish(); to remove from stack
}
}
while GameView is;
public class GameView extends SurfaceView {
public GameView(Context context) {
super(context);
/*
* your code
*/
}
}
Make your own button:
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.RectF;
public class GButton
{
public Matrix btn_matrix = new Matrix();
public RectF btn_rect;
float width;
float height;
Bitmap bg;
public GButton(float width, float height, Bitmap bg)
{
this.width = width;
this.height = height;
this.bg = bg;
btn_rect = new RectF(0, 0, width, height);
}
public void setPosition(float x, float y)
{
btn_matrix.setTranslate(x, y);
btn_matrix.mapRect(btn_rect);
}
public void draw(Canvas canvas)
{
canvas.drawBitmap(bg, btn_matrix, null);
}
}
on touch event:
float x = ev.getX();
float y = ev.getY();
if (my_button.btn_rect.contains(x, y))
{
// handle on touch here
}
alternatively, even better, if you want to also rotate the button it will not be axis-aligned, then use the invert matrix, instead of mapRect map the touch points x,y:
float pts[] = {x, y};
my_button.invert_matrix.mapPoints(pts);
if (my_button.btn_rect.contains(pts[0], pts[1])
{
// handle on touch here
}
We can use frame layout for surface view drawing very easily .
like this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="fill_parent"
android:layout_height="430dp"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="50dp"
android:gravity="center_horizontal"
android:layout_gravity="bottom"
android:background="#c2300f">
<Button
android:id="#+id/buttonColor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Color" />
</LinearLayout>
</LinearLayout>
And Main activity is
package com.example.surfacetuto;
import android.app.Activity;
import android.graphics.Paint;
import android.graphics.Point;
import android.os.Bundle;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends Activity implements OnClickListener{
DrawingSurface ds;
FrameLayout frm;
Button btnC;
int color=0xfff00000;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
ds=new DrawingSurface(this);
setContentView(R.layout.activity_main);
frm=(FrameLayout)findViewById(R.id.frameLayout);
frm.addView(ds);
btnC=(Button)findViewById(R.id.buttonColor);
btnC.setOnClickListener(this);
}
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()) {
case R.id.buttonColor:
Toast.makeText(getApplicationContext(), "Color", 2).show();
ds.colorNew();
break;
default:
break;
}
}
}
And Drawing Surface class is
package com.example.surfacetuto;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Paint.Cap;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Toast;
public class DrawingSurface extends SurfaceView implements SurfaceHolder.Callback {
Canvas cacheCanvas;
Bitmap backBuffer;
int width, height, clientHeight;
Paint paint;
Context context;
SurfaceHolder mHolder;
public DrawingSurface(Context context) {
super(context);
this.context = context;
init();
}
public DrawingSurface(Context context, AttributeSet attrs) {
super(context, attrs);
this.context = context;
init();
}
private void init() {
mHolder = getHolder();
mHolder.addCallback(this);
}
int lastX, lastY, currX, currY;
boolean isDeleting;
#Override
public boolean onTouchEvent(MotionEvent event) {
super.onTouchEvent(event);
int action = event.getAction();
switch(action & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
lastX = (int) event.getX();
lastY = (int) event.getY();
break;
case MotionEvent.ACTION_MOVE:
if(isDeleting) break;
currX = (int) event.getX();
currY = (int) event.getY();
cacheCanvas.drawLine(lastX, lastY, currX, currY, paint);
lastX = currX;
lastY = currY;
break;
case MotionEvent.ACTION_UP:
if(isDeleting) isDeleting = false;
break;
case MotionEvent.ACTION_POINTER_DOWN:
cacheCanvas.drawColor(Color.WHITE);
isDeleting = true;
break;
case MotionEvent.ACTION_POINTER_UP:
break;
}
draw();
return true;
}
protected void draw() {
if(clientHeight==0) {
clientHeight = getClientHeight();
height = clientHeight;
backBuffer = Bitmap.createBitmap( width, height, Bitmap.Config.ARGB_8888);
cacheCanvas.setBitmap(backBuffer);
cacheCanvas.drawColor(Color.WHITE);
}
Canvas canvas = null;
try{
canvas = mHolder.lockCanvas(null);
canvas.drawBitmap(backBuffer, 0,0, paint);
}catch(Exception ex){
ex.printStackTrace();
}finally{
if(mHolder!=null) mHolder.unlockCanvasAndPost(canvas);
}
}
private int getClientHeight() {
Rect rect= new Rect();
Window window = ((Activity)context).getWindow();
window.getDecorView().getWindowVisibleDisplayFrame(rect);
int statusBarHeight= rect.top;
int contentViewTop= window.findViewById(Window.ID_ANDROID_CONTENT).getTop();
int titleBarHeight= contentViewTop - statusBarHeight;
return ((Activity)context).getWindowManager().getDefaultDisplay().
getHeight() - statusBarHeight - titleBarHeight;
}
public void surfaceChanged(SurfaceHolder holder, int format, int width,
int height) {
}
public void surfaceCreated(SurfaceHolder holder) {
width = getWidth();
height = getHeight();
cacheCanvas = new Canvas();
backBuffer = Bitmap.createBitmap( width, height, Bitmap.Config.ARGB_8888);
cacheCanvas.setBitmap(backBuffer);
cacheCanvas.drawColor(Color.WHITE);
paint = new Paint();
paint.setColor(Color.BLUE);
paint.setStrokeWidth(10);
paint.setStrokeCap(Paint.Cap.ROUND);
paint.setStrokeJoin(Paint.Join.ROUND);
draw();
}
public void surfaceDestroyed(SurfaceHolder holder) {
boolean retry = true;
thread.setRunning(false);
while (retry) {
try {
thread.join();
retry = false;
} catch (InterruptedException e) {
// we will try it again and again...
}
}
}
public void colorNew() {
// TODO Auto-generated method stub
paint.setColor(Color.GRAY);
}
}