Mapbox RasterLayout how to line up ImageSources?

Question

I'm currently trying to add offline maps to Mapbox as an ImageSource on a RasterLayer. Each tile consists of an ImageSource that is set from a bitmap image, within a specific LatLngBounds "4 square corners". Before i put the image in the LatLngBounds called "LatLngQuad" i perform a small rotate of approx -1.0f on the bitmap image before i create an ImageSource out of it.

What happens then is that the bitmap image becomes smaller after the rotate and creates visible gaps between the outline corners of the LatLngBound. Without rotating the tiles beforehand they line up perfectly, but maptiles become distorted without the rotation.

Are there any alternate solutions to line up images with raster layout? I wouldn't like to use any geotiff formats or tile sets since in the project there's already a class model for all the tiles.

This is a picture where i pre-select which tiles to download.

This is what happens when i click on Download and it creates Bitmap image tiles out of it and rotate.

Here's my code for rotating the tiles and displaying them as images, here the visible gaps become apparent. It's the same code for the view when you load the maptiles.

    for (MMapTile mapTile : offlineMap.mapTiles) {
                try {
                    final MMapTile tile = realm.copyFromRealm(mapTile);
                    final LatLngBounds bounds = new LatLngBounds.Builder()
                            .include(new LatLng(tile.south, tile.west))
                            .include(new LatLng(tile.north, tile.east)).build();
                    LatLng latLngOne = new LatLng(bounds.getNorthWest());
                    LatLng latLngTwo = new LatLng(bounds.getNorthEast());
                    LatLng latLngThree = new LatLng(bounds.getSouthEast());
                    LatLng latLngFour = new LatLng(bounds.getSouthWest());
                    LatLngQuad latLngQuad = new LatLngQuad(latLngOne, latLngTwo, latLngThree, latLngFour);

                    //To try: add imageIcon with bounds.getCenter() to rasterLayer and then rotate with PropertyFactory.withIconRotate();
                    Glide.with(activity)
                            .asBitmap()
                            .load(tile.local)
                            .into(new SimpleTarget<Bitmap>() {
                                @Override
                                public void onResourceReady(@NonNull Bitmap resource, @Nullable Transition<? super Bitmap> transition) {
                                    fitBounds(activity, mapboxMap, bounds);
                                    Matrix matrix = new Matrix();
                                    matrix.postRotate(tile.rotation == null ? 0 : -tile.rotation);
                                    Bitmap rotatedBitmap = Bitmap.createBitmap(resource,0,0, resource.getWidth(),resource.getHeight(),matrix,true);
                                    ImageSource imageSource = new ImageSource(tile.id, latLngQuad, rotatedBitmap);
                                    mapboxMap.getStyle().addSource(imageSource);
                                    mapboxMap.getStyle().addImage(tile.id,resource);
                                    mapboxMap.getStyle().addLayer(new RasterLayer(tile.id, tile.id));
                                    tileIds.add(tile.id);

                    
                                }
                            });
                } catch (Exception e) {
                    Log.e(TAG, e.getMessage());
                }