How set Text Align? - android

I want TextView to end at red Line in picture below instead of start line of three blue textviews .
How ?
layout.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="49dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_margin="20dp"
android:id="#+id/relative">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#drawable/progress"
android:id="#+id/imageView"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="50dp"
android:text="Progress"
android:id="#+id/textView"
android:autoText="false"
android:textColor="#1A237E"
android:textSize="#dimen/abc_dialog_padding_top_material"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/textView2"
android:layout_toEndOf="#+id/textView2"
android:gravity="center" />
<TextView
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text=" absolute"
android:id="#+id/textView2"
android:textIsSelectable="true"
android:textSize="#dimen/abc_action_bar_icon_vertical_padding_material"
android:textColor="#FF6D00"
android:gravity="center"
android:layout_alignBottom="#+id/above"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/above"
android:paddingBottom="10dp"
android:background="#ffd8f1ff"
android:padding="5dp"
android:layout_below="#+id/textView"
android:layout_alignRight="#+id/textView"
android:layout_alignEnd="#+id/textView"
android:layout_gravity="right"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text=" percentage"
android:id="#+id/textView4"
android:textSize="#dimen/abc_action_bar_icon_vertical_padding_material"
android:textColor="#FF6D00"
android:gravity="center"
android:layout_below="#+id/textView2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/below"
android:paddingTop="10dp"
android:background="#ffd8f1ff"
android:padding="5dp"
android:layout_below="#+id/above"
android:layout_alignLeft="#+id/above"
android:layout_alignStart="#+id/above"
android:layout_gravity="right" />
<TextView
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text=" goal"
android:id="#+id/textView5"
android:textSize="#dimen/abc_action_bar_icon_vertical_padding_material"
android:textColor="#FF6D00"
android:gravity="center"
android:layout_below="#+id/textView4"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/goal"
android:paddingTop="10dp"
android:background="#ffd8f1ff"
android:padding="5dp"
android:layout_below="#+id/below"
android:layout_alignLeft="#+id/below"
android:layout_gravity="right"
android:layout_alignParentLeft="false" />
thanx in advance .


First, right align your three blue TextViews with the Progress TextView. That way, all the blue TextViews will be right aligned. Then, instead of using layout_gravity=right, use gravity=right. That will right align the text within the blue TextViews. Finally, make all the blue TextViews be to_rightOf textview4, which is the longest TextView. Doing these adjustments will make the layout look like this:
Here's the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/relative"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_margin="20dp"
android:layout_marginTop="49dp">
<ImageView
android:id="#+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"/>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_alignParentTop="true"
android:layout_toEndOf="#+id/textView2"
android:layout_toRightOf="#+id/textView2"
android:autoText="false"
android:gravity="center"
android:text="Progress"
android:textColor="#1A237E"
android:textSize="#dimen/abc_dialog_padding_top_material"/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignBottom="#+id/above"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:gravity="center"
android:text=" absolute"
android:textColor="#FF6D00"
android:textIsSelectable="true"
android:textSize="#dimen/abc_action_bar_icon_vertical_padding_material"/>
<TextView
android:id="#+id/above"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignEnd="#+id/textView"
android:layout_alignRight="#+id/textView"
android:layout_below="#+id/textView"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/textView4"
android:background="#ffd8f1ff"
android:gravity="right"
android:padding="5dp"
android:paddingBottom="10dp"
android:text="18%"
/>
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/textView2"
android:gravity="center"
android:text=" percentage"
android:textColor="#FF6D00"
android:textSize="#dimen/abc_action_bar_icon_vertical_padding_material"/>
<TextView
android:id="#+id/below"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/above"
android:layout_alignRight="#+id/textView"
android:layout_alignStart="#+id/above"
android:layout_below="#+id/above"
android:background="#ffd8f1ff"
android:padding="5dp"
android:paddingTop="10dp"
android:text="12.4%"
/>
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/textView4"
android:gravity="center"
android:text=" goal"
android:textColor="#FF6D00"
android:textSize="#dimen/abc_action_bar_icon_vertical_padding_material"/>
<TextView
android:id="#+id/goal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/below"
android:layout_alignParentLeft="false"
android:layout_alignRight="#id/textView"
android:layout_below="#+id/below"
android:background="#ffd8f1ff"
android:gravity="right"
android:padding="5dp"
android:paddingTop="10dp"
android:text="0%"/>


Instead you can put those two horizontal TextView inside a
LinearLayout and set the LinearLayout below the percentage's TextView. Doing this you can have more customizability with the alignment of the TextView.


In your case this was different than what I normally set it up. But in this case its easier to add
<View
android:layout_width="0dp"
android:layout_alignRight="#+id/textView"
android:layout_alignEnd="#+id/textView"
android:id="#+id/holder"
android:layout_height="0dp"/>
and then for the views you want to align to the right side add
android:layout_toLeftOf="#+id/holder"

Related

Text View Above overrides Text View below it

I have a textView in a list item with another text view below it.
I am facing one problem again and again that when text increases . text view above overrides my text view below or text view below comes on top of text view above.
My XML in RelativeLayout is :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tp_activity_wise_badge_fragment_each_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/tp_White"
android:minHeight="60dp">
<TextView
android:id="#+id/textview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="23dp"
android:layout_marginStart="23dp"
android:text="Loading Title..."
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#737574"
android:textSize="15dp"
android:textStyle="bold" />
<TextView
android:id="#+id/textview3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textview1"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/textview1"
android:layout_centerVertical="true"
android:layout_marginEnd="23dp"
android:layout_marginRight="23dp"
android:background="#color/tp_White"
android:gravity="center_vertical|center_horizontal"
android:maxLines="2"
android:text="Loading..."
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#737574"
android:textSize="15dp" />
<TextView
android:id="#+id/textview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Loading Subtitle..."
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/tp_inactive_channel_text_color"
android:textSize="11dp"
android:layout_below="#+id/textview1"
android:layout_alignLeft="#+id/textview1"
android:layout_alignStart="#+id/textview1" />
i know this is very basic problem but this is very undefined for me and i am not able to position this views such that they dont cut each other.
Any help will be appreciated.

You need to use layout_alignParentRight in your code.
its not proper way you set margin to set view
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tp_activity_wise_badge_fragment_each_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/tp_White"
android:minHeight="60dp">
<TextView
android:id="#+id/textview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Loading Title..."
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#737574"
android:textSize="15dp"
android:textStyle="bold" />
<TextView
android:id="#+id/textview3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/textView1"
android:layout_alignParentRight="true"
android:gravity="right"
android:background="#color/tp_White"
android:maxLines="2"
android:text="Loading..."
android:textColor="#737574"
android:textSize="15dp" />
<TextView
android:id="#+id/textview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Loading Subtitle..."
android:textSize="11dp"
android:layout_below="#id/textview1"
/>

What are you trying to achieve by writing android:layout_alignTop="#+id/textview1" and at same time android:layout_alignBottom="#+id/textview1".
Instead you can try android:layout_below="#+id/textview1" this will align your textview vertically.

You should use LinearLayout (just copy and paste it)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tp_activity_wise_badge_fragment_each_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="25dp"
>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_marginBottom="10dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Loading Title..."
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#737574"
android:textSize="15dp"
android:textStyle="bold" />
<TextView
android:id="#+id/textview3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:text="Loading..."
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#737574"
android:textSize="15dp" />
</LinearLayout>
<TextView
android:id="#+id/textview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Loading Subtitle..."
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="11dp"
/>
</LinearLayout>

Center gravity in ScrollView

Hi I have a problem with centering TextView in ScrollView. I want to center my TextViews with ids hajs, textView01, textView02 vertically in order to be in the center of height of imageViews. It's strange because in the Android Studio design I see everything right, but when I try on device I get these TextViews in the top of the TextView.
<?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">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/scrollView"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:fillViewport="true">
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal" >
<TextView
android:id="#+id/hajs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/imageView1"
android:layout_centerInParent="true"
android:layout_toLeftOf="#+id/imageView1"
android:background="#41BF17"
android:gravity="center_vertical|center|center_horizontal"
android:text="0"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#FFF"
android:textSize="70sp" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:background="#41BF17"
android:gravity="center"
android:text="#string/zaoszczedziles"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#FFF"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView2"
android:adjustViewBounds="true"
android:background="#41BF17"
android:maxWidth="100dp"
android:src="#drawable/moneybag" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/hajs"
android:background="#41BF17"
android:gravity="center"
android:text="#string/dni_bez_papierosow"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#FFF"
android:textStyle="bold" />
<ImageView
android:id="#+id/ImageView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView3"
android:adjustViewBounds="true"
android:background="#41BF17"
android:maxWidth="100dp"
android:src="#drawable/calendar" />
<TextView
android:id="#+id/TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/ImageView01"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/hajs"
android:layout_alignTop="#+id/ImageView01"
android:layout_centerInParent="true"
android:background="#41BF17"
android:gravity="center"
android:text="0"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#FFF"
android:textSize="70sp" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>

Group components with layouts

My goal is to have my chart side by side with my other components.
Iv tried so many hours with different layouts but I cant get it to be side by side.
My idea was to group all components except the chart in one layout and the chart in another, then just put them side by side. But I cant get it to work.
This is how it looks now:
With the code as of now:
<?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:paddingLeft="#dimen/activity_horizontal_margin"
android:id="#+id/mainLayout"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<com.github.mikephil.charting.charts.PieChart
android:id="#+id/pieChartLineLayout"
android:layout_width="150dp"
android:layout_height="200dp" />
<SeekBar
android:layout_width="150dp"
android:layout_height="15dp"
android:id="#+id/seekBar"
android:thumbTint="#color/orange"
android:maxHeight="4dip"
android:minHeight="4dip"
android:layout_marginTop="60dp"
android:layout_below="#+id/pieChartLineLayout"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<SeekBar
android:layout_width="150dp"
android:layout_height="15dp"
android:id="#+id/seekBar2"
android:maxHeight="4dip"
android:minHeight="4dip"
android:thumbTint="#color/red"
android:layout_below="#+id/textView4"
android:layout_alignRight="#+id/textView2"
android:layout_alignEnd="#+id/textView2" />
<SeekBar
android:layout_width="150dp"
android:layout_height="15dp"
android:maxHeight="4dip"
android:minHeight="4dip"
android:thumbTint="#color/blue"
android:id="#+id/seekBar3"
android:layout_below="#+id/textView5"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="0%"
android:textColor="#FFFFFF"
android:background="#drawable/rounded_corner_orange"
android:id="#+id/textView"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:layout_marginBottom="16dp"
android:layout_alignBottom="#+id/seekBar"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Carbohydrates"
android:id="#+id/textView2"
android:textStyle="bold"
android:paddingLeft="10dp"
android:layout_alignBottom="#+id/textView"
android:layout_toRightOf="#+id/textView"
android:layout_toEndOf="#+id/textView" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="0%"
android:textColor="#FFFFFF"
android:background="#drawable/rounded_corner_reds"
android:id="#+id/textView3"
android:layout_marginTop="12dp"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:layout_below="#+id/seekBar"
android:layout_toLeftOf="#+id/textView4"
android:layout_toStartOf="#+id/textView4" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Proteins"
android:id="#+id/textView4"
android:paddingLeft="10dp"
android:textStyle="bold"
android:layout_alignTop="#+id/textView3"
android:layout_alignLeft="#+id/textView2"
android:layout_alignStart="#+id/textView2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="0%"
android:textColor="#FFFFFF"
android:background="#drawable/rounded_corner_blue"
android:id="#+id/textView5"
android:layout_marginTop="14dp"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:layout_below="#+id/seekBar2"
android:layout_toLeftOf="#+id/textView6"
android:layout_toStartOf="#+id/textView6" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Fats"
android:id="#+id/textView6"
android:textStyle="bold"
android:paddingLeft="10dp"
android:layout_alignTop="#+id/textView5"
android:layout_alignLeft="#+id/textView4"
android:layout_alignStart="#+id/textView4" />
</RelativeLayout>

User LinearLayout as your container (with horizontal orientation). Then add pie chart to it and another, vertical LinearLayout with seek bars in it.

Android RelativeLayout, hiding views and pushing the views beneath up

I have a RelativeLayout which includes a Spinner and some RadioButtons, based on the selection of these I have to hide some views and make others visible. The problem is if I make the views GONE by view.setVisibility(View.GONE) the layout gets messed up, the views overlap, if I use view.Visibility(View.INVISIBLE) everything is fine but the missing views create a void on the page. I want to push the views beneath up to properly augment the page. Below is a better explanation:
So far the code I have is:
<?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="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/bg_app" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:isScrollContainer="true"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:scrollbarStyle="insideOverlay"
android:scrollbars="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true" >
<Spinner
android:id="#+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="60dp"
android:background="#drawable/drop_down" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/spinner1"
android:layout_below="#+id/textView5"
android:layout_marginTop="30dp"
android:text="xxx"
android:textColor="#002f44"
android:textSize="18sp" />
<Button
android:id="#+id/button2"
android:layout_width="170dp"
android:layout_height="30dp"
android:layout_alignBaseline="#+id/textView1"
android:layout_alignRight="#+id/spinner1"
android:background="#drawable/btn_calendar"
android:textColor="#FFBF00" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:visibility="invisible" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:layout_marginTop="20dp"
android:scaleType="centerCrop" />
<AutoCompleteTextView
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/spinner1"
android:layout_alignTop="#+id/imageView1"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imageView1"
android:ems="6"
android:hint="xx xx"
android:inputType="textPersonName"
android:maxLength="25"
android:textColor="#002f44" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editText1"
android:layout_below="#+id/editText1"
android:padding="03dp"
android:textColor="#610B0B" />
<Button
android:id="#+id/button1"
android:layout_width="120dp"
android:layout_height="50dp"
android:layout_alignLeft="#+id/textView2"
android:layout_below="#+id/textView2"
android:background="#drawable/btn_addreminder"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/spinner1"
android:layout_below="#+id/spinner1"
android:layout_marginTop="20dp"
android:text="xxx "
android:textColor="#002f44"
android:textSize="18sp" />
<RadioGroup
android:id="#+id/radioGroup1"
android:layout_width="180dp"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/spinner1"
android:layout_alignTop="#+id/textView4"
android:layout_marginTop="-5dp"
android:background="#drawable/widget_style"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/radio0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="xxx"
android:textColor="#002f44" />
<RadioButton
android:id="#+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dp"
android:text="xxx"
android:textColor="#002f44" />
</RadioGroup>
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/spinner1"
android:layout_below="#+id/radioGroup1"
android:layout_marginTop="25dp"
android:text="xxx"
android:textColor="#002f44"
android:textSize="18sp" />
<AutoCompleteTextView
android:id="#+id/autoname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/textView5"
android:layout_alignRight="#+id/spinner1"
android:ellipsize="end"
android:ems="8"
android:hint="xx xx"
android:maxLines="1"
android:scrollHorizontally="true"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#002f44" >
</AutoCompleteTextView>
<Button
android:id="#+id/button4"
android:layout_width="100dp"
android:layout_height="40dp"
android:layout_alignLeft="#+id/imageView1"
android:layout_below="#+id/button1"
android:layout_marginLeft="05dp"
android:layout_marginTop="66dp"
android:background="#drawable/btn_addreminder"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
<Button
android:id="#+id/Button01"
android:layout_width="100dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="#drawable/btn_addreminder"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
<Button
android:id="#+id/Button02"
android:layout_width="100dp"
android:layout_height="40dp"
android:layout_alignBaseline="#+id/button4"
android:layout_alignBottom="#+id/button4"
android:layout_alignRight="#+id/editText1"
android:background="#drawable/btn_addreminder"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>

You should use alignWithParentIfMissing attribute.
I've reworked your layout, try it
<?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="wrap_content"
android:layout_height="wrap_content" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:isScrollContainer="true"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:scrollbarStyle="insideOverlay"
android:scrollbars="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Spinner
android:id="#+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="60dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:paddingLeft="20dp"
android:paddingRight="20dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView5"
android:layout_marginTop="30dp"
android:text="xxx"
android:textColor="#002f44"
android:textSize="18sp" />
<Button
android:id="#+id/button2"
android:layout_width="170dp"
android:layout_height="30dp"
android:layout_alignBaseline="#+id/textView1"
android:layout_alignParentRight="true"
android:textColor="#FFBF00" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:visibility="invisible" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:layout_marginTop="20dp"
android:scaleType="centerCrop" />
<AutoCompleteTextView
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/imageView1"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imageView1"
android:ems="6"
android:hint="xx xx"
android:inputType="textPersonName"
android:maxLength="25"
android:textColor="#002f44" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editText1"
android:layout_below="#+id/editText1"
android:padding="03dp"
android:textColor="#610B0B" />
<Button
android:id="#+id/button1"
android:layout_width="120dp"
android:layout_height="50dp"
android:layout_alignLeft="#+id/textView2"
android:layout_below="#+id/textView2"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:text="xxx "
android:textColor="#002f44"
android:textSize="18sp" />
<RadioGroup
android:id="#+id/radioGroup1"
android:layout_width="180dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/textView4"
android:layout_marginTop="-5dp"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/radio0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="xxx"
android:textColor="#002f44" />
<RadioButton
android:id="#+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dp"
android:text="xxx"
android:textColor="#002f44" />
</RadioGroup>
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/radioGroup1"
android:layout_marginTop="25dp"
android:text="xxx"
android:textColor="#002f44"
android:textSize="18sp" />
<AutoCompleteTextView
android:id="#+id/autoname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/textView5"
android:layout_alignParentRight="true"
android:ellipsize="end"
android:ems="8"
android:hint="xx xx"
android:maxLines="1"
android:scrollHorizontally="true"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#002f44" >
</AutoCompleteTextView>
<Button
android:id="#+id/button4"
android:layout_width="100dp"
android:layout_height="40dp"
android:layout_alignLeft="#+id/imageView1"
android:layout_below="#+id/button1"
android:layout_marginLeft="05dp"
android:layout_marginTop="66dp"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
<Button
android:id="#+id/Button01"
android:layout_width="100dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
<Button
android:id="#+id/Button02"
android:layout_width="100dp"
android:layout_height="40dp"
android:layout_alignBaseline="#+id/button4"
android:layout_alignBottom="#+id/button4"
android:layout_alignRight="#+id/editText1"
android:text="xxx"
android:textColor="#002f44"
android:textStyle="bold" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
</RelativeLayout>

Use LinearLayout(vertical) inside ScrollView and create RelativeLayouts as child of this LinearLayout. Set height of these RelativeLayout as wrap content, so that as you set visibility of items as GONE its height will shrink.
Now as per image that you have given here, you can have spinner first then below that a relative layout which will contain two (horizontal) items that you wanna hide. then next two (horizontal) items in another layout and then your image, editText and Button in third layout.
So you hide any relative layout others will arrange properly.

I would recommend to create a view of height 1dp with transparent background below texView4 and then set android:layout_below="#id/view" attribute for textView5. Here is how the changes to the layout would look like:
</RadioGroup> <!-- RadioGroup ends -->
<View
android:id="#+id/view"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#id/textView4"
android:background="#color/transparent"/>
<!-- Changed layout_below attribute value -->
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/spinner1"
android:layout_below="#id/view"
android:layout_marginTop="25dp"
android:text="xxx"
android:textColor="#002f44"
android:textSize="18sp" />
And here is how the layout looks like with textView4 and RadioGroup gone:

Achieve Vlingo app like user interface in my application?

I want to design a UI in which i will be displaying large amount of text content followed by a single button. User cam scroll down the text content but the button should remain at the bottom of the screen visible all the time. Vlingo application available at android market uses similar kind of UI as show in figure below:
I have tried putting the text content in a scrollView and button outside scrollView but doing this the button cutts off the screen. Here is XML layout i tried:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="300dp" >
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="#string/message"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsg1"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txtMsgHd"
android:text="#string/main_ex_msg1" />
</RelativeLayout>
</ScrollView>
<RelativeLayout
android:id="#+id/relativeLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/btnSpeak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="#string/speak_now" />
</RelativeLayout>

I would think about using a listview to do this vs. a scroll with a lot of text views etc. but for the sake of just answering the question if all you are trying to do is make the scroll view not overlap or push down the bottom button I would do something like the following
NOTE: had to remove any resource references so it's kind of messy but you should get the idea
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent" android:layout_above="#+id/btnSpeak">
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg A"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg B"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg C"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg D"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg E"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg F"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg A"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg B"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg C"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg D"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg E"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsgHd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="Msg F"
android:layout_marginRight="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtMsg1"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txtMsgHd"
android:text="Msg 1" />
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/btnSpeak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:text="Speak Now" />
</RelativeLayout>

Categories

Resources