Develop Reference

Why isn't my graphic overlay appearing on input image?

My application using CameraX and Google ML Kit written in Java. The purpose of the application is to detect objects with a real time camera preview. I implemented ML Kit using this guide aptly titled "Detect and track objects with ML Kit on Android" (base model option) to detect objects in successive frames within the application. Despite creating a graphic overlay to draw a bounding box, I'm confused as to why it is not appearing on my user interface upon launching the application onto my device. Here is the code;
MainActivity.java
public class MainActivity extends AppCompatActivity {
AlertDialog alertDialog;
private ListenableFuture<ProcessCameraProvider> cameraProviderFuture;
private class YourAnalyzer implements ImageAnalysis.Analyzer {
#Override
#ExperimentalGetImage
#SuppressLint("UnsafeExperimentalUsageError")
public void analyze(ImageProxy imageProxy) {
Image mediaImage = imageProxy.getImage();
if (mediaImage != null) {
//Log.d("TAG", "mediaImage is throwing null");
InputImage image =
InputImage.fromMediaImage(mediaImage, imageProxy.getImageInfo().getRotationDegrees());
//Pass image to an ML Kit Vision API
//...
ObjectDetectorOptions options =
new ObjectDetectorOptions.Builder()
.setDetectorMode(ObjectDetectorOptions.STREAM_MODE)
.enableClassification() // Optional
.build();
ObjectDetector objectDetector = ObjectDetection.getClient(options);
objectDetector.process(image)
.addOnSuccessListener(detectedObjects -> {
getObjectResults(detectedObjects);
Log.d("TAG", "onSuccess" + detectedObjects.size());
for (DetectedObject detectedObject : detectedObjects) {
Rect boundingBox = detectedObject.getBoundingBox();
Integer trackingId = detectedObject.getTrackingId();
for (DetectedObject.Label label : detectedObject.getLabels()) {
String text = label.getText();
int index = label.getIndex();
float confidence = label.getConfidence();
}
}
})
.addOnFailureListener(e -> Log.e("TAG", e.getLocalizedMessage()))
.addOnCompleteListener(result -> imageProxy.close());
}
}
}
private void getObjectResults(List<DetectedObject> detectedObjects) {
int count=0;
for (DetectedObject object:detectedObjects)
{
Rect rect = object.getBoundingBox();
String text = "Undefined";
DrawGraphic drawGraphic = new DrawGraphic(this, rect, text);
count = count+1;
}
alertDialog.dismiss();
}
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
cameraProviderFuture = ProcessCameraProvider.getInstance(this);
PreviewView previewView = findViewById(R.id.previewView);
alertDialog = new SpotsDialog.Builder()
.setContext(this)
.setMessage("Currently processing...")
.setCancelable(false)
.build();
cameraProviderFuture.addListener(() -> {
try {
ProcessCameraProvider cameraProvider = cameraProviderFuture.get();
bindPreview(cameraProvider);
} catch (ExecutionException | InterruptedException e) {
// No errors need to be handled for this Future.
// This should never be reached.
}
}, ContextCompat.getMainExecutor(this));
}
void bindPreview(#NonNull ProcessCameraProvider cameraProvider) {
PreviewView previewView = findViewById(R.id.previewView);
Preview preview = new Preview.Builder()
.build();
CameraSelector cameraSelector = new CameraSelector.Builder()
.requireLensFacing(CameraSelector.LENS_FACING_BACK)
.build();
preview.setSurfaceProvider(previewView.getSurfaceProvider());
ImageAnalysis imageAnalysis =
new ImageAnalysis.Builder()
.setTargetResolution(new Size(1280,720))
.setBackpressureStrategy(ImageAnalysis.STRATEGY_KEEP_ONLY_LATEST)
.build();
imageAnalysis.setAnalyzer(ContextCompat.getMainExecutor(this), new YourAnalyzer());
Camera camera = cameraProvider.bindToLifecycle((LifecycleOwner)this, cameraSelector, preview, imageAnalysis);
}
}
DrawGraphic.java
public class DrawGraphic extends View {
Paint borderPaint, textPaint;
Rect rect;
String text;
public DrawGraphic(Context context, Rect rect, String text) {
super(context);
this.rect = rect;
this.text = text;
borderPaint = new Paint();
borderPaint.setColor(Color.WHITE);
borderPaint.setStrokeWidth(10f);
borderPaint.setStyle(Paint.Style.STROKE);
textPaint = new Paint();
textPaint.setColor(Color.WHITE);
textPaint.setStrokeWidth(50f);
textPaint.setTextSize(32f);
textPaint.setStyle(Paint.Style.FILL);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawText(text, rect.centerX(), rect.centerY(), textPaint);
canvas.drawRect(rect.left, rect.top, rect.right, rect.bottom, borderPaint);
}
}
The end objective of my code is that I want objects to be detected in real time like so;
Any information needed to supplement this question will be provided upon request.

I was able to resolve this issue by enabling viewBinding with the help of this Android documentation because it allows one to more easily write code that interacts with views. I made changes in my Gradle file like so;
android {
buildFeatures {
viewBinding true
}
}
Then, I added these changes to my activity_main.xml;
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<FrameLayout
android:id="#+id/parentlayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.camera.view.PreviewView
android:id="#+id/previewView"
android:layout_height="match_parent"
android:layout_width="match_parent"/>
</FrameLayout>
</RelativeLayout>
I then turned my attention to MainActivity.java, declaring ActivityMainBinding binding; as an attribute within the class, and then reformatting the following method using this Github user's result processing method as a reference like so;
private void getObjectResults(List<DetectedObject> detectedObjects) {
for (DetectedObject object : detectedObjects) {
if (binding.parentlayout.getChildCount() > 1) {
binding.parentlayout.removeViewAt(1);
}
Rect rect = object.getBoundingBox();
String text = "Undefined";
if (object.getLabels().size() != 0) {
text = object.getLabels().get(0).getText();
}
DrawGraphic drawGraphic = new DrawGraphic(this, rect, text);
binding.parentlayout.addView(drawGraphic);
}
/*alertDialog.dismiss();*/
}

With the bounding box and the label returned by the MLKit api, you will need to draw the overlay in your application in order for the UI to show up. You can use this mlkit vision_quickstart graphic as a reference.

How can I fingerpaint with touch over an image loaded by picasso

I am creating an app that pulls images from urls and puts them into a recyclerview. The user can then access those images and view it fullscreen. This is achieved with Picasso. I would now like the ability to fingerpaint over the image loaded with Picasso with an onTouchEvent or something but not sure how to do it.
This class sets the image to a map_edit_gallery.xml loaded with Picasso:
public class EditMapImage extends AppCompatActivity {
#Override
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.map_edit_gallery);
checkIntent();
//Find savebutton
ImageButton saveMapButton = findViewById(R.id.saveEditImagebutton);
saveMapButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(),"Saved",Toast.LENGTH_SHORT).show();
}
});
}
//This will check to see if the intent extras exist and if they do get the extra
private void checkIntent(){
if(getIntent().hasExtra("image_url") && getIntent().hasExtra("name_url")){
String imageUrl = getIntent().getStringExtra("image_url");
String nameUrl = getIntent().getStringExtra("name_url");
setMapImage(imageUrl, nameUrl);
}
}
private void setMapImage(String imageUrl, String nameUrl){
//Set the Text view
TextView name = findViewById(R.id.mapNameEditor);
name.setText(nameUrl);
//Set the Image
ImageView imageView = findViewById(R.id.mapEditScreen);
Picasso.get().load(imageUrl).into(imageView);
Picasso picasso = Picasso.get();
DrawToImage myTransformation = new DrawToImage();
picasso.load(imageUrl).transform(myTransformation).into(imageView);
}
}
EDIT:
This class has allowed me to draw over the loaded image using canvas but cannot figure out how to use touch to draw:
public class DrawToImage implements Transformation {
#Override
public String key() {
// TODO Auto-generated method stub
return "drawline";
}
public Bitmap transform(Bitmap bitmap) {
// TODO Auto-generated method stub
synchronized (DrawToImage.class) {
if(bitmap == null) {
return null;
}
Bitmap resultBitmap = bitmap.copy(bitmap.getConfig(), true);
Canvas canvas = new Canvas(resultBitmap);
Paint paint = new Paint();
paint.setColor(Color.BLUE);
paint.setStrokeWidth(10);
canvas.drawLine(0, resultBitmap.getHeight()/2, resultBitmap.getWidth(), resultBitmap.getHeight()/2, paint);
bitmap.recycle();
return resultBitmap;
}
}
}

Try using the image selected by the user to set it in a canvas object and draw on the canvas object itself, as opposed to the image. There are plenty of tutorials out there to help you with how to draw on a canvas.
This process isn't connected with the Picasso Image Library in any way so I would recommend first getting the image through Picasso, then sending the image into your custom canvas implementation, then returning a bitmap/drawable which you could set into Picasso after editing.
There's also plenty of tutorials on how to export an image from the canvas to get your edited image when you need it.
I hope this helped, Panos.

Unexpected Crash When trying to open the detailactivity

I am facing a strange problem in my material design app . Some thumbnails are opening and loading details activity as expected , but some are not opening instead there is crash happening . in this video u can see the problem I am facing .
I am attaching the link to my project ZIP file link with this ,My Project
this is the main activity ....
public class MainActivity extends AppCompatActivity implements ReaderAdapter.ReaderOnClickItemHandler {
public final static String READER_DATA = "reader";
public final static String POSITION = "position";
private final static String TAG = MainActivity.class.getSimpleName();
private static final String SAVED_ARRAYLIST = "saved_array_list";
private static final String SAVED_LAYOUT_MANAGER = "layout-manager-state";
private ApiInterface mApiInterface;
private List<Reader> mNetworkDataList;
#BindView(R.id.main_recycler_view)
RecyclerView mRecyclerView;
#BindView(R.id.main_linear_layout)
LinearLayout mErrorLinearLayout;
#BindView(R.id.main_progress_bar)
ProgressBar mProgressBar;
#BindView(R.id.toolbar_main)
Toolbar toolbar;
#BindView(R.id.main_reload_button)
Button mButton;
private ReaderAdapter mReaderAdapter;
private Parcelable onSavedInstanceState = null;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
if (null != toolbar) {
setSupportActionBar(toolbar);
toolbar.setTitle(getResources().getString(R.string.app_name));
}
mApiInterface = ApiClient.getApiClient().create(ApiInterface.class);
mReaderAdapter = new ReaderAdapter(this, this);
LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this,
LinearLayoutManager.VERTICAL, false);
mRecyclerView.setAdapter(mReaderAdapter);
mRecyclerView.setLayoutManager(linearLayoutManager);
// getting the data from api using retrofit interface ApiInterface
if (savedInstanceState != null) {
onSavedInstanceState = savedInstanceState.getParcelable(SAVED_LAYOUT_MANAGER);
mNetworkDataList = savedInstanceState.getParcelableArrayList(SAVED_ARRAYLIST);
}
if (null == mNetworkDataList) {
loadData();
mButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
loadData();
}
});
}else {
loadAdapter();
}
}
public void loadData() {
final Call<List<Reader>> listCall = mApiInterface.getAllReaderData();
// now binding the data in the pojo class
listCall.enqueue(new Callback<List<Reader>>() {
//if data is successfully binded from json to the pojo class onResponse is called
#Override
public void onResponse(Call<List<Reader>> call,
Response<List<Reader>> response) {
Log.d(TAG, "Response : " + response.code());
mNetworkDataList = response.body();
loadAdapter();
}
//if data binding is not successful onFailed called
#Override
public void onFailure(Call<List<Reader>> call, Throwable t) {
//cancelling the GET data request
listCall.cancel();
showError();
}
});
}
private void loadAdapter() {
if (null != mNetworkDataList) {
showReaderList();
mReaderAdapter.ifDataChanged(mNetworkDataList);
if (onSavedInstanceState != null) {
mRecyclerView.getLayoutManager().onRestoreInstanceState(onSavedInstanceState);
}
}
}
/**
* this method is for showing the error textview and making all other views gone
*/
private void showError() {
mRecyclerView.setVisibility(View.GONE);
mProgressBar.setVisibility(View.GONE);
mErrorLinearLayout.setVisibility(View.VISIBLE);
}
/**
* this method is for showing the recyclerview and making all other views gone
*/
private void showReaderList() {
mRecyclerView.setVisibility(View.VISIBLE);
mProgressBar.setVisibility(View.GONE);
mErrorLinearLayout.setVisibility(View.GONE);
}
private int numberOfColumns() {
DisplayMetrics displayMetrics = new DisplayMetrics();
this.getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
// You can change this divider to adjust the size of the poster
int widthDivider = 400;
int width = displayMetrics.widthPixels;
int nColumns = width / widthDivider;
if (nColumns < 2) return 2;
return nColumns;
}
#Override
public void onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
outState.putParcelable(SAVED_LAYOUT_MANAGER, mRecyclerView.getLayoutManager()
.onSaveInstanceState());
if (mNetworkDataList != null)
outState.putParcelableArrayList(SAVED_ARRAYLIST, new ArrayList<Parcelable>(mNetworkDataList));
}
#Override
public void onClickItem(int position, Reader reader, ImageView mImage, TextView mTitle) {
// Check if we're running on Android 5.0 or higher
Intent readerIntent = new Intent(this, ReaderDetailsActivity.class);
Bundle mBundle = new Bundle();
mBundle.putParcelable(READER_DATA, reader);
mBundle.putInt(POSITION, position);
readerIntent.putExtras(mBundle);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
// Apply activity transition
ActivityOptionsCompat activityOptions = ActivityOptionsCompat.makeSceneTransitionAnimation(
this,
// Now we provide a list of Pair items which contain the view we can transitioning
// from, and the name of the view it is transitioning to, in the launched activity
new Pair<View, String>(mImage,
ReaderDetailsActivity.VIEW_NAME_HEADER_IMAGE),
new Pair<View, String>(mTitle,
ReaderDetailsActivity.VIEW_NAME_HEADER_TITLE));
ActivityCompat.startActivity(this, readerIntent, activityOptions.toBundle());
} else {
// Swap without transition
startActivity(readerIntent);
}
}
}
this is details activity ......
public class ReaderDetailsActivity extends AppCompatActivity {
private static final String TAG = ReaderDetailsActivity.class.getSimpleName();
private static final String SAVED_ARRAYLIST = "saved_array_list";
private static final String SAVED_LAYOUT_MANAGER = "layout-manager-state";
private final static String ARTICLE_SCROLL_POSITION = "article_scroll_position";
// View name of the header image. Used for activity scene transitions
public static final String VIEW_NAME_HEADER_IMAGE = "detail:header:image";
// View name of the header title. Used for activity scene transitions
public static final String VIEW_NAME_HEADER_TITLE = "detail:header:title";
private int position;
private Reader reader;
private int[] scrollPosition = null;
#BindView(R.id.scrollView_details)
ScrollView mScrollView;
#BindView(R.id.details_fragment_title)
TextView mTitle;
#BindView(R.id.imageView_details)
ImageView mImageView;
#BindView(R.id.textView_author_details)
TextView mAuthor;
#BindView(R.id.textView_published_date)
TextView mPublishDate;
#BindView(R.id.textView_description)
TextView mDescription;
#BindView(R.id.floatingActionButton_Up)
FloatingActionButton mFloatingActionButton;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_reader_details);
ButterKnife.bind(this);
Bundle bundle = getIntent().getExtras();
position=0;
mFloatingActionButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
mScrollView.scrollTo(0,0);
}
});
ViewCompat.setTransitionName(mImageView, VIEW_NAME_HEADER_IMAGE);
ViewCompat.setTransitionName(mTitle, VIEW_NAME_HEADER_TITLE);
if (null != bundle) {
position = bundle.getInt(MainActivity.POSITION);
reader = bundle.getParcelable(MainActivity.READER_DATA);
if(null != reader) {
mTitle.setText(reader.getTitle());
mPublishDate.setText(reader.getPublishedDate());
mAuthor.setText(reader.getAuthor());
GlideApp.with(this)
.load(reader.getPhoto())
.into(mImageView);
mDescription.setText(reader.getBody());
}
}
}
#Override
public void onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
}
#Override
protected void onRestoreInstanceState(Bundle savedInstanceState) {
super.onRestoreInstanceState(savedInstanceState);
scrollPosition = savedInstanceState.getIntArray(ARTICLE_SCROLL_POSITION);
if (scrollPosition != null) {
mScrollView.postDelayed(new Runnable() {
public void run() {
mScrollView.scrollTo(scrollPosition[0], scrollPosition[0]);
}
}, 0);
}
}
}
Json link I am parsing for this project .
Here is a screen recording of my project where u can see the problem I am facing , recording
this is a console log when I am trying to debug ....
when it is working fine the console log is 08/09 20:31:31: Launching app
No apk changes detected since last installation, skipping installation of /home/soumyajit/AndroidStudioProjects/MaterialReader/app/build/outputs/apk/debug/app-debug.apk
$ adb shell am force-stop lordsomen.android.com.materialreader
$ adb shell am start -n "lordsomen.android.com.materialreader/lordsomen.android.com.materialreader.activities.MainActivity" -a android.intent.action.MAIN -c android.intent.category.LAUNCHER -D
Connecting to lordsomen.android.com.materialreader
Connected to the target VM, address: 'localhost:8601', transport: 'socket'
and when it is crashing the console log is
08/09 20:31:31: Launching app
No apk changes detected since last installation, skipping installation of /home/soumyajit/AndroidStudioProjects/MaterialReader/app/build/outputs/apk/debug/app-debug.apk
$ adb shell am force-stop lordsomen.android.com.materialreader
$ adb shell am start -n "lordsomen.android.com.materialreader/lordsomen.android.com.materialreader.activities.MainActivity" -a android.intent.action.MAIN -c android.intent.category.LAUNCHER -D
Connecting to lordsomen.android.com.materialreader
Connected to the target VM, address: 'localhost:8601', transport: 'socket'
Disconnected from the target VM, address: 'localhost:8601', transport: 'socket'
thanks in advance ..

Maximum Parcelable size should not be exceed 1mb. In you app it is 2.1 Mb. Without passing app date to the next activity you can try to pass item id and load data in next activity. Otherwise you can cache the list data and you can load the data from the local database in the details activity. If you cannot see crash log in android studio it because it set as "show only selected activity". In this case app get close and then this type of logs doesnot show in the android studio. switch that to No Filter and you can see the all logs.

How to use MediaMetadataRetriever SetDataSource for file in external storage

I'm trying to extract Album art from MP3 file But I not able to give proper location of song, which I can give it to SetDataSource method. I tried everything but still it gives me error IllegalArgumentException.
It all happens when this line metaRetriver.setDataSource(MainActivity.this, Uri.parse("/sdcard/song.mp3")); gets executed
My Code.
public class MainActivity extends AppCompatActivity {
MediaMetadataRetriever metaRetriver;
byte[] art;
ImageView album_art;
Bitmap songImage;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getInit();
metaRetriver = new MediaMetadataRetriever();
metaRetriver.setDataSource(MainActivity.this, Uri.parse("/sdcard/song.mp3"));
art = metaRetriver.getEmbeddedPicture();
if (art != null) {
songImage = BitmapFactory
.decodeByteArray(art, 0, art.length);
album_art.setImageBitmap(songImage);
} else {
String error = "art is null";
Log.i("lolol", error);
}
}
public void getInit() {
album_art = (ImageView) findViewById(R.id.album_art);
}
}
Can anyone solve this problem.

From the Android Documentation:
Throws IllegalArgumentException if the Uri is invalid
Double check that the song.mp3 file is in the right place, and the app has permission to see it.

Code throws unsatisfiedLinkError

This is an Android app to convert an RGB image to grayscale and display it on a screen. According to logcat, I am getting an unsatisfiedLinkError from
Mat ImageMat = new Mat (image.getHeight(), image.getWidth(), CvType.CV_8U, new Scalar(4));
What is wrong?
public class ImwriteActivity extends Activity /*implements OnClickListener*/{
#Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_imwrite);
ImageView img = (ImageView) findViewById(R.id.imageView1);
//get image from sdcard
File f = new File(Environment.getExternalStorageDirectory().getPath()+"/Test.jpg");
Bitmap image = BitmapFactory.decodeFile(f.getAbsolutePath());
//convert Bitmap to Mat
Mat ImageMat = new Mat (image.getHeight(), image.getWidth(), CvType.CV_8U, new Scalar(4));
Bitmap myBitmap32 = image.copy(Bitmap.Config.ARGB_8888, true);
Utils.bitmapToMat(myBitmap32, ImageMat);
//change the color
Imgproc.cvtColor(ImageMat, ImageMat, Imgproc.COLOR_RGB2GRAY,4);
//convert the processed Mat to Bitmap
Bitmap resultBitmap = Bitmap.createBitmap(ImageMat.cols(), ImageMat.rows(),Bitmap.Config.ARGB_8888);;
Utils.matToBitmap(ImageMat, resultBitmap);
//Set member to the Result Bitmap. This member is displayed in an ImageView
img.setImageBitmap(resultBitmap);
}
}

onCreate is the wrong place to put your opencv code, since it depends on native, c++ code.
first you need to load the opencv so's:
private BaseLoaderCallback mLoaderCallback = new BaseLoaderCallback(this) {
#Override
public void onManagerConnected(int status) {
if (status == LoaderCallbackInterface.SUCCESS ) {
// now we can call opencv code !
} else {
super.onManagerConnected(status);
}
}
};
#Override
public void onResume() {;
super.onResume();
OpenCVLoader.initAsync(OpenCVLoader.OPENCV_VERSION_2_4_5,this, mLoaderCallback);
// you may be tempted, to do something here, but it's *async*, and may take some time,
// so any opencv call here will lead to unresolved native errors.
}
#Override
public void onCameraViewStarted(int width, int height) {
// probably the best place for your opencv code
}