We Keep Coding

Zoomable FrameLayout got absolute width and height but Views in it do not match these dimensions

Okey, so hello everyone.
I am pretty new to app developing.
Introduction:
In my app I have activity with RelativeLayout. In this layout I have zoomable FrameLayout. In this layout I have to have only one layout. In my case It is another RelativeLayout. Finally in this layout I have number of ImageViews. Purpose of this activity is show layers of map (drawables) via switches.
Code here:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorDarkBlueGrey"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.example.cotwcompanion.ZoomableView
android:id="#+id/zoomView"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/mapLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/mapBCG"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:contentDescription="#string/map_name"/>
<!-- Here I generate other ImageViews with 'same' attributes -->
</RelativeLayout>
</com.example.cotwcompanion.ZoomableView>
<!-- Here are other layouts -->
</RelativeLayout>
Problem:
My problem is more or less visual. I would like to show these layers (1:1 ratio) as big as display allows (vertically). Therefor I need to overlap display's width.
What I need It to look like:
IMAGE
What I have tried:
I thought FrameLayout would do it. So I tried to set its width
and height programmatically, so It fits screen height and has
the same width, because of 1:1 ratio mentioned before. If I try to log these dimensions, it seems like all is set. Because
of match_parent attribute in ImageViews and their parent RelativeLayout, It should therefor do everything else and stretch these Views to fill FrameLayout. But everything just
only fits screen width.
Image of result here:
IMAGE
Code here:
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(height, height);
FrameLayout frame = findViewById(R.id.zoomView);
frame.setLayoutParams(lp);
I tried the same method with normal FrameLayout but got same
result.
I also tried to exchange FrameLayout with
HorizontalScrollView and custom zoomable ImageView. This worked more or less well, but problem was when I zoomed the map.
Horizontal scroll disrupt every movement with zoomed map. Therefor I
tried to create custom HorizontalScrollView with methods to
disable scroll. Even when I catched zoomed state from ImageView
and set scroll to notEnabled, It still did not work.
And there you go. Like I said zooming methods and everything other works. I just need to somehow have bigger View than display allows.
EDIT [21.11.2020]:
So as Daxi suggested I tried to change RelativeLayout in ZoomableLayout to ConstraintLayout. I also changed ZoomableLayout to extend from ConstraintLayout. That almost solved my problem. However I could not scroll to left and right. I could only zoom. So I took one of my last tried solution and wrapped ZoomableView with HorizontalScrollView. Everything seemed okey. However I now just cannot scroll to the very 'start' or 'end' of the ImageView. It seems like I can only scroll within the base width of HorizontalScrollView and not width of ImageView. So I now need to solve this problem.
Code here:
<RelativeLayout>
<HorizontalScrollView>
<ZoomableView extends ConstraintLayout>
<ConstraintLayout>
<ImageView/>
.
.
</ConstraintLayout>
</ZoomableView>
</HorizontalScrollView>
.
.
</RelativeLayout>
I am so sorry if this is somehow a duplicate of other problem already described on stackoverflow, but I searched for solution over two days now and still did not find any. Maybe I am bad finder. If this will be the case, feel free to tell me. I will delete it if needed.
If there will be some pretty fine answer and solution I would really appreciate It. Thank you.

Would you consider using ConstraintLayouts? If yes, you could use it like this
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/mapLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/mapBCG"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:contentDescription="#string/map_name"/>
<!-- Here I generate other ImageViews with 'same' attributes -->
</androidx.constraintlayout.widget.ConstraintLayout>
However, I am not sure how exactly this will interact with your ZoomableView

Android add border image to ImageView

Is it possible to add a bitmap as border of an ImageView in android dynamically in Java?
I have already tried the following:
Image view in XML and border as shape the result is wrong I want to add bitmap in border.

You have got multiple options:
Place an other View with the border (also imageview) above your Imageview. Thay might be the simples solution. Just add an other view to your xml and make sure they are overlapping. (Use for example a Relative or FrameLayout as container)
Use a Layer List and draw a shape above a Bitmap and add that to your ImageView
Write a custom ImageView and use the Canvas to draw the Border in the overwritten onDraw method. E.g. canvas.drawRect(...) its pretty straightforward.

The simple way：
A drawable for ImageView's attr that android:foreground
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke android:width="1px" android:color="#ff0000" />
<solid android:color="#android:color/transparent"/>
</shape>
Then XML,
<ImageView
android:id="#+id/unreserved_head_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:foreground="#drawable/shape_border"
/>

The simplest solution I found recently.
Try to use material theme in your app. Use "Theme.MaterialComponents.Light"
Then use image view inside and material card view.
<com.google.android.material.card.MaterialCardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardBackgroundColor="#color/white"
app:cardCornerRadius="8dp"
app:cardElevation="0dp"
app:strokeColor="#color/colorPrimary"
app:strokeWidth="1dp">
<ImageView/>//define you image view hear
</com.google.android.material.card.MaterialCardView>
With property stokeColor and strokeWidth you can have border on an image view and make it dynamic.

you can use 9 patch in andorid studio to make an image a border!
i was finding a solution but i did not find any so i skipped that part
then i go to the google images of firebase assets and i accidentaly discovered that they use 9patch
heres the link: https://developer.android.com/studio/write/draw9patch
you just need to drag where the edges are
its just like boder edge in unity

Darken the screen except one gridview item in Android

I am trying to find a way to darken the entire screen except for a specific gridview item (in order to draw attention to this specific item).
I have been able to darken the whole screen by putting a black partially transperant view in front of the app content like this:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<GridView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/gridView"
android:numColumns="2"/>
<View
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#88000000" />
</FrameLayout>
Unfortunately I cannot come up with a way to make one gridview item not get darker. Can anyone help me out here?

Inflate the gridview position view in a custom dialog which maintains its x, y position on screen and 'darkens' the rest of the layout.

Could this also work? Set a background color to whatever you want and in getView return transparent image to all grid items except the one you want to display.

How to correctly scale an ImageView in a widget?

I have two images overlayed on top of another in a widget layout. The top image is supposed to rotate above the background image. Both are ImageViews. As you can see, the inside circle is too small (check xkcd.com/now to see what the layout should look like) . I tried resizing the file itself, which didn't change anything, I tried using mat.postScale, which only gave me an outOfMemory error. I'm using matrix.postRotate to rotate the inside circle. Since I'm using RemoteViews (it's a widget), I'm very limited in what I can do. So how can I resize the inside circle by 115%? (oh and I can't use fixed values because it has to change sizes if the widget is resized)
And here is the XML layout:
<ImageView
android:contentDescription = "#string/app_name"
android:id="#+id/imagef"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"/>
<ImageView
android:contentDescription = "#string/app_name"
android:id="#+id/nowView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerInParent="true"/>
Screenshot of what it looks like now:

Android: how to set background image in table layout

Im using tablelayout to display items from sqlite db.
I set a backgrpund image for table layout,
but the image appears below the texts I need to display the image back to the texts, not below,ie, I need the image frame as 0,0
What I have to do .
Now I used
.setbackgroundresources(r.drawable.imagename)
Please guide me I have to add background image for table layout programmatically

If you're setting the background resource for a layout and the image appears below the layout itself (ie. below all the components), you're probably not adding the background resource to the correct layout.
But since you're not really giving much info, that might not even be the case.
Could it be that your image is actually much smaller than the table itself and instead of expanding to the size of the table, could it be staying at its fixed size (which would probably be centered in the layout)?
Try setting the background of the table to a fixed color (ie. view.setBackgroundColor(Color.BLACK);) to test that out. If the entire table fills as you expected, then it's probably related to the image you're using.
If the color fills only the same area the image resource did before, then it's probably my first thought where you're not adding the resource to the proper layout.

then try to put one outer layout linear layout of table layout , in your .xml file and then set the background of that linear layout like
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/bkg1">
<TableLayout
android:id="#+id/linearLayout1_tblLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableRow
android:id="#+id/linearLayout1_tblLayout1_tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center" >
......
</TableRow>
</TableLayout>
</LinearLayout>