Refresh an imageview in android with an image I got on background - android

My question concerns this thread-
How to refresh imageview in android
Im too trying to get an image via socket, decode it, and setting it on an imageview.
The socket need to stay open in case another image will be sent and then ill update the imageview again.
I didnt got the part when in the other thread they response not to do it in the main thread.
From the main activity I should open a new thread which will be 'stuck' on "while (true)"
so it can keep listening to up coming images, and when ever a full image had sent, it needs to update the imageview.
But the imageview is in the main thread (main thread equals UI thread?) so its starting to be a bit problematic for me...
Any one?
// ADDED -
this is the asyncTask I had -
public class AsyncTask extends AsyncTask<Void, Void, Void> {
private DataInputStream dataInputStream = null;
private ImageView iv = null;
public RobotMapAsyncTask(DataInputStream dataStream, ImageView imageView) {
dataInputStream = dataStream;
iv = imageView;
}
#Override
protected Void doInBackground(Void... params) {
ByteArrayOutputStream buffer = new ByteArrayOutputStream();
byte[] byteChunk = new byte[1024];
Bitmap bitmap = null;
int c;
if (dataInputStream != null) {
while (true) {
try {
byteChunk = new byte[1024];
while ((c = dataInputStream.read(byteChunk)) != -1){
buffer.write(byteChunk, 0, c);
}
} catch (IOException e) {
e.printStackTrace();
}
bitmap = BitmapFactory.decodeByteArray(byteChunk, 0, byteChunk.length);
if (bitmap != null) {
//runOnUiThread(new Runnable() {
//public void run() {
//iv.setImageBitmap(bitmap);
//}
// });
}
}
}
return null;
}
but then I obvious cant call runOnUiThread because this is not an activity...

After you get a new image, call this:
runOnUiThread(new Runnable() {
public void run() {
imView.setBackgroundResource(yourResource);
}
});
Just make the obvious changes to fit your code

Change the image of your ImageView in a Runnable launched by Activity.runOnUIThread(Runnable) or Handler.post(Runnable)

You can do this in two ways:
a) one way is invoke a worker thread using handler and runnable from main thread which does the fetching and decoding of images. Once you have the decoded image, just set the imageview from your worker thread
b) Alternatively, you can use the async task feature of android to fetch images and update the imageview on main thread

Related

Reading data from USB host every 200ms in android app

My USB Host is receiving sensor data and it is getting updated every 200ms. I would like to read this data in my android app every 200ms. I am able to read it using bufferreader, It reads the data for sometime and then hangs. It is not consistent. I am new to this and may be I am not doing it the correct way. Below please find my code and let me know your suggestions. Thanks in advance.
public void startProcessOne()
{
new CountDownTimer(110,100)
{
#Override
public void onTick(long millisUntilFinished)
{
StringBuilder text = new StringBuilder();
line = "";
try {
FileReader in = new FileReader("/mnt/udisk/TEST.TXT");
BufferedReader br = new BufferedReader(in);
int i=0;
char[] buf = new char[10000];
while((i = br.read(buf,i,100))!= -1)
{
String h = new String(buf);
text.append(h);
text.append('\n');
}
br.close();
}
catch (IOException e) {
//You'll need to add proper error handling here
}
TxtRead.setText(text.toString());
}
#Override
public void onFinish()
{
startProcessOne();
}
}.start();
}
TxtRead.setText(text.toString());
This line is causing the problem. You can't touch UI elements from a background thread. You should instead run those codes in the UI/Main thread.
In your case, I'd personally prefer using Java threads. So, create a background thread to keep running periodically. If you would need to run UI methods from that background thread. You probably need a handler attached to the main thread.
// Instantiate a handler in UI thread
final Handler handler = new Handler();
new Thread(new Runnable(){
// Once you're done and want to break the loop, just set this boolean
private boolean stopped = false;
#Override
public void run(){
while(!stopped) {
// Read from the file
// Whenever you need to update an UI element,
// you should wrap it inside this runnable object
handler.post(new Runnable(){
#Override
public void run(){
// Update UI
TxtRead.setText("new_text");
}
})
try {
// This thread will sleep for 9 seconds
Thread.Sleep(9000);
} catch(Exception e){}
}
}
}).start();

ListView scroll bugging while images downloading via AsynkTask

I want to show a listview with some texts and images. When i'm creating a view for listview, i'm calling method show of my PictureImageView, that downloads and showing image. Download is running in new thread in AsyncTask. But while image downloading i can't normally scroll listview, it's twitches.
To run AsyncTask in new thread i call executeOnExecutor method. I tried to call execute method, but then scroll stops at all till download is over.
Here my class.
public class PictureImageView extends LinearLayout {
private Drawable image_drawable = null;
private ImageView image = null;
...
protected String getImageURL() {
...
return uri;
}
public void show() {
if (image_drawable != null) {
image.setImageDrawable(image_drawable);
addView(image);
} else {
// target Android API >= 14 so executeOnExecutor works in another thread
new RequestTask().executeOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR, getImageURL());
}
}
protected void onResponse(Drawable image) {
if (image != null) {
image_drawable = image;
show();
}
}
class RequestTask extends AsyncTask<String, String, Drawable> {
#Override
protected Drawable doInBackground(String... urls) {
Drawable image = null;
HttpURLConnection connection = null;
InputStream connection_stream = null;
try {
URL url = new URL(urls[0]);
connection = (HttpURLConnection) url.openConnection();
connection.setRequestMethod("GET");
connection.setUseCaches(true);
connection.connect();
int response_code = connection.getResponseCode();
//#see http://libs-for-android.googlecode.com/svn/reference/com/google/android/filecache/FileResponseCache.html
if (response_code == HttpURLConnection.HTTP_OK || response_code == -1) {
connection_stream = connection.getInputStream();
image = Drawable.createFromStream(connection_stream, null);
}
} catch (MalformedURLException e) {
} catch (IOException e) {
} finally {
if (connection != null) {
connection.disconnect();
}
if (connection_stream != null) {
try {
connection_stream.close();
} catch (IOException e) {
}
}
}
return image;
}
#Override
protected void onPostExecute(Drawable image) {
PictureImageView.this.onResponse(image);
}
}
}
How can i fix it? I guess, the problem is that there is no any another thread, but how to check it?
I've delt with this exact problem first hand. The twitching comes from updating the ListView each time a picture is downloaded. There are 2 different approaches I took to fix this. Depending on your project set up one my work
Approach 1: Minimize twitching by only updating once
In my case I used an AsyncTask as a seperate class with a call back to the starting activity. What I did was use a singleThreadExecutor so that the task to download each user's picture were serialy executed and a counter to track how many treads were started/left - increamenting each time I added one to the executor, decrementing each time the call back was called. For example
#Override
public void userPic(Bitmap pic){
if(pic != null){
//use picture
}
taskCounter--
if(taskCounter == 0){
updateUserListView();
}
}
By updating once all threads were done I was able to minimize the twitching by only refreshing the list once, thus allowing scroll and jumping back to the top only once all picutres were done
Approach 2: eliminate twitch by using mem cache
Eventually what I ened up doing was using a cache to store bitmaps. This approach completely eliminated the jumping issue beacuse the list was no longer being refreshed, rather the adapter was loading bitmaps from the cache only when views were recycled. I still used a seperate task with a call back
#Override
public void userPic(Bitmap pic){
if(pic != null){
memCache.addPicture(pic);
}
}
only this time rather than update the list directly, if a picture was downloaded I stored it to the cache. Then in my adapter code, I set the picutre field to update from cache if present
if(picture_view != null){
if(memCache.contains(u.getId()){
picture_view.setImageBitmap(memCache.getPicture(u.getId()));
} else {
picture_view.setImageBitmap(memCache.getPicture("default"));
}
this approach takes advatage of the fact that views are updated in a ListView automaticaly once they are recycled. As you scroll and the views are rebuilt, the adapter will automatically populate the fields with new data if it has changed.
Downsides - the list does not auto upate. If pictures are downloaded for fields that are currently visible, they will not be updated until you scroll away from that view. Also, slightly more set up in creating a cache. I chose to use a singelton pattern to do this since I was accessing the cache from multiple places (e.g. adding pictures in one place and getting in another).

BitmapFactory.Options.inBitmap causes tearing when switching ImageView bitmap often

I've encountered a situation where I have to display images in a slideshow that switches image very fast. The sheer number of images makes me want to store the JPEG data in memory and decode them when I want to display them. To ease on the Garbage Collector, I'm using BitmapFactory.Options.inBitmap to reuse bitmaps.
Unfortunately, this causes rather severe tearing, I've tried different solutions such as synchronization, semaphores, alternating between 2-3 bitmaps, however, none seem to fix the problem.
I've set up an example project which demonstrates this issue over at GitHub; https://github.com/Berglund/android-tearing-example
I've got a thread which decodes the bitmap, sets it on the UI thread, and sleeps for 5 ms:
Runnable runnable = new Runnable() {
#Override
public void run() {
while(true) {
BitmapFactory.Options options = new BitmapFactory.Options();
options.inSampleSize = 1;
if(bitmap != null) {
options.inBitmap = bitmap;
}
bitmap = BitmapFactory.decodeResource(getResources(), images.get(position), options);
runOnUiThread(new Runnable() {
#Override
public void run() {
imageView.setImageBitmap(bitmap);
}
});
try {
Thread.sleep(5);
} catch (InterruptedException e) {}
position++;
if(position >= images.size())
position = 0;
}
}
};
Thread t = new Thread(runnable);
t.start();
My idea is that ImageView.setImageBitmap(Bitmap) draws the bitmap on the next vsync, however, we're probably already decoding the next bitmap when this happens, and as such, we've started modifying the bitmap pixels. Am I thinking in the right direction?
Has anyone got any tips on where to go from here?
You should use the onDraw() method of the ImageView since that method is called when the view needs to draw its content on screen.
I create a new class named MyImageView which extends the ImageView and override the onDraw() method which will trigger a callback to let the listener knows that this view has finished its drawing
public class MyImageView extends ImageView {
private OnDrawFinishedListener mDrawFinishedListener;
public MyImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (mDrawFinishedListener != null) {
mDrawFinishedListener.onOnDrawFinish();
}
}
public void setOnDrawFinishedListener(OnDrawFinishedListener listener) {
mDrawFinishedListener = listener;
}
public interface OnDrawFinishedListener {
public void onOnDrawFinish();
}
}
In the MainActivity, define 3 bitmaps: one reference to the bitmap which is being used by the ImageView to draw, one for decoding and one reference to the bitmap that is recycled for the next decoding. I reuse the synchronized block from vminorov's answer, but put in different places with explanation in the code comment
public class MainActivity extends Activity {
private Bitmap mDecodingBitmap;
private Bitmap mShowingBitmap;
private Bitmap mRecycledBitmap;
private final Object lock = new Object();
private volatile boolean ready = true;
ArrayList<Integer> images = new ArrayList<Integer>();
int position = 0;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
images.add(R.drawable.black);
images.add(R.drawable.blue);
images.add(R.drawable.green);
images.add(R.drawable.grey);
images.add(R.drawable.orange);
images.add(R.drawable.pink);
images.add(R.drawable.red);
images.add(R.drawable.white);
images.add(R.drawable.yellow);
final MyImageView imageView = (MyImageView) findViewById(R.id.image);
imageView.setOnDrawFinishedListener(new OnDrawFinishedListener() {
#Override
public void onOnDrawFinish() {
/*
* The ImageView has finished its drawing, now we can recycle
* the bitmap and use the new one for the next drawing
*/
mRecycledBitmap = mShowingBitmap;
mShowingBitmap = null;
synchronized (lock) {
ready = true;
lock.notifyAll();
}
}
});
final Button goButton = (Button) findViewById(R.id.button);
goButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Runnable runnable = new Runnable() {
#Override
public void run() {
while (true) {
BitmapFactory.Options options = new BitmapFactory.Options();
options.inSampleSize = 1;
if (mDecodingBitmap != null) {
options.inBitmap = mDecodingBitmap;
}
mDecodingBitmap = BitmapFactory.decodeResource(
getResources(), images.get(position),
options);
/*
* If you want the images display in order and none
* of them is bypassed then you should stay here and
* wait until the ImageView finishes displaying the
* last bitmap, if not, remove synchronized block.
*
* It's better if we put the lock here (after the
* decoding is done) so that the image is ready to
* pass to the ImageView when this thread resume.
*/
synchronized (lock) {
while (!ready) {
try {
lock.wait();
} catch (InterruptedException e) {
e.printStackTrace();
}
}
ready = false;
}
if (mShowingBitmap == null) {
mShowingBitmap = mDecodingBitmap;
mDecodingBitmap = mRecycledBitmap;
}
runOnUiThread(new Runnable() {
#Override
public void run() {
if (mShowingBitmap != null) {
imageView
.setImageBitmap(mShowingBitmap);
/*
* At this point, nothing has been drawn
* yet, only passing the data to the
* ImageView and trigger the view to
* invalidate
*/
}
}
});
try {
Thread.sleep(5);
} catch (InterruptedException e) {
}
position++;
if (position >= images.size())
position = 0;
}
}
};
Thread t = new Thread(runnable);
t.start();
}
});
}
}
As an alternative to your current approach, you might consider keeping the JPEG data as you are doing, but also creating a separate Bitmap for each of your images, and using the inPurgeable and inInputShareable flags. These flags allocate the backing memory for your bitmaps on a separate heap that is not directly managed by the Java garbage collector, and allow Android itself to discard the bitmap data when it has no room for it and re-decode your JPEGs on demand when required. Android has all this special-purpose code to manage bitmap data, so why not use it?
You need to do the following things in order to get rid of this problem.
Add an extra bitmap to prevent situations when ui thread draws a bitmap while another thread is modifying it.
Implement threads synchronization to prevent situations when background thread tries to decode a new bitmap, but the previous one wasn't shown by the ui thread.
I've modified your code a bit and now it works fine for me.
package com.example.TearingExample;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import java.util.ArrayList;
public class MainActivity extends Activity {
ArrayList<Integer> images = new ArrayList<Integer>();
private Bitmap[] buffers = new Bitmap[2];
private volatile Bitmap current;
private final Object lock = new Object();
private volatile boolean ready = true;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
images.add(R.drawable.black);
images.add(R.drawable.blue);
images.add(R.drawable.green);
images.add(R.drawable.grey);
images.add(R.drawable.orange);
images.add(R.drawable.pink);
images.add(R.drawable.red);
images.add(R.drawable.white);
images.add(R.drawable.yellow);
final ImageView imageView = (ImageView) findViewById(R.id.image);
final Button goButton = (Button) findViewById(R.id.button);
goButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Runnable runnable = new Runnable() {
#Override
public void run() {
int position = 0;
int index = 0;
while (true) {
try {
synchronized (lock) {
while (!ready) {
lock.wait();
}
ready = false;
}
BitmapFactory.Options options = new BitmapFactory.Options();
options.inSampleSize = 1;
options.inBitmap = buffers[index];
buffers[index] = BitmapFactory.decodeResource(getResources(), images.get(position), options);
current = buffers[index];
runOnUiThread(new Runnable() {
#Override
public void run() {
imageView.setImageBitmap(current);
synchronized (lock) {
ready = true;
lock.notifyAll();
}
}
});
position = (position + 1) % images.size();
index = (index + 1) % buffers.length;
Thread.sleep(5);
} catch (InterruptedException ignore) {
}
}
}
};
Thread t = new Thread(runnable);
t.start();
}
});
}
}
In the BM.decode(resource...
is the network involved?
If yes then u need to optimize the look-ahead connection and data transport across the net connection as well as your work optimizing bitmaps and memory.That can mean becoming adept at low latency or async transport using your connect protocol (http i guess). Make sure that you dont transport more data than you need? Bitmap decode can often discard 80% of the pixels in creating an optimized object to fill a local view.
If the data intended for the bitmaps are already local and there are not concerns about network latency then just focus on reserving a collection type DStructure(listArray) to hold the fragments that the UI will swap on the page-forward, page-back events.
If your jpegs ( pngs are lossless with bitmap ops IMO ) are around 100k each you can just use a std adapter to load them to fragments. If they are alot larger , then you will have to figure out the bitmap 'compress' option to use with the decode in order not to waste alot of memory on your fragment data structure.
if you need a theadpool in order to optimize the bitmap creation, then do that to remove any latency involved at that step.
Im not sure that it works, but if you want to get more complicated, you could look at putting a circular buffer or something underneath the listArray that collaborates with the adapter??
IMO - once you have the structure, the transaction switching among fragments as you page should be very fast. I have direct experience with about 6 pics in memory each with size around 200k and its fast at the page-fwd, page-back.
I used this app as a framework , focusing on the 'page-viewer' example.
It's related to image caching, asycTask processing, background download from net etc.
Please read this page:
http://developer.android.com/training/displaying-bitmaps/index.html
If you download and look into the sample project bitmapfun on that page, I trust it will solve all your problem. That's a perfect sample.

Android - execute thread repeatedly

I am new to Android programming and Threads. I want to get a picture from a remote Server and display it. (that works so far ^^)
But the picture is from a camera and so I need a new one as soon as I show the one I downloaded before. That means ,that the Thread should never stop grabbing the picture. (As long the Activity exists.)
Also I just want to establish 1 connection to the server and then just do HTTP-gets. So I have to have an parameter "connection" that the Thread can use.
To get an idea - it should work something like this (but obviously it does not):
private class DownloadImageTask extends AsyncTask<URLConnection, Void, Bitmap> {
/** The system calls this to perform work in a worker thread and
* delivers it the parameters given to AsyncTask.execute() */
private URLConnection connection = null;
protected Bitmap doInBackground(URLConnection...connection ) {
this.connection = connection[0];
return getImageFromServer(connection[0]);
}
protected void onPostExecute(Bitmap result) {
pic.setImageBitmap(result);
this.doInBackground(connection);
}
}
Might be better to use a Thread here since AsyncTask is for when the Task ends at some point. Something like below could work for you. Apart from that you could be better off using a local Service
protected volatile boolean keepRunning = true;
private Runnable r = new Runnable() {
public void run() {
// methods are a bit bogus but it should you give an idea.
UrlConnection c = createNewUrlConnection();
while (keepRunning) {
Bitmap result = getImageFromServer(c);
// that probably needs to be wrapped in runOnUiThread()
pic.setImageBitmap(result);
}
c.close();
}
};
private Thread t = null;
onResume() {
keepRunning = true;
t = new Thread(r);
t.start();
}
onPause() {
keepRunning = false;
t = null;
}
You should set some delay for it, but to fix this I think that it should look like this:
private class DownloadImageTask extends AsyncTask<URLConnection, Void, Bitmap> {
/** The system calls this to perform work in a worker thread and
* delivers it the parameters given to AsyncTask.execute() */
private URLConnection connection = null;
protected Bitmap doInBackground(URLConnection...connection ) {
this.connection = connection[0];
return getImageFromServer(connection[0]);
}
protected void onPostExecute(Bitmap result) {
pic.setImageBitmap(result);
this.execute("...");
}
}
Async Task can only be executed once...
The task can be executed only once (an exception will be thrown if a second execution is attempted.)
see this.. documentation on AsyncTask documentation on AsyncTask
I suggest it is better if you use a service to download...
or even a thread can be used...
like this
public void run() {
while (true) {
//get image...
}
}

Android async image load

So I have an activity with an ImageView. My goal is to have the activity start and asynchronously fetch the image I need in there. While the image is being fetched, I'd like to display some sort of spinning loading symbol in place of the image. I've tried using AsyncTask as a separate class, but ran into issues relating to modifying the views of another activity. I tried an anonymous Runnable class inside the activity, but it doesn't seem to be yielding the effects I expect. Can anyone advise?
SOLVED: Simply needed a handler in the activity
final Handler handler = new Handler() {
public void handleMessage(Message msg) {
ImageView qrCode = (ImageView)findViewById(R.id.qr);
qrCode.setImageBitmap((Bitmap)msg.obj);
}
};
new Thread(new Runnable(){
public void run() {
BitmapFactory.Options bmOptions;
bmOptions = new BitmapFactory.Options();
bmOptions.inSampleSize = 1;
int retry = 0;
Bitmap bm = null;
while(retry < 50 && bm == null){
bm = LoadImage(image_URL, bmOptions);
if(bm == null){
try {
Thread.sleep(100);
} catch (InterruptedException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
retry++;
}
Message msg = new Message();
msg.obj = bm;
handler.sendMessage(msg);
return;
}
}).start();
`
Place a progress dialog inside of the view with the imageview.
set the imageview ImageView.visibility(View.INVISIBLE);
In your preExecute() in your AsyncTask
Show the spinning dialog, and then do the fetching in the doInBackground() of the AsyncTask
In onPostExecute() show your imageview by changing the visibility and dismiss the dialog or sets its visibility to View.GONE
Android's developer guide for threading should help you out. It has AsyncTask examples that pretty much do exactly what you're asking for:
Android Threading Guide
If you don't implement the publishProgress() method, and only implement doInBackground to get the data, and onPostExecute to update the UI, then it should by default give you the spinning icon to indicate that it's loading. Keep in mind that onPostExecute runs on the main UI thread so you can't make any network calls from there
I did something similar and did according to this tutorial:
http://evancharlton.com/thoughts/lazy-loading-images-in-a-listview

Categories

Resources