Properly adjusting space between two textviews in RelativeLayout - android

I have been editing my relativelayout all day, but I cannot produce a screen that is desirable.
Currently it looks like this :
It is not centered and there is a very awkward space between the hour time and the minutes time.
I am trying to figure out how to fix it so it is centered similar to this app except I include the little h and m.
I have done a lot of research and used almost every positioning view in Relative Layout, but still cannot produce it.
Properly aligning TextViews in RelativeLayout
This is my xml file. Not sure what to do I feel like I have exhausted all my options.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:seekarc="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<FrameLayout
android:id="#+id/seekArcContainer"
android:layout_width="350dp"
android:layout_height="wrap_content"
>
</FrameLayout>
<include
layout="#layout/controls"
android:id="#+id/controls" />
<com.triggertrap.seekarc.SeekArc
android:id="#+id/seekArc"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_gravity="center_horizontal|bottom"
seekarc:thumb="#drawable/custom_seek_arc_control_selector"
android:padding="30dp"
seekarc:rotation="0"
seekarc:startAngle="0"
seekarc:sweepAngle="360"
seekarc:touchInside="true"
seekarc:arcColor="#30ff5b56"
seekarc:progressColor="#ffff3a35"
android:layout_below="#+id/seekArcContainer"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/hour_progress_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#color/red_highlight"
android:text="00"
android:textSize="90sp"
android:layout_toStartOf="#+id/little_hour_text2"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/minute_progress_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#color/red_highlight"
android:text="00"
android:textSize="90sp"
android:layout_toStartOf="#+id/little_minute_text2"
android:layout_alignTop="#+id/hour_progress_number"
android:layout_toLeftOf="#+id/little_minute_text2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="H"
android:textSize="24sp"
android:id="#+id/little_hour_text2"
android:textColor="#color/red_highlight"
android:layout_toStartOf="#+id/minute_progress_number"
android:layout_marginRight="45dp"
android:layout_alignBottom="#+id/hour_progress_number"
android:layout_toLeftOf="#+id/minute_progress_number" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="M"
android:textSize="24sp"
android:id="#+id/little_minute_text2"
android:textColor="#color/red_highlight"
android:layout_marginRight="36dp"
android:layout_alignRight="#+id/seekArc"
android:layout_alignEnd="#+id/seekArc"
android:layout_alignBottom="#+id/minute_progress_number" />
</RelativeLayout>


try this code, may this xml help you..you can take idea from this. if any problem, then ask...
<?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_horizontal"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="300dp"
android:layout_height="300dp" >
<com.triggertrap.seekarc.SeekArc
android:id="#+id/seekArc"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_centerInParent="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00"
android:textSize="60sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="H"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00"
android:textSize="60sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="M"
android:textSize="30sp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>


what you are looking for is here in the 2nd answer (not the accepted answer). You use a strut in the middle of the two views.
this is the example given in the answer:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View android:id="#+id/strut"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerHorizontal="true"/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignRight="#id/strut"
android:layout_alignParentLeft="true"
android:text="Left"/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/strut"
android:layout_alignParentRight="true"
android:text="Right"/>
</RelativeLayout>

Related

how to get image icon to align right in a Linear Layout?

I know there are lots of threads with more or less same topic but none of them covers my situation:
I have a little garbage can for the delete button but it always disappears off the screen if the line of the text is too long and if its too short it's attached to the line and I just wanted to be on the right hand side of the app like the the Add_item button but since it is in a Linear Layout it does not work
ativity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.owner.test24.MainActivity">
<TextView
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/header"
android:gravity="center_vertical"
android:textColor="#color/accent"
android:textSize="24sp" />
<ImageButton
android:id="#+id/add_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:layout_alignEnd="#+id/header"
android:layout_alignRight="#+id/header"
android:src="#drawable/add_item_button"
android:contentDescription="#string/add_item"/>
<ListView
android:id="#+id/todo_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/header"/>
</RelativeLayout>
to_do_item_layout.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"/>
<ImageButton
android:id="#+id/btnDel"
android:src="#drawable/ic_delete_button"
android:background="#android:color/transparent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Delete"
/>
if someone has solution please let me know.

use it, it works on every screen size
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:weightSum="1">
<CheckBox
android:id="#+id/checkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.03"/>
<TextView
android:id="#+id/item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hhhhh"
android:gravity="center_horizontal"
android:textSize="20sp"
android:layout_weight="0.87"/>
<ImageButton
android:id="#+id/btnDel"
android:src="#drawable/delete_icon"
android:background="#android:color/transparent"
android:layout_width="wrap_content"
android:layout_gravity="end|center_vertical"
android:layout_height="wrap_content"
android:text="Delete"
android:layout_weight="0.1" />
</LinearLayout>

Try below one
<TextView
android:id="#+id/item"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="20sp"/>
Hopes it will solve your problem. :)

Add layout_gravity tag
android:layout_gravity="right"

Use Weight:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weighSum= "1">
<CheckBox
android:id="#+id/checkBox"
android:layout_width="0dip"
android:layout_height="wrap_content"
amdroid: layout_weight="0.2"
/>
<ImageButton
android:id="#+id/btnDel"
android:src="#drawable/ic_delete_button"
android:background="#android:color/transparent"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:text="Delete"
amdroid: layout_weight="0.2"
/>

relative layout gravity center not aligning correctly

I'm trying to center the chilldren of my relative layout in the center of my screen but it's acting like it's aligned to the top of the parent and I can't figure out why.
my .XML:
<?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:layout_gravity="center"
android:gravity="center"
android:background="#f70909">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:src="#drawable/dice"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textMessage"
android:layout_centerHorizontal="true"
android:layout_below="#+id/imageView2" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_below="#+id/textMessage" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:layout_centerHorizontal="true"
android:gravity="center"
android:layout_below="#+id/editUserSplash" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash"
android:layout_centerHorizontal="true"
android:layout_below="#+id/editPasswordSplash" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/prgSplash"
style="#android:style/Widget.DeviceDefault.ProgressBar.Large"
android:layout_centerHorizontal="true"
android:indeterminate="true"
android:layout_below="#+id/btnSplash" />
</RelativeLayout>
I've tried making the parent a relativelayout without success and it won't align to the bottom either. Initially I thought the layout wasn't filling the whole screen but since its height and width are match_parent I don't think that's the problem. in android studio it is displaying correctly though so I must be missing something small.
I also tried using the gravity and layoutgravity parameters and a combination of the two but without success
Edit: I need the views to stay in the same formation relative to each other but centered in the screen vertically.
Edit 2:I set the background of the RelativeLayout to red and got this: So the relativelayout isn't filling my screen.
Edit 3:
Edit 4:

try 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="match_parent"
android:background="#f70909">
<RelativeLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:src="#drawable/dice"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textMessage"
android:layout_centerHorizontal="true"
android:layout_below="#+id/imageView2" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_below="#+id/textMessage" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:layout_centerHorizontal="true"
android:gravity="center"
android:layout_below="#+id/editUserSplash" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash"
android:layout_centerHorizontal="true"
android:layout_below="#+id/editPasswordSplash" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/prgSplash"
style="#android:style/Widget.DeviceDefault.ProgressBar.Large"
android:layout_centerHorizontal="true"
android:indeterminate="true"
android:layout_below="#+id/btnSplash" />
</RelativeLayout>
</RelativeLayout>

Try something 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="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:layout_centerInParent="true"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:layout_centerInParent="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textMessage" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:gravity="center" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:gravity="center" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/prgSplash"
style="#android:style/Widget.DeviceDefault.ProgressBar.Large"
android:indeterminate="true" />
</LinearLayout>
</RelativeLayout>
UPDATE:
If setting the xml in an AlertDialog, it's possible that there is a space allotted at the bottom. I google and found this alert_dialog.xml for reference. It seems that there is a buttonPanel at the bottom with a minimum height of 54dip.
<LinearLayout android:id="#+id/buttonPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="54dip"
android:orientation="vertical" >
<LinearLayout
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="4dip"
android:paddingStart="2dip"
android:paddingEnd="2dip"
android:measureWithLargestChild="true">
<LinearLayout android:id="#+id/leftSpacer"
android:layout_weight="0.25"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:visibility="gone" />
<Button android:id="#+id/button1"
android:layout_width="0dip"
android:layout_gravity="start"
android:layout_weight="1"
style="?android:attr/buttonBarButtonStyle"
android:maxLines="2"
android:layout_height="wrap_content" />
<Button android:id="#+id/button3"
android:layout_width="0dip"
android:layout_gravity="center_horizontal"
android:layout_weight="1"
style="?android:attr/buttonBarButtonStyle"
android:maxLines="2"
android:layout_height="wrap_content" />
<Button android:id="#+id/button2"
android:layout_width="0dip"
android:layout_gravity="end"
android:layout_weight="1"
style="?android:attr/buttonBarButtonStyle"
android:maxLines="2"
android:layout_height="wrap_content" />
<LinearLayout android:id="#+id/rightSpacer"
android:layout_width="0dip"
android:layout_weight="0.25"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:visibility="gone" />
</LinearLayout>
</LinearLayout>

I think this may help you
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:gravity="center">
<RelativeLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:textStyle="bold"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/textMessage"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<EditText
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:layout_below="#+id/textMessage"
android:gravity="center" />
<EditText
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:layout_below="#+id/editUserSplash"
android:gravity="center" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash"
android:layout_below="#+id/editPasswordSplash"
android:layout_centerHorizontal="true" />
</RelativeLayout>

Thanks to ank I was able to figure out that the reason why the RelativeLayout didn't fill my screen is that I used it in an alertDialog. So RelativeLayouts parent isn't the screen but the alertDialog. Since an alertDialog wraps its content it doesn't fill the entire screen.

Android ScrollView not scrolling at all

Below is my XML code, I want the whole view to scroll, but it's just not working, please help, with what's wrong;
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/app_icon"
android:layout_marginTop="20dp"
android:layout_gravity="center_horizontal"/>
<TextView
android:id="#+id/textView_app_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_gravity="center"/>
<TextView
android:id="#+id/textView_content"
android:layout_width="match_parent"
android:layout_marginTop="15dp"
android:layout_height="386dp"
android:gravity="center"></TextView>
</LinearLayout>
</ScrollView>
I've tried using,
android:fillViewport="true"
but of no help.

A ScrollView is a FrameLayout, meaning you should place one child in it containing the entire contents to scroll; this child may itself be a layout manager with a complex hierarchy of objects.
So here you have to take LinearLayout or RelativeLayout and then you have to put different hierarchy of component.
Android : buttons not visible in scrollview
here i have given answer of Some problem so you can follow this for solve your problem with clearing your concept.

Try like this ,Scrolling will work till End
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/app_icon"
android:layout_marginTop="20dp"
android:layout_gravity="center_horizontal"/>
<TextView
android:id="#+id/textView_app_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_gravity="center"/>
<TextView
android:id="#+id/textView_content"
android:layout_width="match_parent"
android:layout_marginTop="15dp"
android:layout_height="386dp"
android:gravity="center"/>
</LinearLayout>
</ScrollView>
</Relativelayout>

If ScrollView fits to your device screen it would not be scrollable, so make sure content inside ScrollView takes space larger than your screen size.

systematix Try this,here you getting scroll.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
</LinearLayout>

why is my relativeLayout doesn't appear below its sibling linearLayout?

I have the following xml
<?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"
android:background="#color/blue_bg">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical" >
<com.my.view.text.MyTextView
android:id="#+id/whyResgisterHeaderText"
style="#style/textOnBg"
android:layout_marginTop="25dp"
android:text="WHY REGISTER?"
android:textStyle="bold" />
<com.my.view.text.MyTextView
android:id="#+id/whyResgisterBodyText"
style="#style/textOnBg"
android:text="Help us keep your account safe"
android:textStyle="normal" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="5dp"
android:src="#drawable/signup_illu_why" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:id="#+id/gotItButton"
android:layout_width="250dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:background="#drawable/btn_selector"
android:padding="0dp" />
<com.my.view.text.MyTextView
android:id="#+id/gotItText"
style="#style/textOnBg"
android:layout_marginTop="25dp"
android:text="Got it"
android:textColor="#00bcfe"
android:textSize="16dp"
android:textStyle="italic" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#70a5b3" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<com.my.view.text.MyTextView
style="#style/textOnBg"
android:layout_toLeftOf="#+id/skipIcon"
android:text="Skip"
android:textStyle="normal" />
<ImageView
android:id="#id/skipIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/signup_skip_icon" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
I want my screen to look like:
but it looks like:
1) why cannot I see the fotter relativeLayout (with the "skip")
2) how can I center the gotItText textView? why isn't it center with current properties?

Because your root layout is a RelativeLayout.
You should declare an ID for the first LinearLayout, and then use layout_below property on the second one. Remember, their positions are relatives so if you don't specify the location of the second Linear, it will be paint over the first one.
If you want to get one linear below the other automatically use a LinearLayout as main root.

Edited you code, replaced the custom EditTexts, and removed the styles, set new heights to the layout and it seems to be working as 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="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:id="#+id/whyResgisterHeaderText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:text="WHY REGISTER?"
android:textStyle="bold" />
<TextView
android:id="#+id/whyResgisterBodyText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Help us keep your account safe"
android:textStyle="normal" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="5dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:id="#+id/gotItButton"
android:layout_width="250dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:padding="0dp" />
<TextView
android:id="#+id/gotItText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:text="Got it"
android:textColor="#00bcfe"
android:textSize="16dp"
android:textStyle="italic" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#70a5b3" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/skipIcon"
android:text="Skip"
android:textStyle="normal" />
<ImageView
android:id="#id/skipIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>

Alignment of an Android layout

I have this layout file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<RelativeLayout
android:id="#+id/visual_compass_container"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_margin="0dp"
android:padding="0dp" >
<ImageView
android:id="#+id/visual_compass"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:contentDescription="#string/visual_compass"
android:scaleType="fitCenter"
android:src="#drawable/compass_1000x1000_white" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/visual_compass_value"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/visual_compass_value_default"
android:textColor="#ddd"
android:textSize="#dimen/visual_compass_value_text_size" />
<TextView
android:id="#+id/visual_compass_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/measured_bearing"
android:textColor="#aaa"
android:textSize="#dimen/visual_compass_info_text_size" />
</LinearLayout>
</RelativeLayout>
<View
android:id="#+id/placeholder"
android:layout_width="25dp"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/visual_compass_container"
android:visibility="visible"
android:background="#android:color/darker_gray" />
<LinearLayout
android:id="#+id/advanced_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/placeholder"
android:background="#dfff"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingLeft="30dp"
android:paddingRight="10dp"
android:paddingTop="10dp"
android:visibility="visible" >
<TextView
android:id="#+id/advanced_measured"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/measured_bearing_default"
android:textSize="#dimen/advanced_measured_text_size_land" />
<TextView
android:id="#+id/advanced_latitude"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/latitude_default"
android:textIsSelectable="true"
android:textSize="#dimen/advanced_info_text_size_land" />
<TextView
android:id="#+id/advanced_longitude"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/longitude_default"
android:textIsSelectable="true"
android:textSize="#dimen/advanced_info_text_size_land" />
<TextView
android:id="#+id/advanced_altitude"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/longitude_default"
android:textIsSelectable="true"
android:textSize="#dimen/advanced_info_text_size_land" />
<TextView
android:id="#+id/advanced_accuracy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/accuracy_default"
android:textIsSelectable="true"
android:textSize="#dimen/advanced_info_text_size_land" />
<TextView
android:id="#+id/advanced_declination"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/declination_default"
android:textIsSelectable="true"
android:textSize="#dimen/advanced_info_text_size_land" />
<TextView
android:id="#+id/advanced_inclination"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:text="#string/inclination_default"
android:textIsSelectable="true"
android:textSize="#dimen/advanced_info_text_size_land" />
</LinearLayout>
</RelativeLayout>
And the result (API level 17, Galaxy S3) is this:
The Result http://xml.pfweb.eu/a.png
As you can see above, I didn't set any margins or paddings... So why is there an empty space between the placeholder view (dark grey) and the compass rose image?
That's a big problem because it causes the '46°' not the center correctly.

I am unuable to see why the relative layout doesn't wrap it's content, however to have the text in the center you could do following:
<ImageView
android:id="#+id/visual_compass"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:contentDescription="#string/visual_compass"
android:scaleType="fitCenter"
android:src="#drawable/compass_1000x1000_white" />
So instead of having the compass image in top left corner using:
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
you would simply center it. I know it's not ideal, but it's the only solution I see at the moment.
EDIT: I didn't figure out what exactly causes the problem, but it has something to do with the enclosing Relative layout. As soon as I change the layout to Linear the problem disappear. In fact horizontal LinearLayout is probably the best option here as you stack your items from left to right.
Here's final look:

Categories

Resources