Customize Image referred From Html string - java

One of my project activities including long text written in string.xml ,i add some images from resource within textview ,as after each phrase there is image then next the text phrase then image and so on ,
i getting that images from string using this code :
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TextView htmlTextView = (TextView) findViewById(R.id.day_tv);
htmlTextView.setText(Html.fromHtml(getString(R.string.day), new ImageGetter(), null));
}
private class ImageGetter implements Html.ImageGetter {
public Drawable getDrawable(String source) {
int id = 0;
if (source.equals("image1.jpg")) {
id = R.drawable.a;
} else if (source.equals("image2.jpg")) {
id = R.drawable.b;
} else if (source.equals("image3.jpg")) {
id = R.drawable.c;
} else if (source.equals("image4.jpg")) {
id = R.drawable.d;
} else if (source.equals("image5.jpg")) {
id = R.drawable.e;
}
Drawable d = getResources().getDrawable(id);
d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
return d;
}
};
}
and writing html img tag in string.xml as:
<img src="image1.jpg">
i want to be able to customize each image by changing its width and height or refer it to drawable style to add border around images for example .
i tried using the bellow code foe changing width and height :
<img src="image1.jpg" width="100" height="150">
but it doesn't work .
any advice to achieve that will be appreciated , thanks .

I finally end up to this solution which allow to change width and height for each image but still one point not achieved which is referring image to drawable shape as background ,
still work on it :
private class ImageGetter implements Html.ImageGetter {
public Drawable getDrawable(String source) {
int id,id1,id2,id3,id4 = 0;
if (source.equals("image1.jpg")) {
id = R.drawable.a;
Drawable d = getResources().getDrawable(id);
d.setBounds(0, 0, 80, 20);
return d;
}
else if (source.equals("image2.jpg")) {
id1 = R.drawable.b;
Drawable d1 = getResources().getDrawable(id1);
d1.setBounds(0, 0, 100, 40);
return d1;
}
else if (source.equals("image3.jpg")) {
id2 = R.drawable.c;
Drawable d2 = getResources().getDrawable(id2);
d2.setBounds(0, 0, 120, 60);
return d2;
}
else if (source.equals("image4.jpg")) {
id3 = R.drawable.d;
Drawable d3 = getResources().getDrawable(id3);
d3.setBounds(0, 0, 140, 80);
return d3;
}
else if (source.equals("image5.jpg")) {
id4 = R.drawable.e;
Drawable d4 = getResources().getDrawable(id4);
d4.setBounds(0, 0, 160, 100);
return d4;
}
return null;
};
}
}

The problem comes from Html.fromHtml(), which supports only a very limited set of tags and attributes. <img> is supported, but setting the width and height of the image is not. It's possible to achieve it with a TextView (by using SpannableString and ImageSpan), but it's more complicated and not very flexible.
Instead, you should use a WebView which handles HTML properly.
It's easy to load a string :
WebView webView = (WebView) findViewById(R.id.web_view);
webView.loadData(getResources(R.string.day), "text/html", null);
You can find more examples in the documentation.
Just for comparison, here is an example without using a WebView :
protected void onCreate(Bundle savedInstanceState) {
...
TextView textView = (TextView) findViewById(R.id.text_view);
SpannableString ss = new SpannableString("Hello :)");
// Draw the image with a size of 50x50
Drawable d = getResources().getDrawable(R.drawable.happy_face);
d.setBounds(0, 0, 50, 50);
// Replace the ":)" in the string by our drawable
ImageSpan span = new ImageSpan(d, ImageSpan.ALIGN_BASELINE);
ss.setSpan(span, 6, 8, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
textView.setText(ss);
}
It will load much faster, but you can't use HTML.

Related

Place Drawable on Imageview using PorterDuff.Mode.SRC_ATOP

I have an ImageView:
ImageView imageView = findViewById(R.id.imageView);
I would like to achieve something like this (Atop figure)
drawable1 is the original ImageView image, drawable2 is the one I want to place over it:
Drawable drawable1 = AppCompatResources.getDrawable(context, drawable1);
Drawable drawable2 = AppCompatResources.getDrawable(context, drawable2);
LD layerDrawable = new LD(new Drawable[]{
drawable1,
drawable2,
});
imageView.setImageDrawable(layerDrawable);
LD class:
public class LD extends LayerDrawable
{
private Paint p = new Paint();
public LD(Drawable[] layers) {
super(layers);
p.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));
}
#Override
public void draw(Canvas canvas) {
super.draw(canvas);
int count = canvas.saveLayer(null, null, Canvas.ALL_SAVE_FLAG);
for (int i = 0, numberOfLayers = getNumberOfLayers(); i < numberOfLayers; ++i) {
this.getDrawable(i).draw(canvas);
canvas.saveLayer(null, p, Canvas.ALL_SAVE_FLAG);
}
canvas.restoreToCount(count);
}
}
However this doesn't work, because the image I place over (drawable2) is placed over the whole imageView, not just over the non-transparent contents of the drawable1 image.
How do I achieve Atop figure (placing drawable2 only over the 'filled content' of drawable1)?
Edit:
p.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));
canvas.drawBitmap(bitmap1, 0, 0, null);
canvas.drawBitmap(bitmap2, 0, 0, p);

Images are shown as '[OBJ]' in notification lines

I've been trying to add an image from drawable folder into a notification line. But the image doesn't appear and [OBJ] is shown instead.
I can add image in any other place on notifications. Also I can add emoji into a notification line like this issue Android notification - custom inboxstyle (add line ) .
But I can not add an image.
Is there any chance to overcome this issue?
public void someMethod() {
...
mInboxStyle.addLine(imageSpanned());
...
}
private Spanned imageSpanned () {
String imgString = "Something <img src=\"ic_arrow_forward_black_24dp\">";
return Html.fromHtml(imgString, mImageGetter, null);
}
Html.ImageGetter mImageGetter = new Html.ImageGetter() {
#Override
public Drawable getDrawable(String source) {
Drawable drawable;
Resources res = mContext.getResources();
int drawableId = res.getIdentifier(source, "drawable", mContext.getPackageName());
drawable = res.getDrawable(drawableId);
int width = drawable.getIntrinsicWidth();
int height = drawable.getIntrinsicHeight();
drawable.setBounds(0, 0, width, height);
return drawable;
}
};
You need to provide ic_arrow_forward_black_24dp icon resource in your drawables or mipmap.
SpannableStringBuilder builder = new SpannableStringBuilder();
builder.append("Something").append(" ");
builder.setSpan(
new ImageSpan(
getActivity(),
R.drawable.ic_arrow_forward_black_24dp),
builder.length() - 1,
builder.length(),
0
));
textView.setText(builder);

Android - Display Image from url on textview

I'm trying to put the image from url and display it to textview. when i use case 2, the image display perfectly,
but in case 1 not. there is error "unknown protocol: data" and "W/AwContents: nativeOnDraw failed; clearing to background color"
//case 1
// String base_url = "<p>Image 1 : <img src=\"data:image/jpeg;base64,/9j/4AAQSk...
//case 2
String base_url = "<p>Image 1 : <img src=\"http://example.com/android/tryout/logo.png\"></img></p>";
Spanned span2 = Html.fromHtml(base_url,getImageHTML(),null);
TextView tv = (TextView)findViewById(R.id.target);
tv.setText(span2);
and this is my function
public Html.ImageGetter getImageHTML() {
Html.ImageGetter imageGetter = new Html.ImageGetter() {
public Drawable getDrawable(String source) {
try {
Drawable drawable = Drawable.createFromStream(new URL(source).openStream(), "src");
drawable.setBounds(0, 0, drawable.getIntrinsicWidth(),drawable.getIntrinsicHeight());
return drawable;
} catch(IOException exception) {
Log.v("IOException", exception.getMessage());
return null;
}
}
};
return imageGetter;
}
Thanks for the answer.

How to add Custom color Effect on My Custom camera in android

I want to create my custom camera with supports different color
effects for taking images ... I want to custom color effect on my
camera . i put some effect that is Built_In in device but i have no
idea that how i apply other effect like AFTER SNOW FALLING EFFECT
from here and so many other Color Effects.
Please Give me some hints or any link that is helpful for me
My code for effect is
((ImageView)findViewById(R.id.e1)).setOnClickListener(onButtonClick);
private View.OnClickListener onButtonClick = new View.OnClickListener() {
#Override
public void onClick(View v) {
switch(v.getId())
{
case R.id.e1: MonoEffect();
break;}
}
};
private void MonoEffect()
{
Camera.Parameters parameters =mCamera.getParameters();
parameters.setColorEffect(android.hardware.Camera.Parameters.EFFECT_MONO);
mCamera.setParameters(parameters);
}
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
cameraPreviewLayout = (FrameLayout) findViewById(R.id.camera_preview);
//this code is holding an realtime overlay
RelativeLayout layout = (RelativeLayout) findViewById(R.id.preview);
FrameLayout fr = new FrameLayout(this);
fr.setBackgroundResource(R.drawable.snow);
ImageView b1 = new ImageView(this);
b1.setBackgroundResource(R.drawable.snow);
fr.addView(b1);
layout.addView(fr);
/*one solution could be,you if you want a real-time effect on your camera layout,you can add an overlay on the preview as given up.snow is a png format picture with transparent background */ after that... add both the camera output and ta transparent snoweffect as..
Bitmap cameraBitmap =BitmapFactory.decodeByteArray(data, 0, data.length);
Bitmap overlayBitmap = BitmapFactory.decodeResource(getResources(),R.drawable.snow);
Bitmap cameraScaledBitmap = Bitmap.createScaledBitmap(cameraBitmap, 1200, 1600, true);
int wid = cameraScaledBitmap.getWidth();
int hgt = cameraScaledBitmap.getHeight();
Bitmap newImage = Bitmap.createBitmap(wid,hgt, Bitmap.Config.ARGB_8888);
Bitmap overlayScaledBitmap = Bitmap.createScaledBitmap(overlayBitmap, wid, hgt, true);
Canvas canvas = new Canvas(newImage);
canvas.drawBitmap(cameraBitmap , 0, 0, null);
canvas.drawBitmap(overlayScaledBitmap , 0, 0, null);
now you have got your final bitmap as named overlayScaledBitmap.now save it.dont tension about 1200,1600.i just scaled both the camera output bitmap and the snow transparent png as same size.i am currently working on the same project as you qustioned.i would like to take any suggetion from you. https://www.facebook.com/mohammad.mukul.37

How to set and get unique name/tag to dynamically added child android

I have dynamically added 53 images to ImageView of my layout. I want to set unique id to each image that I added and want to get that id on image click. I have added a tag to my imageview imageView.setTag(WirelessPin.arr_WirelessItems[i]); but onClick ProductURL = (String) imageView.getTag(); always return the tag of last image i.e image no 53. How can I resolve this issue?
Here is my code
for (int i = 0; i < WirelessPin.arr_WirelessItems.length; i++) {
url = new URL(WirelessPin.arr_WirelessItems[i].replaceAll("\\s+","%20"));
//ProductURL = WirelessPin.arr_WirelessItems[i];
Bitmap bmp = BitmapFactory.decodeStream(url
.openConnection().getInputStream());
LinearLayout layout = new LinearLayout(con);
layout.setLayoutParams(new LayoutParams(150, 110));
layout.setGravity(Gravity.CENTER);
imageView = new ImageView(con);
imageView.setLayoutParams(new LayoutParams(140, 84));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setImageBitmap(bmp);
imageView.setTag(WirelessPin.arr_WirelessItems[i]);
imageView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//imageView.se
ProductURL = (String) imageView.getTag();
CollectDenominationsForWirelessPin obj = new CollectDenominationsForWirelessPin();
obj.WirelessPinDenominations(con, ProductURL, UserId);
}
});
layout.addView(imageView);
WirelessPin.sliderProducts.addView(layout);
}
In OnClick method, change your code to
ImageView iv = (ImageView)v;
ProductURL = (String) iv.getTag();
Try initialize ImageView inside for loop like below
for (int i = 0; i < WirelessPin.arr_WirelessItems.length; i++) {
// Other Stuff
ImageView imageView = new ImageView(con);// Declare and initialize here
imageView.setLayoutParams(new LayoutParams(140, 84));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageView.setImageBitmap(bmp);
imageView.setTag(WirelessPin.arr_WirelessItems[i]);
//// Code

Categories