What is wrong with my layout file? Text overlaps

What is wrong with my layout file? Text overlaps - android

My texts in my layouts are overlapping or something and the text is cut off i'm not sure why, please help I'm making an app and i'm relatively new to XML so i need everything to look the same other then the text being cut off. I also put a screenshot of the layout so you can see what text is being cutoff.
Here is my XML file:
<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:paddingLeft="0dp"
android:paddingRight="0dp"
android:paddingTop="0dp"
android:paddingBottom="0dp"
tools:context=".MainMenu"
android:background="#ffcf688f">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:src="#drawable/menuimage"
android:layout_alignBottom="#+id/toBattleButton"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:src="#drawable/menuimage"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Store"
android:id="#+id/store"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:textColor="#android:color/white"
android:textSize="60sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Battle"
android:id="#+id/battle"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#android:color/white"
android:textSize="60sp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/toStoreButton"
android:background="#android:color/transparent"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/toBattleButton"
android:layout_alignTop="#+id/toStoreButton"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_alignLeft="#+id/battle"
android:layout_alignStart="#+id/battle"
android:background="#android:color/transparent"
android:singleLine="false"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/imageView2"
android:layout_centerHorizontal="true"
android:weightSum="5"
android:paddingBottom="15dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/menuText1"
android:editable="true"
android:textSize="20sp"
android:textColor="#ff9cf8ff"
android:textAlignment="center"
android:layout_gravity="center"
/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/menuText2"
android:textSize="20sp"
android:textColor="#ff9cf8ff"
android:layout_gravity="center"
android:textAlignment="center"
/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/menuText3"
android:textSize="20sp"
android:textColor="#ff9cf8ff"
android:layout_gravity="center"
android:textAlignment="center"
/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/menuText4"
android:textSize="20sp"
android:textColor="#ff9cf8ff"
android:layout_gravity="center"
android:textAlignment="center"
/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/menuText5"
android:textSize="20sp"
android:textColor="#ff9cf8ff"
android:layout_gravity="center"
android:textAlignment="center"
android:paddingTop="1dp"/>
</LinearLayout>
</LinearLayout>
I cant figure out why the text is cut off at the bottom (in blue)

Trying using LinearLayout instead of RelativeLayout.

If you want the elements one after the other use this attribute in relative layout
android:layout_below = "#+id/aboveElementId"

Your layout is nested where it needn't be.
Have a good read through this article to understand that it's unnecessary to have a LinearLayout for each TextView. You should realise that what you're trying to accomplish can be done with a single LinearLayout, two Spaces and however-many Textviews. Something like this:
<LinearLayout
android:orientation="vertical"
android:background="#drawable/menuimage"
...>
<Space
android:weight="1"
.../>
<TextView
.../>
<Space
android:weight="1"
.../>
<TextView
.../>
<TextView
.../>
<TextView
.../>
<TextView
.../>
<TextView
.../>
</LinearLayout>

Related

Format issue placing two views side by side in RelativeLayout

I have two views side by side inside a relative layout. I want the format of both views to be like the one on the left ("Today's Special"). I've assigned both views the same attributes though they are different.
here is my xml.
<FrameLayout 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"
tools:ignore="ExtraText">
<RelativeLayout
android:id="#+id/view_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/bg_row_background">
<ImageView
android:id="#+id/delete_icon"
android:layout_width="#dimen/ic_delete"
android:layout_height="#dimen/ic_delete"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="#dimen/padd_10"
android:contentDescription="#string/deleteIcon"
android:src="#drawable/ic_delete_white_24dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginEnd="#dimen/padd_10"
android:layout_toStartOf="#id/delete_icon"
android:text="#string/delete"
android:textColor="#fff"
android:textSize="12sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/view_foreground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:padding="#dimen/padd_5">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="#dimen/ic_delete"
android:background="#color/description"
android:textColor="#color/item_name"
android:textSize="12sp" />
<TextView
android:id="#+id/namecat"
android:layout_width="wrap_content"
android:layout_height="#dimen/ic_delete"
android:layout_alignParentEnd="true"
android:layout_toEndOf="#id/name"
android:background="#color/description"
android:paddingStart="#dimen/padd_10"
android:textColor="#color/item_name"
android:textSize="12sp" />
</RelativeLayout>
</FrameLayout>
Thanks for your help.

Replace FrameLayout with LinearLayout and weightsum property
<LinearLayout 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="horizontal"
android:weightSum="2"
tools:ignore="ExtraText">
<RelativeLayout
android:id="#+id/view_background"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#978c8c">
<ImageView
android:id="#+id/delete_icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_lock" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#id/delete_icon"
android:text="#string/dummy_button"
android:textColor="#fff"
android:textSize="12sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/view_foreground"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#android:color/white">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:background="#color/colorAccent"
android:textColor="#color/colorPrimary"
android:textSize="12sp" />
<TextView
android:id="#+id/namecat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_toEndOf="#id/name"
android:background="#color/colorAccent"
android:textColor="#color/colorPrimaryDark"
android:textSize="12sp" />
</RelativeLayout>
</LinearLayout>

align textview below ImageView

I've one ImageView and 3 TextViews. I need to align the 3 text views below the imageview. the first on the left . the second in center. the 3rd on the right.
below code is working for normal and small screens. but for tablets and large screens, the first text view is not below the imageview. it's shifted too left. and the third TextView is shifted too Right.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Rel_wind2_img">
<ImageView
android:id="#+id/window2_image1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:id="#+id/window2_image1"/>
<TextView
android:id="#+id/TV1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
android:layout_alignParentLeft="true"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
android:layout_centerInParent="true"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
android:layout_alignParentRight="true"
android:text="#string/info2_txt_moves"
android:textAlignment="center"/>
</RelativeLayout>
I can solve this problem grammatically. but i need a simple way using XML.

Give layout weight inside a linear layout. It will set the width equally between all textviews. try this
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Rel_wind2_img"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:id="#+id/window2_image1"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
>
<TextView
android:id="#+id/TV1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_weight="1"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="info2_txt_moves"
android:layout_weight="1"
android:textAlignment="center"/>
</LinearLayout>
</RelativeLayout>

Best way to do this kind of UI design just divide the Layout into weights.
because if we divide the ui in weights it will automatically adjust according to divide size so there will be no problem on any device.
like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Rel_wind2_img">
<LinearLayout
android:id="#+id/tr"
android:layout_centerHorizontal="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/window2_image1"
android:layout_width="fill_parent"
android:layout_height="20dp"
android:background="#color/black"
/>
</LinearLayout>
<LinearLayout
android:layout_below="#+id/tr"
android:weightSum="3"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/TV1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="dhshshs"
/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/TV2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="fjkhajhjfha"
/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/TV3"
android:text="aoifoijoajoifjoajofjafafg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>

Use this One :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/Rel_wind2_img"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/window2_image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="dfgf"
android:id="#+id/TV1"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAlignment="center" />
<TextView
android:id="#+id/TV2"
android:text="dfgf"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center" />
<TextView
android:id="#+id/TV3"
android:text="dfgf"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center" />
</LinearLayout>
</LinearLayout>
Hope this help you...if you need any help you can ask

I want to create this UI in android

I want to create this UI in android.
Work
I am confuse in Linear Layout and Relative layout in android.I have done this UI.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#ffffff">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20dp"
android:text="S "
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" M T W T F S"
android:textSize="20dp"
android:textStyle="bold"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="09:00am-06:00pm"
android:textSize="20dp"
/>
</LinearLayout>
</RelativeLayout>
I am not able to move next line and also shadow text "S" like in "WORK" UI.

Try this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<!--1st row here-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_margin="5dp">
<!--Your days here-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="left"
android:layout_gravity="left">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="S"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="M"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="T"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="W"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TH"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="F"
android:layout_margin="5dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="S"
android:layout_margin="5dp"/>
</LinearLayout>
<!--Your time here-->
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="right"
android:layout_gravity="right">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Your time here"
android:layout_margin="5dp"/>
</LinearLayout>
</LinearLayout>
<!--2nd row-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_margin="5dp">
<!--For icon with text below-->
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/ic_delete"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="icon label"/>
</LinearLayout>
<!--For icon with text on side-->
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/ic_delete"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="icon label"/>
</LinearLayout>
</LinearLayout>

To move next line just insert a new linear layout below the one you already have.
And for the shadow I guess this question might help you.

You can achieve multiple rows with something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff">
<LinearLayout
android:id="#+id/dates"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="S "
android:textSize="20dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" M T W T F S"
android:textSize="20dp"
android:textStyle="bold"/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="09:00am-06:00pm"
android:textSize="20dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/dates"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/ic_menu_camera"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/ic_menu_call"/>
</LinearLayout>
</RelativeLayout>
You have a separate LinearLayout for each row. Importantly, you should give each LinearLayout an id so that you can set the layout_below attribute of the bottom layout with the id of the layout above it
Then in your second LinearLayout you can just add your icons horizontally like you did originally
That will give you something that looks like this:

Vertically Center a TextView to the right of a FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:id="#+id/container"
android:background="?android:attr/selectableItemBackground"
android:layout_height="wrap_content">
<FrameLayout
android:layout_width="wrap_content"
android:id="#+id/frame"
android:layout_marginLeft="16dp"
android:layout_marginTop="18dp"
android:layout_marginBottom="10dp"
android:layout_height="wrap_content">
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:minHeight="5dip"
android:minWidth="5dip"
android:maxWidth="20dip"
android:maxHeight="20dip"
android:id="#+id/progress_bar"
android:visibility="visible"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/cover"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
<TextView
android:id="#+id/changeinscore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0.00"
android:shadowColor="#000000"
android:shadowDx="1"
android:shadowDy="1"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:shadowRadius="7"
android:textSize="12sp"
android:textColor="#color/background"
android:fontFamily="sans-serif-condensed"/>
</RelativeLayout>
</FrameLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/middle"
android:layout_toRightOf="#+id/frame"
android:layout_centerVertical="true"
android:text="TextView"
/>
</RelativeLayout>
I want to vertically center the middle TextView to the right of the FrameLayout, as the changeinscore TextView is inside the FrameLayout, if that makes sense. Currently it's off center because the centerVertical is centering it in the entire RelativeLayout, not specifically to the FrameLayout, if I understand it correctly. Basically I want the middle textview to be empty but to actually anchor other textviews so I can have 2 textviews slightly offcenter to the framelayout/imageview.
If I follow what San says, here is the result, but not exactly what I want

I finally got what you wanted and here is my sample of it.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:id="#+id/container"
android:background="?android:attr/selectableItemBackground"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/frame"
android:layout_margin="10dp"
android:gravity="center">
<ImageView
android:id="#+id/cover"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/im"
/>
<TextView
android:id="#+id/changeinscore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0.00"
android:shadowColor="#000000"
android:shadowDx="1"
android:shadowDy="1"
android:visibility="gone"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:shadowRadius="7"
android:textSize="12sp"
android:layout_margin="5dp"
android:textColor="#color/background"
android:fontFamily="sans-serif-condensed"/>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:minHeight="5dip"
android:minWidth="5dip"
android:maxWidth="20dip"
android:maxHeight="20dip"
android:layout_centerInParent="true"
android:id="#+id/progress_bar"
android:visibility="visible"/>
</RelativeLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_alignTop="#+id/frame"
android:layout_alignBottom="#+id/frame"
android:layout_toRightOf="#id/frame"
android:gravity="center"
android:weightSum="3"
android:orientation="vertical">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Aldnoah.Zero"
android:layout_weight="1"
android:ellipsize="end"
android:maxLines="1"
android:paddingLeft="5dp"
android:gravity="bottom"
android:fontFamily="sans-serif-slab"
android:textSize="16sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:id="#+id/middle"
android:text="TextView"
android:layout_weight="1"
android:paddingLeft="5dp"
android:textSize="14sp"
/>
<TextView
android:id="#+id/score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Bottom Text"
android:paddingLeft="5dp"
android:textSize="14sp"
android:gravity="top"
android:fontFamily="sans-serif-condensed"/>
</LinearLayout>
</RelativeLayout>
And the layout looks like this

How to make whole activity scrollable according to the data inside it

I have tried LinearLayout inside which I put several textview. I completely use weights for each and every view. Problem arises when data becomes too much in lenght and textview not shows it completely. I also tried tabletlayout but that thing also not works beacuse ultimately tablelayout is inside linear layout having weight,so it doesn't grows beyond a certain limit. I want to know how can I make a activity scrollable with showing all data while using weights.

Use Scrollview in xml Layout of your activity.
Example:
XML code for your activity:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
android:fillViewport="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="200dp"
android:scaleType="centerCrop"
android:src="#drawable/image" />
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="KNOW MORE" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/description"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
</ScrollView>

You can Use Scroll View With Linear Layout as well as With Relative layout.
You Can try this code, Just Copy and paste in XML File.
U'll Get Your ans :)
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:background="#android:color/black"
>
<TextView
android:id="#+id/TV_Welcome"
android:text="ADD YOUR VEHICLE"
android:layout_marginLeft="70dp"
android:layout_marginTop="10dp"
android:textSize="20dp"
android:layout_centerHorizontal="true"
android:textColor="#color/menu_color"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal"/>
<RelativeLayout
android:id="#+id/RelativeLayout01"
android:layout_below="#+id/TV_Welcome"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TV_BlockNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Block No:"
android:textColor="#color/version_color"
android:layout_marginLeft="10dp"
android:textSize="15dp"
android:layout_alignParentLeft="true"
android:gravity="left"
/>
<Spinner
android:id="#+id/Spinner_BlockNo"
android:layout_marginLeft="30dp"
android:layout_toRightOf="#+id/TV_BlockNo"
android:background="#558cff"
android:layout_width="300dp"
android:layout_height="wrap_content">
</Spinner>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout02"
android:layout_margin="10dp"
android:layout_below="#+id/RelativeLayout01"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/TV_FlatNo"
android:text="Flat NO:"
android:textSize="15dp"
android:layout_marginLeft="10dp"
android:textColor="#color/version_color"
/>
<Spinner
android:id="#+id/Spinner_FlatNo"
android:layout_marginLeft="42dp"
android:layout_toRightOf="#+id/TV_FlatNo"
android:background="#558cff"
android:layout_width="300dp"
android:layout_height="wrap_content"></Spinner>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout03"
android:layout_below="#+id/RelativeLayout02"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TV_VehicleNo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Vehicle No:"
android:textColor="#color/version_color"
android:layout_marginLeft="10dp"
android:textSize="15dp"
android:layout_alignParentLeft="true"
android:gravity="left"
/>
<EditText
android:id="#+id/ET_VehicleNo"
android:layout_marginLeft="20dp"
android:hint="Enter Vehicle No"
android:textColorHint="#color/menu_glow"
android:textSize="20dp"
android:layout_toRightOf="#+id/TV_VehicleNo"
android:textColor="#558cff"
android:layout_width="400dp"
android:layout_height="wrap_content"
/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout04"
android:layout_margin="10dp"
android:layout_below="#+id/RelativeLayout03"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/TV_VehicleType"
android:text="Vehicle Type:"
android:textSize="15dp"
android:layout_marginLeft="10dp"
android:textColor="#color/version_color"
/>
<Spinner
android:id="#+id/Spinner_VehicleType"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#+id/TV_VehicleType"
android:background="#558cff"
android:layout_width="300dp"
android:layout_height="wrap_content">
</Spinner>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout05"
android:layout_margin="10dp"
android:layout_below="#id/RelativeLayout04"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TV_OwnerName"
android:text="Owner Name:"
android:textSize="15dp"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="left">
</TextView>
<EditText
android:id="#+id/ET_OwnerName"
android:hint="Enter Owner Name"
android:textColorHint="#color/menu_glow"
android:inputType="textPersonName"
android:layout_marginLeft="20dp"
android:textSize="20dp"
android:layout_toRightOf="#id/TV_OwnerName"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="400dp">
</EditText>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout06"
android:layout_margin="10dp"
android:layout_below="#id/RelativeLayout05"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TV_MobileNo"
android:text="Mobile No:"
android:textSize="15dp"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="left">
</TextView>
<EditText
android:id="#+id/ET_MobileNo"
android:layout_marginLeft="40dp"
android:hint="Enter 10 digit"
android:textColorHint="#color/menu_glow"
android:inputType="phone"
android:textSize="20dp"
android:layout_toRightOf="#id/TV_MobileNo"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="200dp"
>
</EditText>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout07"
android:layout_margin="10dp"
android:layout_below="#id/RelativeLayout06"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TV_TelNo"
android:text="Telephone No:"
android:textSize="15dp"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</TextView>
<EditText
android:id="#+id/ET_TelNo"
android:layout_marginLeft="20dp"
android:hint="Enter Telephone No"
android:textColorHint="#color/menu_glow"
android:inputType="number"
android:textSize="17dp"
android:layout_toRightOf="#id/TV_TelNo"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</EditText>
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout08"
android:layout_margin="0dp"
android:layout_below="#id/RelativeLayout07"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/TV_Example"
android:text="(Example:0141-2206923)"
android:layout_marginLeft="120dp"
android:textSize="10dp"
android:textColor="#color/version_color"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</TextView>
</RelativeLayout>
<ImageView
android:id="#+id/ImageView_Submit"
android:layout_marginTop="5dp"
android:layout_marginLeft="100dp"
android:layout_centerInParent="true"
android:layout_width="150dp"
android:layout_height="150dp"
android:src="#drawable/submit"
android:layout_below="#id/RelativeLayout08"
android:onClick="doSubmit"></ImageView>
</RelativeLayout>
</ScrollView>

You can make your activity scrollable using ScrollView.
Its very simple and effective to use.Just copy code of ScrollView from below and paste it in your layout xml file.
You can use this ScrollView with Linear as well as Relative Layout also.
Just need to remember one thing,ScrollView can have only one child widget.If you want more Children then wrap them into one container.
<?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="match_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/xyz.png"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="TextView1"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="TextView2"/>
<TextView
android:id="#+id/textView3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="TextView3"/>
<TextView
android:id="#+id/textView4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="TextView4"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_demo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Demo" />
</LinearLayout>
</LinearLayout>
</ScrollView>

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

What is wrong with my layout file? Text overlaps - android

Trying using LinearLayout instead of RelativeLayout.

If you want the elements one after the other use this attribute in relative layout android:layout_below = "#+id/aboveElementId"

Related

Format issue placing two views side by side in RelativeLayout

align textview below ImageView

I want to create this UI in android

Vertically Center a TextView to the right of a FrameLayout

How to make whole activity scrollable according to the data inside it

Categories

Resources