Image to Base64 String example
In this example, we will be learning how to implement conversion from image to Base64 String image. In the previous post, we have covered the case when we needed to convert Base64 String to Image. In short, we are going to take one image from our image gallery, convert it into a Base64 String, and display that string on screen, alongside the image that we have selected.
This example is a followup post from Base64 String to Image example and Select image from gallery and display it on screen. example and we will continue where we have left from the post above.
First we will add new text element to our layout (Constraint Layout) for displaying the Base64 String image:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<TextView<br> android:id="@+id/base64Text" android:layout_width="match_parent" android:layout_height="0dip" android:ellipsize="end" android:padding="16dp" android:scrollbars="vertical" android:textSize="8sp" app:layout_constraintBottom_toTopOf="@id/button" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@id/text" /> <TextView android:id="@+id/base64TextOverlay" android:layout_width="match_parent" android:layout_height="0dip" android:gravity="center" android:padding="16dp" android:text="@string/your_text" android:textAllCaps="true" app:layout_constraintBottom_toTopOf="@id/button" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@id/text"/> |
In here we have an text holder and an overlay for UI purposes only.
Because in the previous examples, the image in onActivityForResult() is converted in to Bitmap object, the apropriate method is created that receives Bitmap object as a parameter and returns byte array to be used later on the conversion to Base64 String Image:
|
1 2 3 4 5 |
private byte[] imageToByteArray(Bitmap bitmapImage) { ByteArrayOutputStream baos = new ByteArrayOutputStream(); bitmapImage.compress(Bitmap.CompressFormat.JPEG, 20, baos); return baos.toByteArray(); } |
In here not only we get the Byte array output stream, baos, but also we add format to our image and the compression, or quality, of the image. In CompressFormat we can add JPEG, PNG and WEBP format. For compression quality the scale is from 0 to 100, 0 being the lowest quality and 100 the highest. Then the conversion to Base64 String Image can begin:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
@Override protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == GET_PICTURE && resultCode == Activity.RESULT_OK) { Uri imageUri = Objects.requireNonNull(data).getData(); Bitmap bitmap = null; try { bitmap = MediaStore.Images.Media.getBitmap(this.getContentResolver(), imageUri); } catch (IOException e) { e.printStackTrace(); } if (bitmap != null) { image.setBackground(getDrawable(R.color.white)); image.setImageBitmap(bitmap); byte[] imageBytes = imageToByteArray(bitmap); String encodedImage = Base64.encodeToString(imageBytes, Base64.DEFAULT); // actual conversion to Base64 String Image base64Text.setText(encodedImage); // display the Base64 String Image encoded text } overlayTest.setVisibility(View.INVISIBLE); base64TextOverlay.setVisibility(View.INVISIBLE); } } |
Here we use our previously created imageToByteArray() method, passing the bitmap that we have created from the selected picture from our gallery, as an argument. Then newly created imageBytes byte array, is passed as an argument in Base64.encodeToString method. This method requires byte[] and int flag which flag can be crafted to our needs for playing around with the text.