Develop Reference

How to make Android xml Linerlayout at the bottom of the activity in Android Studio?

How do I make LinearLayout in Android Studio at the bottom of the page. The result from the code below
I want the highlighted darken layout to be at the bottom of the page.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
tools:context=".MainPage"
android:orientation="vertical"
android:background="#ffffff">
<Button
android:id="#+id/taptoscan"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:layout_width="120dp"
android:layout_height="120dp"
android:background="#drawable/barcode"
android:layout_gravity="center"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tap to Scan"
android:fontFamily="#font/antic"
android:layout_gravity="center"
android:textSize="18sp"/>
<!--here is the layout i want to put at the bottom of the page-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#color/colorPrimaryDark"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</RelativeLayout>
</LinearLayout>
In the above code I tried the below and did not worked.
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom"

You can use RelativeLayout at the outside. Something like this, and then ADD new one LinearLayout after that.
<?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"
android:background="#ffffff"
android:orientation="vertical"
tools:context=".MainPage">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/taptoscan"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="center"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:background="#drawable/barcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/antic"
android:text="Tap to Scan"
android:textSize="18sp" />
</LinearLayout>
<!--here is the layout i want to put at the bottom of the page-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#color/colorPrimaryDark"
android:gravity="bottom"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>

Use Frame Layout as base layout to do it in the best way, it's gonna work definitely
Just use layout_gravity="bottom" in the LinearLayout which you want at bottom and
Just like this :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:background="#ffffff"
android:orientation="vertical"
tools:context=".MainPage">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/taptoscan"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_gravity="center"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:background="#drawable/barcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fontFamily="#font/antic"
android:text="Tap to Scan"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_gravity="bottom"
android:background="#color/colorPrimaryDark"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</FrameLayout>

The approach below would help you achieve your design specifications with zero overlappings. Basically, there are four key steps:
Change your root layout to a RelativeLayout.
Inside the RelativeLayout, add a LinearLayout that would contain your Button and your TextView.
Inside the same RelativeLayout, add the LinearLayout that you intend to pin to the bottom of the screen.
Make sure yoU set the first LinearLayout on top of the second by using the android:layout_above="" attribute.
Now, here's the code:
<?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"
tools:context=".MainPage">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#ffffff"
android:layout_above="#+id/bottomView">
<Button
android:id="#+id/taptoscan"
android:layout_marginTop="40dp"
android:layout_marginBottom="10dp"
android:layout_width="120dp"
android:layout_height="120dp"
android:background="#drawable/barcode"
android:layout_gravity="center"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tap to Scan"
android:fontFamily="#font/antic"
android:layout_gravity="center"
android:textSize="18sp"/>
</LinearLayout>
<!--here is the layout i want to put at the bottom of the page-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:id="#+id/bottomView"
android:background="#color/colorPrimaryDark"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:gravity="bottom">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
I hope this helps.

Issue creating a ListView menu in Xamarin/Android

I'm having trouble creating a simple menu of links in Xamarin. The desired layout is an image header, the list of links, and a button at the bottom to close the menu. I'm using a ListView to display the links.
My layout displays as desired in the Visual Studio Designer, but when run on the emulator or an actual Android device, the ListView takes up the entire screen and the header and footer aren't visible. I've tried everything I can think of, including several different layouts, and always get the same result.
My XAML is below. Help?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/linearLayout1">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/topLayout">
<Toolbar
android:minHeight="?android:attr/actionBarSize"
android:background="?android:attr/colorPrimary"
android:minWidth="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toolbar1">
<ImageView
android:src="#drawable/logo1"
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="1.0dp"
android:layout_gravity="center" />
</Toolbar>
</LinearLayout>
<ListView
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:id="#+id/android.r."
android:background="#ffffffff" />
<LinearLayout
android:orientation="vertical"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout2">
<Toolbar
android:minHeight="?android:attr/actionBarSize"
android:background="#ffff8902"
android:minWidth="25px"
android:layout_width="match_parent"
android:layout_height="35dp"
android:id="#+id/toolbar3"
android:layout_alignParentBottom="true"
android:layout_marginTop="0.0dp">
<Button
android:text="^"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/menuCloser"
android:layout_gravity="center"
android:layout_marginLeft="0.0dp"
android:layout_marginRight="0.0dp"
android:textSize="40dp"
android:background="?android:attr/selectableItemBackground"
android:ems="1"
android:onClick="OnCloseMenu"
android:shadowColor="#android:color/transparent"
android:textColor="#ffffffff" />
</Toolbar>
</LinearLayout>
</LinearLayout>

In your list if you have more items then you have to scroll to get to the bottom to see the footer. Visual studio designer will show you the sample list with less items so that you can see header and footer. If you want footer to be placed in a fixed i.e you don't want to scroll then use relative layout.

Just replace your listview tag by
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/android.r."
android:background="#ffffffff" />
1> Issue was in your android:layout_height="0dp" it should be 0dp if you are using weight.
2> My suggestion is to use RecyclerView of android as you will face many inconsistency in ListView
3> Your code need to be cleanup as i think you are new to android
So as suggestion i just removed some unused properties,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/linearLayout1">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/topLayout">
<Toolbar
android:background="?android:attr/colorPrimary"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:id="#+id/toolbar1">
<ImageView
android:src="#drawable/ic_back"
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
</Toolbar>
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/android.r."
android:background="#ffffffff" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout2">
<Toolbar
android:minHeight="?android:attr/actionBarSize"
android:background="#ffff8902"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toolbar3"
>
<Button
android:text="^"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/menuCloser"
android:layout_gravity="center"
android:layout_marginLeft="0.0dp"
android:layout_marginRight="0.0dp"
android:textSize="40dp"
android:background="?android:attr/selectableItemBackground"
android:ems="1"
android:onClick="OnCloseMenu"
android:shadowColor="#android:color/transparent"
android:textColor="#ffffffff" />
</Toolbar>
</LinearLayout>
</LinearLayout>

Android how to place a layout on top of two layouts

The layout should be align half on 1st layout bottom and half on second layouts top, i didn't got any clue on my searching. anyone help me!]1

This would work correct across all resolutions -
<?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="5">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="3"
android:background="#000000" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#000000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#000000" />
</LinearLayout>
<LinearLayout
android:layout_width="150dp"
android:layout_height="100dp"
android:layout_centerInParent="true"
android:background="#color/colorAccent" />
</RelativeLayout>
</LinearLayout>

So I went ahead and tried this out, and managed to do something like this..
Here is a simple code to help you:
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="5">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="3"
android:background="#000000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#000000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#000000" />
</LinearLayout>
<LinearLayout
android:layout_width="150dp"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="50dp"
android:background="#color/colorAccent" />
</RelativeLayout>
For more information regarding how to use a RelativeLayout, you can check the Official Android Developers Site - RelativeLayout.
Hope this helps.

Image view not centered in parent though layout_centerHorizontal is set to true

Why is my image view (orange) not centered in the horizontal linear layout (blue) even though its layout_centerHorizontal is set to true:
<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="match_parent" android:orientation="vertical"
tools:context=".MainActivity" tools:deviceIds="wear_square"
android:weightSum="1">
<TextView android:id="#+id/text" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="#string/hello_square" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#6dbdff"
android:layout_weight="0.30"
android:weightSum="1">
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/imageView"
android:layout_centerHorizontal="true"
android:background="#ff5831"
android:layout_weight="0.37" />
</LinearLayout>
</LinearLayout>

You cannot use layout_centerHorizontal for a child of a Linear layout... this is the proper implementation. Notice how i use the gravity attribute. (the one you're using would work if it was a direct child of a RelativeLayout
(Edit to work...)
<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="match_parent" android:orientation="vertical"
tools:context=".MainActivity" tools:deviceIds="wear_square"
android:weightSum="1">
<TextView android:id="#+id/text" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="HELLO" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#6dbdff"
android:layout_weight="0.30"
android:weightSum="1">
<View android:layout_width="0dp" android:layout_height="10dp"
android:layout_weight="0.315"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/imageView"
android:background="#ff5831"
android:layout_weight="0.37" />
</LinearLayout>
</LinearLayout>
Alternative, in case you don't want to put things on either side of the image...
<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="match_parent" android:orientation="vertical"
tools:context=".MainActivity" tools:deviceIds="wear_square"
android:weightSum="1">
<TextView android:id="#+id/text" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="HELLO" />
<FrameLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#6dbdff"
android:layout_weight="0.30"
android:weightSum="1">
<ImageView
android:layout_width="200dp"
android:layout_height="match_parent"
android:id="#+id/imageView"
android:layout_gravity="center_horizontal"
android:background="#ff5831" />
</FrameLayout>
</LinearLayout>

Not sure you need the 2nd LinearLayout, so here goes.
<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="match_parent" android:orientation="vertical"
tools:context=".MainActivity" tools:deviceIds="wear_square"
android:weightSum="1">
<TextView android:id="#+id/text" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="#string/hello_square" />
<ImageView
android:layout_width="wrap_content"
android:src="#ff5831"
android:layout_height="0dp"
android:id="#+id/imageView"
android:layout_gravity="center_horizontal"
android:layout_weight="0.37" />
</LinearLayout>
For now, I'made the src of the image the color you want to see. IF you replace it with an actual bitmap refernce, it will be centered and properly sized based on the bitmap you use and parent restraints
if I delete the android:layout_weight="0.37" line (which was added by
Android Studio) then the image view vanishes, why is that?
With this line, the imageView will know how to size itself based on the parent. Without, because the imageView has no image, so it cannot size itself based on the image bitmap to show (which is missing) and the parent that contains it. Add an image to show and it will come back.
Final advice,
Totally read this article about how android draws views. Its really really great info.

Positioning the image buttons on multiple resolutions, Android

I have some Image Button on AbsoluteLayout, because they need to be placed on some parts on the ImageView.
I want that when I change the screen size resolution, the Image Buttons will stay at the exactly location on the ImageView.
The problem is that if I change the resolution, all the Image Buttons are moving from their places.
Maybe there is a way to place the Image Button without AbsoluteLayout on base of
ratio or percentage from the ImageView, because I know that AbsoluteLayout is not recommanded at all.
Thank you for the help
This is my xml code:
<?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:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context=".G" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/ScrollView1"
android:orientation="horizontal"
android:weightSum="100" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="15"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/ScrollView1"
android:orientation="vertical"
android:weightSum="100" >
<AbsoluteLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_weight="20"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/ScrollView1" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/tvOn"
android:layout_alignParentTop="true"
android:scaleType="fitXY"
android:src="#drawable/t" />
<ImageButton
android:id="#+id/bon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="319dp"
android:layout_y="88dp"
android:src="#drawable/b_blue" />
<ImageButton
android:id="#+id/bo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_x="287dp"
android:layout_y="125dp"
android:src="#drawable/b_blue" />
</AbsoluteLayout>
<TextView
android:id="#+id/tvOn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_weight="80" />
</LinearLayout>
</LinearLayout>
<ScrollView
android:id="#+id/ScrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="85"
android:scrollbars="vertical" >
<LinearLayout
android:id="#+id/rGroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="vertical" >
<ToggleButton
android:id="#+id/bmD"
android:layout_width="match_parent"
android:layout_height="60dp" />
<ToggleButton
android:id="#+id/bmCt"
android:layout_width="match_parent"
android:layout_height="60dp"/>
</LinearLayout>
</ScrollView>
</LinearLayout>
</RelativeLayout>