Need help centering an EditText in a Linear Layout - android

I'm trying to center an edittext vertically and horizontally in a linear layout, but it is not working. Very simple problem really.
<?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:background="#drawable/login">
<EditText
android:layout_width="150dp"
android:layout_height="wrap_content"
android:background="#drawable/loginbutton"
android:text="Username"
android:layout_gravity="center"
android:textSize="25dp"
android:gravity="center_horizontal|center_vertical"
android:textColor="#000000"
android:layout_margin="10dp"
android:id="#+id/username">
</EditText>
I'll try changing to a relativelayout in the mean time.

LinearLayout do not support centering in the direction it stacks items as far as I know. Unless the LinearLayout is crucial (which in your case it shouldn't be, as you also need the centering), I would recommend you switch to a RelativeLayout.
With a RelativeLayout, you can set the attribute android:layout_centerInParent="true" on the EditText to get it centred.

Using gravity affects the gravity of the contents of said UI item, this means (in this case) that the text inside the EditText would be centered. In order to center the UI item itself you need to define layout_gravity as this is the gravity a UI item holds within his parent. The code posted by the OP will do the horizontal center but not the vertical center.
As an alternative you can use RelativeLayout
<?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"
android:background="#drawable/login"
android:orientation="vertical" >
<EditText
android:id="#+id/username"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#drawable/loginbutton"
android:layout_centerInParent="true"
android:text="Username"
android:textColor="#000000"
android:textSize="25dp" >
</EditText>
</RelativeLayout>

It is very simple. Add android:gravity="center" with the linear layout.
<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"
android:orientation="vertical"
android:gravity="center"
>

Try this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/login"
android:layout_centerVertical="true"
android:layout_centerInParent="true">

Related

Align objects into middle of layout

I am dealing with ADK and I have a problem. I use LinearLayout, and I want to put my objects into middle and center of layout.
Here is my 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">
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal|center_vertical"
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal|center_vertical"
<Button
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal|center_vertical"
<Button
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal|center_vertical"
</LinearLayout>
Still it goes to the TOP CENTER or to left. Should I use something else instead of LinearLayout? Or is there special code for centering and middling?
Thank you for helping!
Note: Unnecessary parts are removed.
You can use RelativeLayout with nested LinearLayout. Put all your view into LinearLayout without applying centering and set centerInParent="true".
But in your case just remove layout_gravity attribute from your views and add gravity="center" to the root view.
And also you forget to close your view's tags;)
So the final layout will be something like this:
<?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:gravity="center"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
You should consider these things
Because LinearLayout just adds views one by one, your LinearLayout android:layout_width and android:layout_height should be "fill_parent" to show your views correctly
android:layout_gravity should be "center_horizontal|center_vertical"
Try adding android:layout_weight for your objects

not whole list item is clickable in the ListView

Yes I read this question. No it didn't help.
The problem is that only the highlighted area of my ListView cell is clickable. It is the area that is filled with text. Take a look on the picture:
So when you click on the circled area - it wouldn't respond.
Any ideas on how to make it work properly???
Edit: my list layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp">
<ImageView
android:id="#+id/shoulderLogo"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="20dp"
android:layout_marginTop="5dp">
</ImageView>
<TextView
android:id="#+id/shoulderLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</TextView>
</LinearLayout>
I'm pretty sure this is because your list layout LinearLayout has a layout_width of wrap_content. This will cause your row to only be as wide as the views contained within. If you set it instead to fill_parent or match_parent it will extend to fill the width of your list.
Try changing to this
<?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="wrap_content"
android:padding="5dp">
<ImageView
android:id="#+id/shoulderLogo"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="20dp"
android:layout_marginTop="5dp">
</ImageView>
<TextView
android:id="#+id/shoulderLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</TextView>

Android ScrollView and buttons at bottom of the screen

I want to implement this: A ScrollView that contains many elements (ImageViews, TextViews, EditTexts etc) and then after the ScrollView some buttons (which are custom ImageViews) that appear always exactly at the bottom of the screen.
If I use the android:fillViewport="true" attribute, then if the elements of the ScrollView are too big to fit in the screen size the buttons get invisible . If I use the android:Weight=1 attribute then the ScrollView gets only 50% of the Screen when the screen is big and it can fit (I want the buttons to take a small percentage, about 10%). If I set the android:Weight to bigger values then the buttons appear very small.
Please help! Maybe it is something simple that I overlooked but I’ve been banging my head for hours!
Just created and tested it. Looks like you want.
<?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:id="#+id/buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:layout_alignParentBottom="true">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Custom Button1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Custom Button2"/>
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/buttons">
<!--Scrollable content here-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="test text"
android:textSize="40dp"/>
</LinearLayout>
</ScrollView>
</RelativeLayout>
<?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">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hallo Welt"
/>
</LinearLayout>
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Go next page"
android:layout_alignParentRight="true" />
</RelativeLayout>
</LinearLayout>
This worked for me. Give the scroll view a weight of 1. Put all the other widgets following the scroll view in a layout. The scroll view will grow enough to not block the rest.
Widgets in scroll view and rest at bottom
scrollview cannot fit the screen because you put it on a linear layout, so linear layout fit in the screen,
just try to make scrollview as root elemen on xml layout
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<!-- Here you can put some XML stuff and BOOM! your screen fit to scrollview -->
</LinearLayout>
</ScrollView>
If you do not want to use RelativeLayout, it is better to use LinearLayout. This method is better in my opinion.
Just set the layout_weight to one

how to set a button at a fixed location on the bottom of UI?

I want a button to appear at fixed location all the time, in the footer of the UI ؟ ( always, if it has components above it or not )
Please take one Relative layout under your main layout . Set its height and width as fill parent and set its gravity as bottom and put any textview or any button you want in it.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="bottom">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Bottom Gravity" />
</RelativeLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Without Gravity" />
</LinearLayout>
</FrameLayout>
It depends on the layout you are using.
On a RelativeLayout there is
android:layout_alignParentBottom="true"
On a LinearLayout, place it at the bottom and make sure to set the elements layout_weight properly.
Also, check the property
android:layout_gravity
and notice it's different than
android:gravity
Set android:layout_gravity="bottom". Hope this helps.
Put
android:layout_alignParentBottom="true"
in your relative layout.
if any one have two button you can just make this it orks for me
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="bottom">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom" >
<android.support.v7.widget.AppCompatButton
android:id="#+id/btn_yes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp"
android:text="Valider"/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/btn_no"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp"
android:text="Annuler"/>
</LinearLayout>
</RelativeLayout>`

Android: EditText next to ImageView - EditText as wide as possible

I'd like to have an EditText and an ImageView next to each other; the ImageView has a fixed width, the EditText should take the rest.
I try to do it via
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<EditText android:id="#+id/edit_select_stop" android:layout_width="fill_parent" android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:layout_gravity="center_vertical"
android:layout_width="39dp" android:minWidth="39dp"
android:layout_height="wrap_content" android:src="#drawable/icon_time"
android:id="#+id/image_select_time"></ImageView>
</LinearLayout>
</LinearLayout>
But now, the EditText takes the whole width and covers the Image.
How can I achieve that EditText "ends" before the ImageView?
You can also use RelativeLayout to accomplish it. Simply assign the properties
android:layout_toLeftOf="#+id/id_of_your_imageview"
android:layout_width="fill_parent"
to the EditText and
android:layout_alignParentRight="true"
to your ImageView while keeping the fixed value of the width.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/widget32"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<EditText
android:id="#+id/edit_select_stop"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
>
</EditText>
<ImageView
android:id="#+id/image_select_time"
android:layout_width="39dp"
android:layout_height="wrap_content"
android:layout_weight="1"
>
</ImageView>
</LinearLayout>
Well I dont recommend to go for the relative layout..
for the code (2nd one) seems good but I'd like to add that you should set the gravity android:gravity="center_vertical"
This aligns the components and makes it look good for sure

Categories

Resources