I have a main Relative layout within which there is a ListView and another Horizontal LinearLayout which I want to place at the bottom of the screen.
When the items in the list view fills up the screen, it gets hidden under the Horizontal Linear layout.
How do I restrict the ListView to take the space only till the Horozontal Linear layout and stop the content of the list view from hiding.
Thank you for your help and suggestions.
here is my Layout and a screen shot of how it looks.
<?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:id="#+id/activity_chat_window"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.raoburugula.speech_soft_ivr.ChatWindow">
<ListView
android:id="#+id/lvMessages"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#android:color/transparent"
android:dividerHeight="5dp"
/>
<LinearLayout
android:id="#+id/llAction"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:weightSum="5"
android:visibility="invisible">
<EditText
android:id="#+id/etMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="4"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/btnSendMessage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/ic_send"
android:tint="#android:color/white"
android:onClick="sendMessage"
/>
</LinearLayout>
</RelativeLayout>
I would remove the android:visibility="invisible" line from the LinearLayout. and check how that works. I also one time built my layout from the bottom up to allow me to place 2 buttons at the bottom of the screen, in hindsight I probably didn't need to. I wasn't able to comment on your post so I made this an answer instead.
Also have you tried a normal button in place of the FAB(FloatingActionButton)? A FAB might have properties that make it visible and at the bottom right regardless of its parents attributes
You made the horizontal linearlayout align the bottom of parent ,yes;
and you must make your listView above the horizontal linearlayout.
Related
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>
I have vertical linearLayout. First element is a framelayout that has some content and second element is button that should always be at the very bottom.
While button should be at the bottom, the framelayout should take the rest space that is in the linearlayout
<LinearLayout
...>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
...
</FrameLayout>
<Button
.../>
</LinearLayout>
The key to this solution is the combination of 0dp height for your FrameLayout and the layout_weight attribute. This attribute allows a LinearLayout to divide the "extra" space up between its children. Your button takes up a fixed amount of space, and your FrameLayout takes up no space at all... so everything that isn't the button winds up being given to the FrameLayout and now it fills up the whole LinearLayout while leaving enough space for the Button below it.
Use android:layout_height="match_parent" on your FrameLayout
you should use RelativeLayout somthing Like that :
<?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"
>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Test"
android:layout_alignParentBottom="true"
android:id="#+id/btnTest"
/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent"
android:layout_above="#id/btnTest"
>
</FrameLayout>
</RelativeLayout>
I have a dialog fragment that contains linear layout that involves a titleText above a RecyclerView, and at the very bottom, there's a button below the recyclerView.
Since a recyclerView expands or collapses based on the number of items the adapter sets, the button sometimes gets truncated and no longer appears to be on screen, since the recyclerView just covers the entire screen.
My question is, is there a way to set the maximum height of the recyclerView without ever hiding the button underneath. I also don't want to just give the view a random height just in case the recyclerView contains no items, and it would just be a blank section.
Please let me know if you've ever run into this issue, and how you resolved this. Thanks!
UPDATED
You can achieve this easily using layout weights. Here's an example:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title"
android:textSize="21sp"/>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="30dp">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="Submit"/>
</FrameLayout>
The Title and RecyclerView will wrap content according to contents and button will always take up bottom place.
I suggest using RelativeLayout as it handles the positioning of views for cases like yours, so that you can actually focus on main design.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:text="Some title" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/title"
android:layout_above="#+id/button"/>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center"/>
</RelativeLayout>
Above XML code is the skeleton code for what you need. you can add margins and dimensions to control the spacing. But in any case (until you provide negative margins) your views will never overlap each other.
Main trick of using RelativeLayout is the ability to use XML tags like
android:layout_below or android:layout_above or android:layout_start
or android:layout_end which perfectly aligns your view the way you
want.
I'm making a chat Activity that has a send message box at the bottom. The send message box should always be visible and always be at the bottom of the screen. The Scrollview has a vertical LinearLayout that has views added to it inside of a loop. It works pretty much perfectly except when the there are enough views in the LinearLayout to make it scrollable the last element is always covered by the send message box. If I make the send message box invisible you can see all of the views in the layout. See images for clarity.
I DO NOT WANT TO USE A ListView because I don't want to have to use an adapter
This image on the left shows the last item being covered. Then making the send message invisible shows the last element.
Here's the layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_chat" tools:context="com.example.brian.cleverrent.ChatActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:id="#+id/scrollView" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/chatTimeLineLayout">
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/sendMessageLayout"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:background="#eeeeee"
android:orientation="horizontal">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/chatEditText"
android:layout_weight=".9"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Send"
android:id="#+id/chatSendButton"
android:layout_weight=".1"/>
</LinearLayout>
</RelativeLayout>
Maybe you could try using
android:fillViewport="true"
for the ScrollView. Haven't tested it myself, but it was proposed as a solution to a similar problem here LinearLayout not expanding inside a ScrollView.
Solution was to add...
android:fillViewport="true"
android:paddingBottom="50dp"
Thanks to Nestel for answer
I would like to make a listview with dynamic size. When I press the button, it will add a row to the listview. And I want the button is always aligned to bottom of the list view.
The problem is listview will push the button out of screen when it have enough rows. So in this case, how to make the button align to bottom of the screen or set the max height for the listview? But when the listview just have 1 or 2 rows, I want the button is right below the listview.
If you want the button to be displayed even though the user is at the top of the list view see other answers, but if you prefer to display the button when the user scrolls to the bottom of the listView use this approach with a footer.
View footer = getLayoutInflater().inflate(R.layout.footer, null);
ListView listView = getListView();
listView.addFooterView(footer);
The footer layout contains the button.
You can have into Linear Layout a ListView and a button with different weight. Something like this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/reportCommentsLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#+id/reportCommentsListView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.9"
android:paddingTop="5dp" >
</ListView>
<Button
android:id="#+id/reportCommnets_Addbutton"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.1"
android:text="Button" />
</LinearLayout>
According to your question, you have to dynamically change the position of your button. From my comment, this is the answer.
Attach listener to your ListView : see https://stackoverflow.com/a/4433294/1377145
In the listener callback, check the visibility of your button :
Rect videoBounds = new Rect();
yourButton.getGlobalVisibleRect(videoBounds);
getGlobalVisibleRect will return true if the button is visible > 0%, false either.
To fix button on the bottom : change the LayoutParams of your button and set alignParentButtom to true. Else set alignParentButtomto false.
bis : depending on your layout, you will have to "move" your button in the view tree with removeView/addView. Don't forget to removeview so the view will not have a parent naymore before adding it to another view.
Additional note : to have a % visibility on your button, you can use the videoBounds.height() and a rule of three :
100 * videoBounds.height() / yourButton.getHeight
EDIT : change answer to match accepted one.
You can make a RelativeLayout with the Button using the rule alignParentBottom=true and the ListView using the rule above. Something like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/button" >
</ListView>
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"/>
Something like this should help:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Add"/>
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/add"
/>
</RelativeLayout>
Sorry, to inject my own personal opinions, but I think a "add more" or :load more button" always be the last view within a ListView.
To answer your question, to achieve what you need, the Listview and the "add row" button should be siblings within a ViewGroup.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<Button
android:layout_width="wrap_content"
android:layout_height="48dp"
android:minHeight="48dp"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
The key point here is that the Button has a fixed height and the ListView takes the rest of the space. The button also aligns to the bottom of the parent view.
Use Relative Layout.
Put the button at the bottom of screen, and set the listView position above him:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:layout_width="match_parent"
android:id="#+id/list"
android:layout_above="#+id/button1"
android:layout_height="wrap_content">
</ListView>
<Button
android:layout_width="match_parent"
android:id="#+id/button1"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content" />
</RelativeLayout>