Extra space added between widgets when image is right aligned - android

I am trying the following layout,in that I want to shift image to right but because linear layout is vertically oriented extra spaces are added between textview and image.
I dont want to use Relative layout because I am editing someone else's code and it is just the part of the code.
<LinearLayout
android:id="#+id/llSpouse"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginTop="10dp"
android:background="#android:color/darker_gray" />
<TextView
android:id="#+id/tv_spouse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:text="SPOUSE"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold" />
<com.ypomumbai.utills.CircularNetworkImageView
android:id="#+id/iv_picture"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="right"
android:layout_alignParentRight="true"
android:src="#android:drawable/ic_menu_info_details" />
<TextView
android:id="#+id/tvSpouseFirstName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:text="First Name"
android:textStyle="bold" />
<TextView
android:id="#+id/tvSpouseLastName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_name"
android:layout_marginLeft="10dp"
android:text="Last Name" />
<TextView
android:id="#+id/tvSpousedesignation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_last_name"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:text="MD and CEO" />
<TextView
android:id="#+id/tvSpouseCompnayName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_designation"
android:layout_marginLeft="10dp"
android:text="Text" />
</View>
</LinearLayout>
Can anyone help on this.
How to shift image to right without getting extra spaces.

In Vertical linear layout every view will occupy the total row space. So add the margin bottom property to your com.ypomumbai.utills.CircularNetworkImageView with the height of that view.(negative margin will remove the space occupied by this view)
<com.ypomumbai.utills.CircularNetworkImageView
android:id="#+id/iv_picture"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:layout_marginBottom="-80dp"
android:src="#android:drawable/ic_menu_info_details" />

I don't really understand if you don't want to use a RelativeLayout at all, but I post a sample of code that should work with a relative layout and without breaking the rest :
<LinearLayout
android:id="#+id/llSpouse"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginTop="10dp"
android:background="#android:color/darker_gray"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_spouse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:text="SPOUSE"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/tvSpouseFirstName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:text="First Name"
android:textStyle="bold"/>
<TextView
android:id="#+id/tvSpouseLastName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_name"
android:layout_marginLeft="10dp"
android:text="Last Name"/>
<TextView
android:id="#+id/tvSpousedesignation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_last_name"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:text="MD and CEO"/>
<TextView
android:id="#+id/tvSpouseCompnayName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_designation"
android:layout_marginLeft="10dp"
android:text="Text"/>
</LinearLayout>
<ImageView
android:id="#+id/iv_picture"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:src="#android:drawable/ic_menu_info_details"/>
</RelativeLayout>
</LinearLayout>
which renders the following :
EDIT
You can have the same render without RelativeLayout with the following xml :
<LinearLayout
android:id="#+id/llSpouse"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginTop="10dp"
android:background="#android:color/darker_gray"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_weight="4"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/tv_spouse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:text="SPOUSE"
android:textColor="#android:color/black"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/tvSpouseFirstName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:text="First Name"
android:textStyle="bold"/>
<TextView
android:id="#+id/tvSpouseLastName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="Last Name"/>
<TextView
android:id="#+id/tvSpousedesignation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:text="MD and CEO"/>
<TextView
android:id="#+id/tvSpouseCompnayName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="Text"/>
</LinearLayout>
<ImageView
android:id="#+id/iv_picture"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="right"
android:src="#android:drawable/ic_menu_info_details"/>
</LinearLayout>
</LinearLayout>

Related

How to place a Textview to the right and center of the Imageview in Relative Layout

I want to place a textview to the right and gravity centre of the Image View. I am using Relative Layout for that. Using Relative Layout, i am able to set the Textview to the right side of the Image view.But not able to set it to the centre. I mean here center is not inside of the Imageview, i want to place Textview to the right centre of Imageview(outside centre of Imageview).I am not able to set to centre.
Anybody please help me out.I want to do this only in relative layout.
Here is my xml,
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:layout_width="match_parent">
<TextView
android:id="#+id/name_text_view"
android:textSize="20sp"
android:layout_toRightOf="#id/image_view"
android:layout_width="wrap_content"
android:textColor="#color/black"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"/>
<ImageView
android:id="#+id/image_view"
android:layout_marginLeft="30dp"
android:layout_width="50dp"
android:layout_height="50dp"/>
<Button
android:id="#+id/button"
android:layout_centerHorizontal="true"
android:background="#color/blue"
android:textColor="#color/color_white"
android:layout_marginTop="20dp"
android:layout_below="#id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/val_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:layout_marginTop="20dp"
android:textSize="18sp"
android:layout_centerHorizontal="true"
android:layout_below="#id/button"/>
</RelativeLayout>
You can do it with this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="60dp">
<ImageView
android:id="#+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="center"
android:src="#drawable/ic_launcher_background" />
<TextView
android:id="#+id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/image_view"
android:layout_centerInParent="true"
android:text="hello world"
android:textColor="#color/black"
android:textSize="12sp" />
</RelativeLayout>
Use this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:layout_width="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<ImageView
android:id="#+id/image_view"
android:layout_marginLeft="30dp"
android:layout_width="50dp"
android:layout_height="50dp"/>
<TextView
android:id="#+id/name_text_view"
android:textSize="20sp"
android:layout_toRightOf="#id/image_view"
android:layout_width="wrap_content"
android:textColor="#color/black"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"/>
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_centerHorizontal="true"
android:background="#color/blue"
android:textColor="#color/color_white"
android:layout_marginTop="20dp"
android:layout_below="#id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/val_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:layout_marginTop="20dp"
android:textSize="18sp"
android:layout_centerHorizontal="true"
android:layout_below="#id/button"/>
</RelativeLayout>
You can add this in your textview
android:layout_centerInParent="true"
Do You want this view? then try this 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"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:layout_width="match_parent">
<LinearLayout
android:id="#+id/leaner1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/image_view"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="30dp"
android:contentDescription="TODO"
app:srcCompat="#mipmap/ic_launcher" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:orientation="horizontal">
<TextView
android:id="#+id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name:"
android:textColor="#android:color/black"
android:textSize="20sp" />
<TextView
android:id="#+id/val_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Value"
android:textColor="#android:color/black"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/leaner1"
android:layout_marginTop="1dp"
android:background="#android:color/holo_blue_dark"
android:text="button"
android:textColor="#android:color/white" />
</RelativeLayout>

Table layout xml for leaderboard template - Android

I'm trying to create a layout for a user leader-board but I don't know how to make every "row" equal in proportion.
Here's the list of users:
And this is the code of the child layout (that populates a recyclerview):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/topUsersLeaderboardItem_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="12"
android:orientation="horizontal"
android:paddingBottom="#dimen/margin_extra_small"
android:paddingTop="#dimen/margin_extra_small">
<TextView
android:id="#+id/topUsersLeaderboardItem_position"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:paddingStart="#dimen/margin_small"
android:textColor="#color/colorBlack"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:textSize="#dimen/font_size_small"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="8">
<RelativeLayout
android:id="#+id/topUsersLeaderboardItem_layoutPicUser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<ImageView
android:id="#+id/topUsersLeaderboardItem_userIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:src="#drawable/circular_profile"
app:srcCompat="#drawable/circular_profile" />
<TextView
android:id="#+id/topUsersLeaderboardItem_userInitial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal|center"
android:text="U"
android:textSize="#dimen/font_size_medium"/>
</RelativeLayout>
<TextView
android:id="#+id/topUsersLeaderboardItem_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal"
android:text="uername"
android:textColor="#color/colorBlack"
android:layout_marginStart="8dp"
android:layout_toEndOf="#+id/topUsersLeaderboardItem_layoutPicUser"
android:textSize="#dimen/font_size_small"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/topUsersLeaderboardItem_scoreLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2"
android:gravity="end">
<TextView
android:id="#+id/topUsersLeaderboardItem_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:text="150"
android:textSize="#dimen/font_size_small"
android:textColor="#color/colorBlack" />
<ImageView
android:id="#+id/topUsersLeaderboardItem_starImage"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="false"
android:layout_centerVertical="true"
android:layout_marginEnd="#dimen/margin_small"
android:layout_toEndOf="#+id/topUsersLeaderboardItem_score"
android:src="#drawable/ic_star_yellow_24dp"
app:srcCompat="#drawable/ic_star_yellow_24dp" />
</RelativeLayout>
As you can see from the picture, the space taken by the numbers on the left increases when I would like it to be fixed. Is there a way to make this sort of "table layout"? Thanks everybody!
Actually, it is because of android:layout_width="wrap_content"
of first TextView, give it some predefined value like android:layout_width="10dp". Don't forget to remove gravity from TextView.
please use this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/topUsersLeaderboardItem_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="12"
android:orientation="horizontal"
android:paddingBottom="#dimen/margin_extra_small"
android:paddingTop="#dimen/margin_extra_small">
<TextView
android:id="#+id/topUsersLeaderboardItem_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="0"
android:paddingStart="#dimen/margin_small"
android:textColor="#color/colorBlack"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:textSize="#dimen/font_size_small"/>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="8">
<RelativeLayout
android:id="#+id/topUsersLeaderboardItem_layoutPicUser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<ImageView
android:id="#+id/topUsersLeaderboardItem_userIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:src="#drawable/circular_profile"
app:srcCompat="#drawable/circular_profile" />
<TextView
android:id="#+id/topUsersLeaderboardItem_userInitial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal|center"
android:text="U"
android:textSize="#dimen/font_size_medium"/>
</RelativeLayout>
<TextView
android:id="#+id/topUsersLeaderboardItem_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal"
android:text="uername"
android:textColor="#color/colorBlack"
android:layout_marginStart="8dp"
android:layout_toEndOf="#+id/topUsersLeaderboardItem_layoutPicUser"
android:textSize="#dimen/font_size_small"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/topUsersLeaderboardItem_scoreLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2">
<TextView
android:id="#+id/topUsersLeaderboardItem_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:text="150"
android:textSize="#dimen/font_size_small"
android:textColor="#color/colorBlack" />
<ImageView
android:id="#+id/topUsersLeaderboardItem_starImage"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="false"
android:layout_centerVertical="true"
android:layout_marginEnd="#dimen/margin_small"
android:layout_toEndOf="#+id/topUsersLeaderboardItem_score"
android:src="#drawable/ic_star_yellow_24dp"
app:srcCompat="#drawable/ic_star_yellow_24dp" />
</RelativeLayout>

How to set 4 RelativeLayout Horizontally and Adjust automatically according to screen size

Please Refer to screen shot.
Now my Problem is
i have make a xml design that is like in screenshot.
i have 4 relative layout contains imageview and textview.
now i want to set these 4 relative layout horizontally with equal space from right,left,start,end.
In my layout when it go on big screen the start and end showing extra space,i know i have set it like that.
But Is there any solution to set these RLs automatic adjust there size according to screen size.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/one"
android:id="#+id/RL_MainCat"
android:background="#color/white"
android:layout_marginTop="10dp">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/RL_UploadPres"
android:layout_marginLeft="10dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/upload_pres_icon"
android:id="#+id/icon_uploadpres"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Upload\nPrescription"
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp"
android:layout_below="#+id/icon_uploadpres"
android:layout_marginTop="10dp"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/RL_UploadPres"
android:id="#+id/RL_FindPharmacy"
android:layout_marginLeft="20dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/find_pharma_icon"
android:id="#+id/icon_findphar"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Find \n Pharmacy "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp"
android:layout_below="#+id/icon_findphar"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/RL_FindPharmacy"
android:id="#+id/RL_BuyOTC"
android:layout_marginLeft="20dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/otc_icon"
android:id="#+id/icon_findotc"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Buy \n OTC "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp"
android:layout_below="#+id/icon_findotc"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/RL_BuyMedicine"
android:layout_toRightOf="#+id/RL_BuyOTC"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/medicine_icon"
android:id="#+id/icon_findmedi"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Buy \n Medicines "
android:textColor="#1f222d"
android:textSize="11sp"
android:textAlignment="center"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:layout_below="#+id/icon_findmedi"
/>
</RelativeLayout>
</RelativeLayout>
Try this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RL_MainCat"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/one"
android:layout_marginTop="10dp"
android:background="#ffffff">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="4"
android:orientation="horizontal">
<RelativeLayout
android:id="#+id/RL_UploadPres"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp">
<ImageView
android:id="#+id/icon_uploadpres"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#mipmap/ic_launcher" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/icon_uploadpres"
android:layout_marginTop="10dp"
android:text="Upload\nPrescription"
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RL_FindPharmacy"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_weight="1"
android:layout_toRightOf="#+id/RL_UploadPres">
<ImageView
android:id="#+id/icon_findphar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#mipmap/ic_launcher" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/icon_findphar"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text=" Find \n Pharmacy "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RL_BuyOTC"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/RL_FindPharmacy">
<ImageView
android:id="#+id/icon_findotc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#mipmap/ic_launcher"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/icon_findotc"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text=" Buy \n OTC "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RL_BuyMedicine"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_weight="1"
android:layout_marginRight="10dp"
android:layout_toRightOf="#+id/RL_BuyOTC">
<ImageView
android:id="#+id/icon_findmedi"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#mipmap/ic_launcher" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/icon_findmedi"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text=" Buy \n Medicines "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
Below Output
Use the relative layouts inside a Linear Layout having horizontal Orientation with Weightsum 4 or 1. and give each relative layout a weight of 1 or .25
Inside Relative layout width is set to 0dp so that the Layout will divide the Width equally when the weight is added
Use Scalable SP (ssp) and Scalable DP (sdp) instead of sp and dp so that the Dimenssions will be adjusted automatically too
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".25">
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".25">
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".25">
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".25">
</RelativeLayout>
</LinearLayout>
Try this:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/one"
android:id="#+id/RL_MainCat"
android:background="#color/white"
android:layout_marginTop="10dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true">
<RelativeLayout
android:layout_weight="0.25"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/RL_UploadPres"
android:layout_marginLeft="10dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/upload_pres_icon"
android:id="#+id/icon_uploadpres"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Upload\nPrescription"
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp"
android:layout_below="#+id/icon_uploadpres"
android:layout_marginTop="10dp"
/>
</RelativeLayout>
<RelativeLayout
android:layout_weight="0.25"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/RL_UploadPres"
android:id="#+id/RL_FindPharmacy"
android:layout_marginLeft="20dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/find_pharma_icon"
android:id="#+id/icon_findphar"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Find \n Pharmacy "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp"
android:layout_below="#+id/icon_findphar"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_weight="0.25"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/RL_FindPharmacy"
android:id="#+id/RL_BuyOTC"
android:layout_marginLeft="20dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/otc_icon"
android:id="#+id/icon_findotc"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Buy \n OTC "
android:textAlignment="center"
android:textColor="#1f222d"
android:textSize="11sp"
android:layout_below="#+id/icon_findotc"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
<RelativeLayout
android:layout_weight="0.25"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/RL_BuyMedicine"
android:layout_toRightOf="#+id/RL_BuyOTC"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/medicine_icon"
android:id="#+id/icon_findmedi"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Buy \n Medicines "
android:textColor="#1f222d"
android:textSize="11sp"
android:textAlignment="center"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:layout_below="#+id/icon_findmedi"
/>
</LinearLayout>
</RelativeLayout>

Android. ScrollView doesn't scroll first time, but then when content changed it does

I have my views in a scroll view so that if the content is bigger than the screen size, the user can scroll down. I have noticed a weird thing.
The first time the content comes up, it doesn't scroll. However, when the user changes a setting and the content of the views which are inside the scroll view reloads it does become scrollable.
Why is this? Is it clear what I mean?
EDIT: This only happens on my Nexus 5X. But when I used a Samsung J10 it works right away.
My XML is a relative layout, with a child element of the scroll view, which contains other views.
Here is my xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/content_home"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.apps.reuven.egertandcohentravel.Activities.HomeActivity"
tools:showIn="#layout/activity_home">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ProgressBar
android:layout_width="50dp"
android:id="#+id/progressBar"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:visibility="gone"
/>
<TextView
android:id="#+id/textViewLinkToOrder"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click here to book travel insurance."
android:textColor="#color/colorPrimary"
android:layout_centerHorizontal="true"
android:textSize="24sp"
android:gravity="center"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/buttons_linear_layout"
android:orientation="horizontal"
android:layout_below="#id/textViewLinkToOrder">
<Button
android:layout_width="200dp"
android:id="#+id/choose_country_button"
android:onClick="onChooseCountryButtonClick"
android:layout_height="wrap_content"
android:text="Choose country"
android:layout_marginLeft="5dp"
android:background="#color/colorPrimary"
android:layout_weight="1"
android:textColor="#ffff"
android:layout_marginRight="5dp"
android:layout_below="#id/textViewLinkToOrder"
android:layout_centerHorizontal="true"/>
<Button
android:layout_width="200dp"
android:layout_weight="1"
android:background="#color/colorPrimary"
android:textColor="#fff"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:id="#+id/automatic_country_button"
android:layout_height="wrap_content"
android:text="My Location"
android:layout_below="#id/choose_country_button"
android:layout_centerHorizontal="true"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/linearLayoutAllDetails"
android:layout_below="#id/buttons_linear_layout"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="No country yet selected"
android:gravity="center"
android:id="#+id/textView_coumtry_name"
android:textColor="#000000"
android:textSize="30sp"
android:padding="5dp"
android:textStyle="bold"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
>
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/police"/>
<TextView
android:textSize="17sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Police"
android:textColor="#000000"
android:layout_gravity="center_vertical" />
<TextView
android:layout_marginLeft="10dp"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/police_text_view"
android:text=""
android:textColor="#000000"
android:layout_gravity="center_vertical"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
/>
<ImageView
android:id="#+id/police_phone_button"
android:layout_width="30dp"
android:layout_gravity="center_vertical"
android:layout_height="30dp"
android:src="#android:drawable/sym_action_call"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/ambulance"/>
<TextView
android:textSize="17sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ambulance"
android:textColor="#000000"
android:layout_gravity="center_vertical" />
<TextView
android:layout_marginLeft="10dp"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/ambulance_text_view"
android:text=""
android:textColor="#000000"
android:layout_gravity="center_vertical"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
/>
<ImageView
android:layout_width="30dp"
android:layout_gravity="center_vertical"
android:layout_height="30dp"
android:src="#android:drawable/sym_action_call"
android:id="#+id/ambulance_phone_button"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/israel_consulate"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:textSize="17sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Israel Consulate"
android:textColor="#000000"
android:layout_gravity="center_vertical" />
<TextView
android:layout_marginLeft="10dp"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/israel_consulate_text_view"
android:text=""
android:textColor="#000000"
android:layout_gravity="center_vertical"/>
</LinearLayout>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
/>
<ImageView
android:layout_width="30dp"
android:layout_gravity="center_vertical"
android:layout_height="30dp"
android:src="#android:drawable/sym_action_call"
android:id="#+id/israel_phone_button"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/chabad"/>
<LinearLayout
android:layout_width="250dp"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:textSize="17sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Beit Chabad"
android:textColor="#000000"
android:layout_gravity="center_vertical" />
<TextView
android:layout_marginLeft="10dp"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/chabad_address_text_view"
android:text="3 Blue Street, USA"
android:textColor="#000000"
android:layout_gravity="center_vertical"/>
<TextView
android:layout_marginLeft="10dp"
android:textSize="17sp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/chabad_number_text_view"
android:text="+44 456 3245234"
android:textColor="#000000"
android:layout_gravity="center_vertical"/>
</LinearLayout>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
/>
<ImageView
android:layout_width="30dp"
android:layout_gravity="center_vertical"
android:layout_height="30dp"
android:src="#android:drawable/sym_action_call"
android:id="#+id/chabad_phone_button"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</ScrollView>
Thanks very much, I can't figure this one out.
I also had the same problem and by adding a TableLayout inside ScrollView solved the problem for me. Then, add your content (RelativeLayout) inside TableLayout.
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="1">
<-- Your RelativeLayout goes here -->
</TableLayout>
</ScrollView>
Let me know if that solved the problem. Do not forget to add the attribute fillViewport=true to ScrollView so the TableLayout match it's parent's view width and height.

How to align textView on layout center without conflict with other view?

I have an issue trying align textView to the center of layout: when I try to do this - it has a conflict with a button on the left - if text is too long - it become hidden under the button. Text length can be very different and I need it in the center of layout but not under/on the button.
Here is the xml file of activity layout:
<?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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/item_content_action_bar_layout"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#color/colorBlue"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:autoText="false"
android:layout_centerInParent="true"
android:layout_alignWithParentIfMissing="false"
android:layout_alignParentRight="false" />
<ImageButton
android:layout_width="120dp"
android:layout_height="45dp"
android:id="#+id/item_content_back_button"
android:background="#drawable/back_button_selector"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginRight="5dp" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/item_content_scroll_view"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:fillViewport="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="125dp"
android:layout_height="125dp"
android:id="#+id/item_content_image"
android:src="#drawable/ic_no_thumbnail"
android:maxHeight="125dp"
android:maxWidth="125dp"
android:layout_alignParentLeft="false"
android:layout_alignParentStart="true"
android:layout_margin="10dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_subtitle"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Subtitle"
android:layout_alignTop="#+id/item_content_image"
android:layout_toRightOf="#+id/item_content_image"
android:layout_toEndOf="#+id/item_content_image"
android:textSize="20dp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_pubdate"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Date"
android:layout_below="#+id/item_content_subtitle"
android:layout_alignLeft="#+id/item_content_subtitle"
android:layout_alignStart="#+id/item_content_subtitle"
android:textSize="10dp"
android:layout_marginTop="10dp" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="blabla"
android:layout_below="#+id/item_content_pubdate"
android:layout_alignStart="#+id/item_content_pubdate"
android:layout_alignParentStart="true"
android:layout_margin="10dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Try using LinearLayout with layout-weight for this to avoid conflict. Change your first relativelayout to below one
<LinearLayout
android:id="#+id/item_content_action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/_white"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="7">
<ImageButton
android:id="#+id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="2"
android:background="#drawable/chemist" />
<TextView
android:id="#+id/item_content_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="5"
android:autoText="false"
android:gravity="center"
android:maxLines="2"
android:singleLine="true"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#color/Black"
android:textStyle="bold" />
</LinearLayout>
Change Your RelativeLayout to LinearLayout and use android:layout_weight attribute of layout to do this.
<LinearLayout
android:id="#+id/item_content_action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/_white"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="1"
>
<ImageButton
android:id="#+id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:background="#drawable/chemist" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="1"
android:autoText="false"/>
</LinearLayout>
Make the layout_gravity of the textview item_content_title as "center_horizontal".
And add android:layout_toLeftOf="#+id/item_content_title" under the ImageButton item_content_back_button.
Hope it was what you wanted.
Your Action bar layout has to be like this-
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/item_content_action_bar_layout"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#color/colorBlue"
android:padding="10dp">
<ImageButton
android:layout_width="120dp"
android:layout_height="45dp"
android:id="#+id/item_content_back_button"
android:background="#drawable/back_button_selector"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dp" />
<TextView
android:toRightOf="#id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:autoText="false"
android:layout_centerInParent="true" />
</RelativeLayout>

Categories

Resources