Develop Reference

Unable to add TextView into main xml Layout

I've been working on an app and am looking to adding a text view below the Camera view so that I could display some text there.
But, for some reason when trying to drag a text view into the layout it doesn't show up on the final screen.
This is my code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/topLayout"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:keepScreenOn="true">
<com.google.android.CameraSourcePreview
android:id="#+id/preview"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.GraphicOverlay
android:id="#+id/faceOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</com.google.android.CameraSourcePreview>
</LinearLayout>

Layout view com.google.android.CameraSourcePreview height is set as 'match_parent' , so its eating up all the space on the view-port.
Try giving particular height and you should be able to see textview added below CameraSourcePreview.
Hope it helps.

Most likely, you're not able to add the TextView due to there not being enough space on the screen.
You're using a LinearLayout which displays all of it's views one after the other in either a vertical or horizontal manner.
Your CameraSourcePreview has it's height and width set to match_parent, which means it'll stretch completely on the screen. However, in a LinearLayout, this also means that there's no space to place the next View because it'll be placed off the screen.
You can add android:layout_weight="1" to your CameraSourcePreview. This will allow your TextView to fit into the LinearLayout because it's basically your CameraSourcePreview telling others it'll resize itself to allow for other components to fit on the screen.
But if you don't want your CameraSourcePreview to resize itself based on other Views, then you should look into using some other Layouts instead of LinearLayout. Perhaps one such as ConstraintLayout or RelativeLayout will work better, since they allow overlapping Views on top of each other.

This is happening because the height of the camera view is taking the whole space on the display you can use layout_weight for LinearLayout to make some necessary space for your TextView.
Just make height of CameraSourcePreview equals to 0dp and add a property
android:layout_weight="1"
So this it would look like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/topLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:keepScreenOn="true"
android:orientation="vertical">
<com.google.android.CameraSourcePreview
android:id="#+id/preview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<com.google.android.GraphicOverlay
android:id="#+id/faceOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</com.google.android.CameraSourcePreview>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="some text here" />
</LinearLayout>

Instead of using LinearLayout I suggest to use FrameLayout which is easy to control for your case. It is also possible to display textView on CameraSourcePreview by using following code
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/topLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:keepScreenOn="true">
<com.google.android.CameraSourcePreview
android:id="#+id/preview"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_gravity ="center">
<com.google.android.GraphicOverlay
android:id="#+id/faceOverlay"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</com.google.android.CameraSourcePreview>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="some text here"
android:layout_gravity ="center|bottom" />
</FrameLayout>

android:Why "layout_weight=1" makes the view align parent bottom in linearlayout? [duplicate]

This question already has answers here:
What does android:layout_weight mean?
(13 answers)
Closed 2 years ago.
The xml layout is like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bottom"/>
</LinearLayout>
And it turns out that the textview will be placed to the bottom of its parent.I think layout_weight is used to allocate unusesd space and it's very common to use layout_weight with code like :
android:layout_width="0dp"
But in this case,the first layout asks to occupy all spaces with:
android:layout_width="match_parent"
android:layout_height="match_parent
So how does layout weight work here?
PS:I have read this question: What does android:layout_weight mean? but I don't think it accounts for this question.
layout_weight specifies how much of the extra space in the layout to be allocated to the View.
The first linearlayout has already taken the whole space with attribute match_parent,why setting layout_weight enables the second view to showup at the bottom ?
I believe this is not the common usage of layout_weight.Hope somebody point out my mistake.

When you use layout_weight attribute it is used to calculate the weightage of child views of the single parent.
As you have not mentioned weight of all other views it's behaving wrong.
layout_weight is useful when you want your child views to be certain percentage of the parent view.
for example,
in parent view you need to mention:
android:weightSum="1"
So your parent view will have total weight as 1, and in both of the views you need to mention the:
android:layout_weight=".9" and android:layout_weight=".1"
so the first view will take 90%, and second view will take 10% of the space.
To be more clear Ideally the sum of weights of all the childs should be equal to the weightsum mentioned in parent, to it work as expected.
**And as you have provided android:layout_width,android:layout_height` of the textview, this is the mistake as it will make issue in the weight.
So to use weight attribute correctly you need to give other specs as 0dp in order to weight to apply successfully.**
Note: When you use weight other specs like android:layout_width,
android:layout_height should be set to 0dp.
To understand it practically, why don't you play around with below
layout:
Just Try to change the weight of linear_layout, text_view and you will see, how it's supposed to works ideally:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100" >
<LinearLayout
android:id="#+id/linear_layout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="10"
android:background="#android:color/holo_blue_bright" >
</LinearLayout>
<TextView
android:id="#+id/text_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="90"
android:background="#android:color/white"
android:text="bottom"
android:textColor="#android:color/black" />
</LinearLayout>

If you want to place your components in separate boxes in layout ,you should use LinearLayout.
You can define the manner of boxes place with orientation vertical or horizental.
You can define their size easily with layout_weight.
look here:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id=#+id/parent_linear>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4">
</LinearLayout>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:text="bottom"/>
</LinearLayout>
parent_linear divides your layout in 2 parts(because you use 2 components) vertically. Now you can set weights to child's components width. So,(for TextView) you set android:layout_width="0dp" for its width and android:layout_weight="2" ..follow it for LinearLayout- .
The result of this is parent_layout divide itself into 6 parts (2+4=6),and allocates 4 parts to LinearLayout and 2 for TextView.

Set width of parent linear layout as percentage of the screen

I am building an android application and I have a dialog fragment. The dialog fragment has a set width. However, the issue is that when the app is run on a device with a different screen size, the dialog fragment isn't centered properly.
Initially, what I had was:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="500dp"
android:layout_height="wrap_content">
<-- code goes here -->
</RelativeLayout>
As you can see, I have a relativeLayout with a defined width. Since I know that you can't use layout_weight in a relative layout, what I did was I wrapped that parent relative layout in a linear layout as such:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:weightSum="1">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</RelativeLayout>
</LinearLayout>
However, that doesn't work since the dialog fragment is cut when I run the application on a device with smaller screen size.
How can I set the width a dialog fragment as a percentage of the screen size? Is this possible at all or would I have to resort to setting it programmatically?

This is a correct way, if you want RelativeLayout have 40% width of the screen, but this technique cant apply to the parent layout, because parent layout doesn't have parent layout and android:layout_weight doesn't affect
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="40">
</RelativeLayout>
Since I know that you can't use layout_weight in a relative layout
We can use layout_weight in any view and layout, if it direct child of a LinearLayout

With the new percent support library, you can now use a PercentRelativeLayout.
Check out this link

The code below will make relative layout 1/2 of the parent and will position it horizontally centered:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</RelativeLayout>
</LinearLayout>
Hope it helps.

2 RelativeLayouts in one layout

I've decided to use 2 RelativeLayouts for my app, one Layout for one portion of child Views on the screen to the left, the other for child Views to go to the right.
The problem is I don't know how to lay them out in XML so that the middle white space isn't included when I inflate my Layout.
This is what I want.
When I use 1 RelativeLayout, the middle white space is filled with the RelativeLayout, and I can't touch anything behind it.
Thank you very much for reading.

Do something similar to the following example.
This will create a LinearLayout with 2 RelativeLayouts using layout_weight to space the RelativeLayouts and then you can populate the RelativeLayouts with whatever you want.
The Buttons are just place holders for the example.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TEST1" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TEST2" />
</RelativeLayout>
</LinearLayout>

Fixed proportion of layout on screen

In my app, I have 2 linear layouts: one at the top, one at the bottom.
I'd like that whatever is inside these layout, the layout of the top occupies 60% of the height of the screen and the layout of the bottom 40%.
Here is my XML code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1.0" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.6"
android:orientation="vertical"
android:id="#+id/layout_top">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="0.4"
android:id="#+id/layout_bottom">
</LinearLayout>
</LinearLayout>
When these layouts are empty, no problem, they have the good proportion.
The problem is that if I put a small listview in the top layout for e.g. then the layout will take the size of the listview and won't preserve the 60/40% proportion.
I'd like that even if my listview is small (only 3 item for eg), the layout preserve it's 60% and so put some empty space under my listview.
I've tried to change android:layout_height to match_parent but it doesn't change anything.

Try using this Layout it works for me
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1.0" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="6"
android:orientation="vertical"
android:id="#+id/layout_top"
android:background="#FF0000">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:orientation="vertical"
android:layout_weight="4"
android:id="#+id/layout_bottom"
android:background="#FF00FF">
</LinearLayout>
</LinearLayout>
The trick is to set up a layout_height="0dip" instead of wrap_content in portrait mode and layout_with="0dip" instead of wrap_content in Landscape mode you can use layout-land folder for that.

layout_weight specify extra space in the layoutfot the view. you should try measuring your screen first like:
Display display = ((WindowManager)
getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
int width = display.getHeight();
and then doing some calculation like width*0.6 and 0.4 , this way your layout will always have 60 40 ratio.
Hope This Helps

try layout_height = 0dp in both the children LinearLayouts. Its happening because you have wrap_content which is probably overriding the layout_weight effect.

Simply in your parent layout, replace android:layout_weight="1.0" with android:weightSum="1.0"
This works by setting the weight sum of the parent layout and the weights of the children layouts. The weight of the children should be equal to the weight sum of the parent. Take a look at this http://blog.stylingandroid.com/archives/312