ListActivity with bottom button - android-layout

Hi I've created a listActivity which contain some rows of data and at the bottom of the screen (not the list) I've put a button.My problem is that in case that my list is full ,and therefore needs to be scrolled in order for the other rows to be seen,the button seems to be transparent and overlapping the last element of the list.So it doesn't seem pleasant to the eye.Do you have any suggestion of how to fix such problem?is there any way for my list to leave some space for the bottom button?I wouldn't like to implement it with footer view.I'll post the xml file so that you can have a clearer picture.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<DragNDrop.DragNDropListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_weight="1" >
</DragNDrop.DragNDropListView>
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:alpha="1"
android:drawableLeft="#drawable/back"
android:text="Return" />
</RelativeLayout>

Try this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:alpha="1"
android:drawableLeft="#drawable/back"
android:text="Return" />
<DragNDrop.DragNDropListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/btn" >
</DragNDrop.DragNDropListView>
</RelativeLayout>
In a RelativeLayout, elements are placed on the top left corner by default, there's no need to specify that for the List

The simplest way is to use LinearLayout with orientation = vertical and ListView with layout_weight = 1 and Button below the ListView.

Put the button first in the relative layout and then set attribute
android:layout_above="#id/btn"
to list view. So the last elements will not be discovered by the button because the height of the list is max height minus button height.

change your xml as shown below
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<DragNDrop.DragNDropListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_above="#id/btn"
android:layout_marginBottom="50dp"
android:layout_weight="1" >
</DragNDrop.DragNDropListView>
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:alpha="1"
android:drawableLeft="#drawable/back"
android:text="Return" />
</RelativeLayout>

Try this one, in this way you will have 10% for the button in the whole view, and 90% for the list view and the button will not overlap the last list element.
<?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="vertical"
android:weightSum="100" >
<ListView
android:id="#+id/android:list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="90" >
</ListView>
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="10"
android:text="Return" />
</LinearLayout>

Related

Why does the ScrollView leave a lot of unnecessary space when scrolling down?

My content should end on a button. That is, the button is the last bottom element.
Since there is a lot of text I had to use ScrollView. And when scrolling down, the button goes up and starts to go empty space.
I tried to set the height of the ScrollView to wrap_content. Nothing has changed.
<androidx.core.widget.NestedScrollView
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"
android:theme="#style/ThemeOverlay.Smoke.FullscreenContainer"
tools:context=".LectureFragment"
android:background="#color/dark_background">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:src="#drawable/day1"
android:layout_weight="20"
android:layout_marginEnd="#dimen/margin_regarding_the_parent"
android:layout_marginStart="#dimen/margin_regarding_the_parent"
android:layout_marginBottom="#dimen/margin_between_something"
android:scaleType="centerInside"
/>
<TextView
android:id="#+id/textView"
android:text="#string/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="#dimen/margin_regarding_the_parent"
android:layout_marginStart="#dimen/margin_regarding_the_parent"
android:layout_weight="10"
android:textColor="#color/white" />
<com.google.android.material.button.MaterialButton
android:text="#string/submit_lecture_rus"
android:layout_width="match_parent"
android:layout_height="#dimen/height_button"
android:layout_marginEnd="#dimen/margin_regarding_the_parent"
android:layout_marginStart="#dimen/margin_regarding_the_parent"
android:layout_marginBottom="#dimen/margin_regarding_the_parent"
android:backgroundTint="#color/coral"
/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
you probably can set the height of the Linear layout to be wrap_content
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:weightSum="100">
...
</LinearLayout>

Automatically Increase layout height and width when view animate to bottom

I have three views(A, B, and C) which are stacked over one another. So when I click on a button the two views (B and C) animate from behind View A and scroll down to the bottom. Now my animation is working fine but the views B and C are extending out of the screen and my screen's height is not increasing.
Here is my layout.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:animateLayoutChanges="true">
<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/trips_menu_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorBackgroundGrey">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="300dp"
android:id="#+id/layout_id_1"
android:layout_margin="8dp"
card_view:contentPadding="8dp"
card_view:cardElevation="16dp">
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="300dp"
android:id="#+id/layout_id_2"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="40dp"
card_view:contentPadding="8dp"
card_view:cardElevation="2dp">
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="300dp"
android:id="#+id/layout_id_3"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:layout_marginTop="40dp"
card_view:contentPadding="8dp"
android:visibility="invisible">
</android.support.v7.widget.CardView>
</RelativeLayout>
</ScrollView>
And my animation is simple translation Y animation.
Any suggestions as to how to increase the height of the layout as the two views animate to the bottom?

android layout - need to match the height of a table row to match width using layout weights

I want to display 18 buttons in a grid 0f 6x3. I am using six table rows and each row has 3 buttons. the width of each button is set to 0dp and given a layout_weight=1.
as the background image I want to use is a circular object I need the width and height of the button to be same! How can I achieve this.
here is the basic xml
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/tableRow">
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/imageButton4"
android:layout_weight="1"
android:background="#drawable/sh_commonroom" />
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/imageButton5"
android:layout_weight="1"
android:background="#drawable/sh_bedroom" />
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/imageButton6"
android:layout_weight="1"
android:background="#drawable/sh_kitchen" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent">
........................
Currently it looks like this.

Unable to right-align text in Android ListView row layout

I am trying to design a ListView row layout with the following:
A check box
An image
3 text items. 2 at the top, 1 at the bottom. Where one of the top text items is right aligned.
An image
It would look something like this:
Chk Img Left aligned small text Right aligned small text Img
Box Btn1 Left aligned medium text Btn2
No matter what I try, I cannot get the right aligned text to work properly. If I put the 2 top text items into a RelativeLayout and set the 2nd one to android:layout_alignParentRight="true" it gets aligned to the edge of the row, overlaying the 2nd image. The following is one of my many attempts:
<?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="wrap_content">
<CheckBox
android:id="#+id/cbSelect"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layout_alignParentLeft="true"/>
<ImageView
android:id="#+id/imgType"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layout_toRightOf="#id/cbSelect"
android:src="#android:drawable/btn_star_big_on"/>
<LinearLayout
android:id="#+id/itmDetails"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layout_toRightOf="#id/imgType"
android:gravity="center_vertical"
android:orientation="vertical"
android:paddingLeft="8dp" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/txtTopLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:textSize="12sp"
android:text="Top Left"/>
<TextView
android:id="#+id/txtTopRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textColor="#android:color/black"
android:textSize="12sp"
android:text="Top Right"/>
</RelativeLayout>
<TextView
android:id="#+id/txtMain"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Main Item Text"
android:textColor="#android:color/black"
android:textSize="16sp" />
</LinearLayout>
<ImageView
android:id="#+id/imgStar"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layout_alignParentRight="true"
android:src="#android:drawable/btn_star"/>
</RelativeLayout>
Any suggestions?

3 Dots after a text that not fit in to the textview size

I have this piece of code:
<?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="100sp"
android:orientation="vertical"
android:id="#+id/linearLayout1">
<TextView
android:id="#+id/click"
android:layout_width="fill_parent"
android:layout_height="30sp"
android:text="Enter the text right over here"
android:textSize="25sp"
android:textColor="#000000"
android:textStyle="bold"
android:onClick="onClick"
android:clickable="true"/>
</LinearLayout>
I need the "Enter the text right over here" text to be written as "Enter the text right..."
(because the text exceeds the width defined.
How can I create that functionallity ?
set your textview as below:
<TextView
android:ellipsize="end"
android:singleLine="true"
android:id="#+id/click"
android:layout_width="fill_parent"
android:layout_height="30sp"
android:text="Enter the text right over here"
android:textSize="25sp"
android:textColor="#000000"
android:textStyle="bold"
android:onClick="onClick"
android:clickable="true"/>
Deprecated:
android:ellipsize="end"
android:singleLine="true"
In Use:
android:ellipsize="end"
android:maxLines="1"
Take a look at the ellipsize property.

Resources