¿Por qué Bitmap to Base64 String muestra un fondo negro en la vista web en android?

Question

Estoy usando un código que combine las imágenes en 1 usando canvas. Muestro esa imagen a ImageView se ve bien. Pero cuando trato de mostrar eso en WebView, muestra el fondo negro a la derecha de esa imagen. Intento cambiar el color de fondo en HTML pero no cambia el color. o hacer transparente. ¿Alguien puede ayudar? Result is here La imagen de arriba está en ImageView y a continuación está en WebView.

public class MyBimapTest extends Activity { 
/** Called when the activity is first created. */ 
@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.main); 

    ImageView img1 = (ImageView) findViewById(R.id.ImageView01); 

    img1.setVisibility(View.INVISIBLE); 
    Drawable dra1 = img1.getDrawable(); 
    Bitmap map1 = ((BitmapDrawable) dra1).getBitmap(); 
    ImageView img2 = (ImageView) findViewById(R.id.ImageView02); 
    img2.setVisibility(View.INVISIBLE); 
    Drawable dra2 = img2.getDrawable(); 
    Bitmap map2 = ((BitmapDrawable) dra2).getBitmap(); 

    // *** 
    ByteArrayOutputStream baos = new ByteArrayOutputStream(); 
    map1.compress(Bitmap.CompressFormat.JPEG, 100, baos); 

    byte[] b = baos.toByteArray(); 
    String abc = Base64.encodeBytes(b); 

    byte[] byt = null; 
    try { 
     byt = Base64.decode(abc); 
    } catch (IOException e) { 
     // TODO Auto-generated catch block 
     e.printStackTrace(); 
    } 
    map1 = BitmapFactory.decodeByteArray(byt, 0, byt.length); 

    // *** 
    Bitmap map = combineImages(map1, map2); 
    ByteArrayOutputStream bbb = new ByteArrayOutputStream(); 
    map.compress(Bitmap.CompressFormat.JPEG, 100, bbb); 

    byte[] bit = bbb.toByteArray(); 

    String imgToString = Base64.encodeBytes(bit); 

    String imgTag = "<img src='data:image/jpg;base64," + imgToString 
      + "' align='left' bgcolor='ff0000'/>"; 

    WebView webView = (WebView) findViewById(R.id.storyView); 
    webView.loadData(imgTag, "text/html", "utf-8"); 
    Drawable end = new BitmapDrawable(map); 

    ImageView img3 = (ImageView) findViewById(R.id.ImageView03); 
    img3.setImageBitmap(map); 
} 

public Bitmap combineImages(Bitmap c, Bitmap s) { 
    Bitmap cs = null; 
    int width, height = 0; 

    width = c.getWidth() + (s.getWidth()/2); 
    height = c.getHeight() + (s.getHeight()/2); 

    cs = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); 

    Canvas comboImage = new Canvas(cs); 

    comboImage.drawBitmap(c, 0f, 0f, null); 
    comboImage.drawBitmap(s, c.getWidth() - (s.getWidth()/2), c 
      .getHeight() 
      - (s.getHeight()/2), null); 
    return cs; 
} 

}

Answer 1

El formato JPEG no admite la transparencia alfa, por lo que el fondo transparente se vuelve negro cuando se convierte la imagen original a JPEG.

utilizar el formato PNG lugar:

map1.compress(Bitmap.CompressFormat.PNG, 100, baos); 

y

String imgTag = "<img src='data:image/png;base64," + imgToString    
    + "' align='left' bgcolor='ff0000'/>";