Android - Placing one layout on top of another layout - android

I am trying to place one layout in top of another. I can do it but there is a problem in a case. Let me describe it first :
Here is my layout codes:
<RelativeLayout>
<LinearLayout
android:id="#+id/smallVideoRenderLayoutOutgoing"
android:layout_width="120dp"
android:layout_height="170dp"
android:orientation="vertical"/>
<LinearLayout
android:id="#+id/largeVideoRenderLayoutOutgoing"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"/>
</RelativeLayout>
There are other things but they are not necessary here . If i run code with these two view works fine. But if i setVisibility(GONE) for the "smallVideoRenderLayoutOutgoing" in my onCreate() or onResume() method on my Activity. It don't show at all. Though i can see the visibility of that "smallVideoRenderLayoutOutgoing" on my program and it show it is visible but i don't see it on my screen. I think it is overlapped by the "largeVideoRenderLayoutOutgoing" . What do you think and how can i solve this matter?
Complete View heirarchy:
Here is my code part:
private LinearLayout smallVideoRenderLayoutOutgoing, largeVideoRenderLayoutOutgoing;
private VideoCallImageRenderView smallPlayerGLView, largePlayerGLView;
private void initVideoRenderer() {
Constants.debugLog(TEST_TAG, "initVideoRenderer");
Constants.debugLog(TAG, "initVideoRenderer");
smallPlayerGLView = new VideoCallImageRenderView(this);
largePlayerGLView = new VideoCallImageRenderView(this);
VideoCallCamera.getInstance().startCamera();
VideoCallCamera.getInstance().cameraCallBack(largePlayerGLView, this);
isOwnSurfaceViewLarge = true;
largeVideoRenderLayoutOutgoing.addView(largePlayerGLView);
largeVideoRenderLayoutOutgoing.setOnClickListener(this);
smallVideoRenderLayoutOutgoing.addView(smallPlayerGLView);
smallVideoRenderLayoutOutgoing.setOnClickListener(this);
smallVideoRenderLayoutOutgoing.setVisibility(View.GONE);
}

Try instead of:
<RelativeLayout>
<LinearLayout
android:id="#+id/smallVideoRenderLayoutOutgoing"
android:layout_width="120dp"
android:layout_height="170dp"
android:orientation="vertical"/>
<LinearLayout
android:id="#+id/largeVideoRenderLayoutOutgoing"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"/>
</RelativeLayout>
To use LinearLayout with vertical orientation as root layout. And for your large layout have height of 0dp and weight 1 - it will make your large layout to occupy all available space - and it will be under small layout.
Something like the following:
<LinearLayout
android:orientation="vertical">
<LinearLayout
android:id="#+id/smallVideoRenderLayoutOutgoing"
android:layout_width="120dp"
android:layout_height="170dp"
android:orientation="vertical"/>
<LinearLayout
android:id="#+id/largeVideoRenderLayoutOutgoing"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"/>
</RelativeLayout>

Try changing the layout width and height from match parent to wrap content.
Or when you make the view invisible call bringToFront() method for the other view.
You should check this.

Related

Android GridView Height Autofill the Remaing Space

Is it possible for a GridView to auto adjust to occupy the remaining empty space of its parent layout? If yes how ?
Yeah. It is possible.
Let's consider following xml,
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
//First View or layout
<RelativeLayout
android:id="#+id/first_layout"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#000">
</RelativeLayout>
//Second View or layout
<RelativeLayout
android:id="#+id/second_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/first_layout"
android:background="#8b3737">
</RelativeLayout>
</RelativeLayout>
In your Activity,
RelativeLayout layout_one=(RelativeLayout)findViewById(R.id.first_layout);
RelativeLayout layout_two=(RelativeLayout)findViewById(R.id.second_layout);
when you set,
layout_one.setVisibility(View.GONE);
then the second Layout/View will occupy the whole parent space.
NOTE: I took relative layouts for examples. It can be any view. But the parent should be a RelativeLayout.
If you want second layout to be hidden and first layout should fill parent,
Then the XML will be,
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
//First View or layout
<RelativeLayout
android:id="#+id/first_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/second_layout"
android:background="#000">
</RelativeLayout>
//Second View or layout
<RelativeLayout
android:id="#+id/second_layout"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#8b3737">
</RelativeLayout>
</RelativeLayout>
when you set,
layout_two.setVisibility(View.GONE);
then the first Layout/View will occupy the whole parent space.
NOTE: At least one Layout/View should have static height(in this case).
I hope it will help you.
All the best.

Filling a view that has `wrap_content` as height

So I'm using a RecyclerView, with some cards. I want to get an overlay on the card when it's clicked, which should cover all contents, but not change the size of the view. Hardcoding the size of the card is not possible, since the contents have different dimensions.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--contents and stuff-->
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000" />
</RelativeLayout>
The example above is pretty much what I'm trying to achieve, but this obviously won't work, since the View's and RelativeLayout's height refer to each other.
How can I make the View cover everything inside the RelativeLayout?
Edit
Clarification: The issue I'm having has nothing to do with clicking, covering or anything like that. I'm having issues with just covering the RelativeLayout.
Credits go to thunder413 for suggesting the FrameLayout in the comments.
Basically, all I had to do was encapsulating the RelativeLayout (as shown in my question) in a FrameLayout, and move the View out of the RelativeLayout into the FrameLayout
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--contents and stuff-->
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000" />
</FrameLayout>

scrollview doesn't scroll setting height programmatically

I would start with my goal. What I want to achieve is to have layout which is 3 times bigger then real screen of phone.
Right now I try to test my solution, but I have problem with scrolling.
This is how look my layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="400dp"
tools:context=".Zo"
android:id="#+id/zo_root"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="9">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:background="#color/Red"
></FrameLayout >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:background="#color/Yellow"
></FrameLayout >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:background="#color/Blue"
></FrameLayout >
</LinearLayout>
</ScrollView>
My code behind:
#Override
protected void onCreate (Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_zo);
setParameterForScroolView();
}
private void setParameterForScroolView()
{
ParameterKeeper parameterKeeper = new ParameterKeeper(this);
LinearLayout linearLayout = (LinearLayout)findViewById(R.id.zo_root);
linearLayout.getLayoutParams().height = parameterKeeper.getHeightOfScreen() *3;
}
The code behind works well, cause my whole screen is red, but I can't scroll it at all.
There was answer which said, that I need to remove from scrollView android:fillViewport="true". After that my LinearLayout diseapers like in this question.
I added LinearLayout as root (source) but it not helped me at all.
Have you got any idea to solve it?
I try also set height 1600dp instead 400dp for Root LinearLayout in xml to be sure, that it's not problem with recalculating view. It's not working too.
You are changing the size of the wrong layout. you suppose to modify the height of the first layout inside the scroll view.
Some way scroll doesn't work if the child elements have layout_weight and I change programmatically value of height in parent's view.
In my case the only way to make it works was to set height equal to size of screen in every of frame layout in code of activity. This way I could reach my goal which was to have layout height == 3 x real screen size

ScrollView goes on top of another layout Android

In the following code I've got two main containers, a RelativeLayout and a ScrollView. I need the RelativeLayout to be on top fixed and below that I need the ScrollView with Images to be scrollable. I've got the following two questions:
Though my ScrollView is scrollable but it goes on top of the RelativeLayout. !important
The view of my images present within the vertical LinearLayout are thumbnail sized. If I have 15-20 images, they take a lot of vertical space. How do I have the images to fit the maximum in a row based on the screen size and then go to the next row?
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</RelativeLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView>
</ImageView>
<ImageView>
</ImageView>
<ImageView>
</ImageView>
<ImageView>
</ImageView>
</LinearLayout>
</ScrollView>
Follow these in simple way:
You need to use a fixed height for the parent, i.e., <RelativeLayout>.
Set the height of the ScrollView to match_parent.
Make sure you put everything inside a LinearLayout.
Finally you would end up with this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
</RelativeLayout>
</LinearLayout>
First, you can set your RelativeLayout's height to a fixed value. Then set your ScrollView's height to match_parent, so it takes up all the available space. Then both of these should be contained in a vertical LinearLayout, to avoid any overlapping.

Android scrollview eating up added layouts

I have a layout something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:background="#ff303f"
android:id="#+id/layout">
<ImageView
android:id="#+id/picture"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_centerInParent="true"/>
<Button
android:id="#+id/cancel"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_alignRight="#id/picture"
android:background="#drawable/cross_out"/>
</RelativeLayout>
I inflate it using the usual layout inflator service, set up some functionality to the button and an image to the imageview (all images are of same size and aspect ratio).
After that, I add this view to my fragment's layout which is nothing but a ScrollView which is a parent, it has a child linear layout that I call 'map' and simply add it to the map.
Expected : The added layouts should get added properly and I can scroll through it. Actual : If more than 2 are added, the first one gets eaten up. I can see it half or sometimes it is completely eaten up. :\
Any idea whats going on here? Thanks a lot for your time.
EDIT: Here's the layout file I add the inflated layout into:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f6ff45">
<LinearLayout
android:id="#+id/map"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#43ff44"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_gravity="center"
android:layout_marginTop="15dp">
</LinearLayout>
</ScrollView>
I also forgot to mention that after adding 3 or more of these layouts, I realized there's unnecessary empty space in the end. :\
try to define scrollView from Java code like
//Initialize the TextView for vertical scrolling
output = (TextView) findViewById(R.id.textView);
output.setMovementMethod(new ScrollingMovementMethod());

Categories

Resources