How can I align views justify in LinearLayout? - android

I want to align two buttons left and right and I'm using layout_weight property width .25 for both of buttons. But when I did it, buttons width are became %50.
This is what I want:
This is what I have:
And this is my XML layout:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<ImageButton
android:id="#+id/like"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".25"
android:textColor="#212121"
android:background="#drawable/button_default"
android:layout_margin="5dp"
android:src="#drawable/like" />
<Button
android:text="NEXT"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:textColor="#FFFFFF"
android:background="#drawable/button_primary"
android:layout_margin="5dp"/>
</LinearLayout>
How can I do this?

Try this code.
<?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="wrap_content"
android:layout_centerInParent="true"
android:weightSum="2">
<ImageButton
android:id="#+id/like"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#mipmap/ic_launcher"
android:src="#mipmap/ic_launcher"
android:textColor="#212121" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#mipmap/ic_launcher"
android:text="NEXT"
android:textColor="#FFFFFF" />
</LinearLayout>
</RelativeLayout>

Do it 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="wrap_content"
android:orientation="horizontal">
<ImageButton
android:id="#+id/like"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:background="#drawable/button_default"
android:src="#drawable/like"
android:textColor="#212121" />
<Space
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/button_primary"
android:text="NEXT"
android:textColor="#FFFFFF" />
</LinearLayout>
or 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="wrap_content">
<ImageButton
android:id="#+id/like"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_margin="5dp"
android:background="#drawable/button_default"
android:src="#drawable/like"
android:textColor="#212121" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_margin="5dp"
android:background="#drawable/button_primary"
android:text="NEXT"
android:textColor="#FFFFFF" />
</RelativeLayout>

Related

Android Image View does not start from top

I have two linear layouts placed side by side. The right side layout contains an image strip. The problem is the image does not start from top, there is unwanted bottom margin appearing as well, creating unnecessary scrolling.
Best would be if there is no unnecessary scrolling at all. There are more buttons at the left side. Right side image may be clipped.
Here is my code
<?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:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="2"
android:orientation="vertical" >
<TextView
android:id="#+id/textViewCaption"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:text="This is my Application"
android:textSize="40sp" />
<Button
android:id="#+id/btnOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button One"
android:textSize="#dimen/home_sub_caption_height" />
<Button
android:id="#+id/btnTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Two"
android:textSize="25sp" />
<Button
android:id="#+id/btnThree"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Three"
android:textSize="25sp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageViewLogo"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:src="#drawable/qutub" />
</LinearLayout>
</LinearLayout>
</ScrollView>
in the ImageView use
android:layout_height="wrap_content"
instead of
android:layout_height="match_parent"
I guess it would work for you.
If you don't need scroll then remove the ScrollView
<?xml version="1.0" encoding="utf-8"?><?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="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="2"
android:orientation="vertical">
<TextView
android:id="#+id/textViewCaption"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:text="This is my Application"
android:textSize="40sp" />
<Button
android:id="#+id/btnOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button One" />
<Button
android:id="#+id/btnTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Two"
android:textSize="25sp" />
<Button
android:id="#+id/btnThree"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Three"
android:textSize="25sp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageViewLogo"
android:layout_width="match_parent"
android:scaleType="fitXY"
android:layout_height="match_parent"
android:src="#drawable/profile" />
</LinearLayout>
</LinearLayout>
<?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:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="2"
android:orientation="vertical" >
<TextView
android:id="#+id/textViewCaption"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:text="This is my Application"
android:textSize="40sp" />
<Button
android:id="#+id/btnOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button One"
/>
<Button
android:id="#+id/btnTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Two"
android:textSize="25sp" />
<Button
android:id="#+id/btnThree"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Three"
android:textSize="25sp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageViewLogo"
android:layout_width="250dp"
android:layout_height="250dp"
android:layout_weight="1"
android:src="#drawable/profile" />
</LinearLayout>
</LinearLayout>
</ScrollView>
Add this attribute in ImageView
android:scaleType="fitStart"
Hope this helps!
Try it set Imageview layout_gravity="top" and layout_height="wrap_content"
<?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:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="3">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical">
<TextView
android:id="#+id/textViewCaption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:text="This is my Application"
android:textSize="40sp" />
<Button
android:id="#+id/btnOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button One"
android:textSize="25sp" />
<Button
android:id="#+id/btnTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Two"
android:textSize="25sp" />
<Button
android:id="#+id/btnThree"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:text="Button Three"
android:textSize="25sp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageView
android:id="#+id/imageViewLogo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/qutub"
android:layout_gravity="top"/>
</LinearLayout>
</LinearLayout>
</ScrollView>

LinearLayout (vertical) putt 2 Buttons side by side and more buttons below

I have some little problems at creating some buttons. I want to Place 2 Buttons side by side (worked) and more (exp. 3 Buttons) below in a LinearLayout. Actually everything is working for me but if I put another Button the button is below but above there is free space.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<LinearLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center">
<Button
android:id="#+id/button1"
android:text="Button1"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button2"
android:text="Button2"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="100dp" />
<Button
android:id="#+id/button3"
android:text="Button3"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
Thats how it looks like atm.
first make the width of each button 0dp.
second make the margin bottom equal in the 3 buttons
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<LinearLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center">
<Button
android:id="#+id/button1"
android:text="Button1"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button2"
android:text="Button2"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button3"
android:text="Button3"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_centerHorizontal="true"
android:id="#+id/layout_one">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button 1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button 2"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/layout_one"
android:layout_centerHorizontal="true">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button 3"
/>
</LinearLayout>
</RelativeLayout>
This is the screenshot of pic:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<LinearLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center">
<Button
android:id="#+id/button1"
android:text="Button1"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button2"
android:text="Button2"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button3"
android:text="Button3"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
Update your xml with this one, Hope it helps you
here is your code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<LinearLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center">
<Button
android:id="#+id/button1"
android:text="Button1"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button2"
android:text="Button2"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
<Button
android:id="#+id/button3"
android:text="Button3"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton"
android:layout_weight="1"
android:layout_marginLeft="5dp"
android:layout_marginBottom="200dp" />
</LinearLayout>
</ScrollView>
Just make android:layout_marginBottom="200dp" /> in 2nd button.
This is happening because You have gave the centre gravity to LinearLayout.
The solution is only that you just remove that gravity tag and run again
Replace this
<LinearLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center">
to this
<LinearLayout
android:orientation="horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent">
If you want to place the 3 buttons below each other, you should set the orientation of your LinearLayout to vertical instead of horizontal. This will display your buttons in a vertical order.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<LinearLayout
android:orientation="vertical"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:gravity="center">
<Button
android:id="#+id/button1"
android:text="Button1"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton" />
<Button
android:id="#+id/button2"
android:text="Button2"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton" />
<Button
android:id="#+id/button3"
android:text="Button3"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/mybutton" />
</LinearLayout>
</ScrollView>
</RelativeLayout>

Align 2 linear layouts and image view inside Relative layout

I am working on an android app where I want to align 2 linear layouts in a row with image view in between these 2 layouts.I am not able to use android studio layout editor to achieve this.
Code for the layout is:
<?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"
android:background="#android:color/white"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/nav_header_container"
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#color/colorPrimary">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/rounded_corner"
android:orientation="vertical"
android:layout_marginEnd="17dp"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true">
<TextView
android:text="DEFG"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView8"
android:layout_gravity="center"
/>
<TextView
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView16"
tools:text="1250"
android:textSize="30sp"
android:textColorLink="?attr/colorBackgroundFloating" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/rounded_corner"
android:layout_marginEnd="30dp"
android:layout_toStartOf="#+id/profile_image">
<TextView
android:text="ABCD"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView3"
android:layout_gravity="center"
/>
<TextView
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView13"
tools:text="1250"
android:textSize="30sp"
android:textColorLink="?attr/colorBackgroundFloating" />
</LinearLayout>
<ImageView
android:id="#+id/profile_image"
android:layout_width="60dp"
android:src="#drawable/face"
android:layout_height="60dp"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawerList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"/>
</LinearLayout>
Current Output:
Expected Output:
2 linear layouts in a row with Image view at the center of a relative layout (With Green background)
Am I doing something wrong with the arrangement of layout? How to implement such scenario?
Change the RelativeLayout to LinearLayout (Horizontal)
set width to 0dp and weight to 1 thus they will have the same width. And use gravity to put things in the center
<?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"
android:background="#android:color/white"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/nav_header_container"
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#color/colorPrimary">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#drawable/rounded_corner"
android:orientation="vertical"
android:layout_marginEnd="17dp"
android:layout_weight="1"
android:gravity="center">
<TextView
android:text="DEFG"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView8"
android:layout_gravity="center"
/>
<TextView
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView16"
tools:text="1250"
android:textSize="30sp"
android:textColorLink="?attr/colorBackgroundFloating" />
</LinearLayout>
<ImageView
android:id="#+id/profile_image"
android:layout_width="0dp"
android:src="#drawable/rounded_corner"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:layout_gravity="center" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/rounded_corner"
android:layout_marginEnd="30dp"
android:layout_weight="1"
android:gravity="center">
<TextView
android:text="ABCD"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView3"
android:layout_gravity="center"
/>
<TextView
android:text="TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView13"
tools:text="1250"
android:textSize="30sp"
android:textColorLink="?attr/colorBackgroundFloating" />
</LinearLayout>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawerList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"/>
</LinearLayout>
By using weight to the LinearLayout you can achieve this.
Check this code, but before copy pasting learn the logic of weight in LinearLayout:
<?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"
android:background="#android:color/white"
android:orientation="vertical">
<LinearLayout
android:id="#+id/nav_header_container"
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#ffffff"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="4"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#drawable/rounded_corner" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="DEFG" />
<TextView
android:id="#+id/textView16"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView8"
android:layout_centerHorizontal="true"
android:text="TextView"
android:textColorLink="?attr/colorBackgroundFloating"
android:textSize="30sp"
tools:text="1250" />
</RelativeLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_weight="2"
android:gravity="center">
<ImageView
android:id="#+id/profile_image"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:src="#drawable/face" />
</LinearLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="4"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#drawable/rounded_corner" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="ABCD" />
<TextView
android:id="#+id/textView13"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView3"
android:layout_centerHorizontal="true"
android:text="TextView"
android:textColorLink="?attr/colorBackgroundFloating"
android:textSize="30sp"
tools:text="1250" />
</RelativeLayout>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawerList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp" />
</LinearLayout>

How to remove Irregularity in layout of items in listview in android?

This is how the cart screen looks like. The layout changes as per the length of item name.
I want to keep a fixed ratio for all columns in the listview and at the same time, keep the size of button fixed.
How to achieve this ?
Below is the Screenshoot and layout code:
]1
Layout file:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*"
android:background="#ffffff">
<TableRow>
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/cartlist_layout"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/t1"
android:textStyle="normal|bold"
android:padding="5dip"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/t2"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/t2"
android:padding="5dip"
android:textStyle="normal|bold"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/t2"
android:id="#+id/t3"
android:textStyle="normal|bold" />
<Button
android:layout_width="5dp"
android:layout_height="50dp"
android:id="#+id/button6"
android:background="#drawable/delete1" />
</TableRow>>
</TableLayout>
Edit1: The Listview layout code:
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/fragment_mycart">
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/listView1" />
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_margin="16dp"
android:clickable="true"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:background="#color/colorPrimary"
app:backgroundTint="#android:color/holo_orange_light"
app:borderWidth="0dp"
app:elevation="6dp"
app:fabSize="normal"
app:srcCompat="#drawable/cart" />
</RelativeLayout>
You can use a LinearLayout as root view of the item instead of TableLayout. You can add weights to the views inside the LinearLayout.
<?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="horizontal"
android:background="#ffffff">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:id="#+id/t1"
android:textStyle="normal|bold"
android:padding="5dip"
android:maxLines="1"
android:ellipsize="end" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/t2"
android:padding="5dip"
android:textStyle="normal|bold" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_weight="1"
android:id="#+id/t3"
android:textStyle="normal|bold" />
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button6"
android:background="#drawable/delete1" />
</LinearLayout>
</LinearLayout>
Note : You may want to adjust the weights a bit.
Use LinearLayout instead
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:id="#+id/t1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dip"
android:text="text1"
android:textStyle="normal|bold" />
<TextView
android:id="#+id/t2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dip"
android:text="text2"
android:textStyle="normal|bold" />
<TextView
android:id="#+id/t3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dip"
android:text="text3"
android:textStyle="normal|bold" />
<Button
android:id="#+id/button6"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#android:drawable/ic_input_add" />
</LinearLayout>

Two button one close to other at the bottom of RelativeLayout - Android

I am facing a problem with android layout.
I have a relative layout with a textview and an image overlapped and I would like to add two button at the bottom of the view, one close to other and that fill all the width of the view. Here below the manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
android:orientation="vertical"
android:id="#+id/RecordAccelDataLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_gravity="center"
android:longClickable="false"
android:layout_width="283dp"
android:layout_height="418dp"
android:src="#mipmap/bg_thand"
android:adjustViewBounds="false"
android:alpha="0.1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rectangle">
<TextView
android:textSize="20sp"
android:gravity="center_horizontal"
android:id="#+id/rec_progress_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:text="#string/title_activity_record_accel_data"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.adrenergic.tremorsense.circleGraph
android:layout_gravity="center"
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<TextView
android:textSize="20sp"
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/recording"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textIsSelectable="true"
/>
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:id="#+id/back"
android:layout_height="50dp"
android:text="#string/back"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:onClick="goBack"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:text="#string/stats"
android:onClick="goBack"
android:id="#+id/stats"
android:layout_marginBottom="3dip"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/back"/>
</RelativeLayout>
</LinearLayout>
</FrameLayout>
The layout appears in this way.
I would like that the two button appear in the same position but centered and that they fill equally the view in width.
Hope you will help me.
Can u modify your button layout impl. with the below sample and try.
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="1">
<Button
android:textColor="#ffffff"
android:layout_width="0dp"
android:id="#+id/back"
android:layout_weight="0.5"
android:layout_height="50dp"
android:text="#string/back"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:onClick="goBack"/>
<Button
android:textColor="#ffffff"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="0.5"
android:layout_gravity="center"
android:text="#string/stats"
android:onClick="goBack"
android:id="#+id/stats"
android:layout_marginBottom="3dip"/>
</LinearLayout>
Hi you can put buttons in linear layout and align parent bottom:
<?xml version="1.0" encoding="utf-8"?>
<ImageView
android:layout_width="283dp"
android:layout_height="418dp"
android:layout_gravity="center"
android:adjustViewBounds="false"
android:alpha="0.1"
android:longClickable="false"
android:src="#mipmap/bg_thand" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rectangle"
android:orientation="vertical">
<TextView
android:id="#+id/rec_progress_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:gravity="center_horizontal"
android:text="#string/title_activity_record_accel_data"
android:textSize="20sp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.adrenergic.tremorsense.circleGraph
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center" />
<TextView
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/recording"
android:textIsSelectable="true"
android:textSize="20sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="#+id/back"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:layout_weight="1"
android:onClick="goBack"
android:text="#string/back"
android:textColor="#ffffff" />
<Button
android:id="#+id/stats"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:layout_toRightOf="#+id/back"
android:layout_weight="1"
android:onClick="goBack"
android:text="#string/stats"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
check this it will help.
android:weight is what you may be looking for. Enclose the two buttons inside a linear layout and add android:weight =1 for both of them. An example would be :
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<Button android:id="#+id/button1"
...
android:layout_weight="1"/>
<View
android:id="#+id/space"
...
android:layout_weight=".1"/>
<Button android:id="#+id/button2"
...
android:layout_weight="1"/>
</LinearLayout>
You need to add spacer in in center bottom and align two button to that spacer like this :
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.adrenergic.tremorsense.circleGraph
android:layout_gravity="center"
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<TextView
android:textSize="20sp"
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textIsSelectable="true"
/>
//Aligh Space in center with align to bottom
and set relation of two button to this spacer
<Space
android:layout_width="1px"
android:layout_height="1px"
android:layout_above="#+id/back"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:id="#+id/space"/>
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:id="#+id/back"
android:layout_height="50dp"
android:text="Back"
android:layout_gravity="center"
android:onClick="goBack"
android:layout_alignParentBottom="true"
android:layout_alignStart="#+id/accelText"/>
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:text="Status"
android:onClick="goBack"
android:id="#+id/stats"
android:layout_alignParentBottom="true"
android:layout_toStartOf="#+id/space"/>
</RelativeLayout>
Use this layout changes made with Button added inside Linear Layout and filled it with weight with android:gravity="bottom" and android:orientation="horizontal".
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RecordAccelDataLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="283dp"
android:layout_height="418dp"
android:layout_gravity="center"
android:adjustViewBounds="false"
android:alpha="0.1"
android:longClickable="false"
android:src="#drawable/common_ic_googleplayservices" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/common_ic_googleplayservices"
android:orientation="vertical">
<TextView
android:id="#+id/rec_progress_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:gravity="center_horizontal"
android:text="Progress"
android:textSize="20sp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.adrenergic.tremorsense.circleGraph
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center" />
<TextView
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="REcording"
android:textIsSelectable="true"
android:textSize="20sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
android:orientation="horizontal"
android:weightSum="1">
<Button
android:id="#+id/back"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_weight="0.50"
android:onClick="goBack"
android:text="Back"
android:textColor="#ffffff" />
<Button
android:id="#+id/stats"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_weight="0.50"
android:onClick="goBack"
android:text="Stats"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</FrameLayout>

Categories

Resources