How do I implement a Scrollview for java? [duplicate] - java

I have an XML layout file, but the text is more than fits into the screen size. What do I need to do in order to make a ScrollView?
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1" >
<TableRow>
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dip"
android:layout_marginTop="10dip"
android:layout_marginRight="5dip"
android:tint="#55ff0000"
android:src="#drawable/icon" />
</TableRow>
<TableRow>
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Name " />
<TextView android:id="#+id/name1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Veer" />
</TableRow>
<TableRow>
<TextView android:id="#+id/age"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Age" />
<TextView android:id="#+id/age1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="23" />
</TableRow>
<TableRow>
<TextView android:id="#+id/gender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Gender" />
<TextView android:id="#+id/gender1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Male" />
</TableRow>
<TableRow>
<TextView android:id="#+id/profession"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Professsion" />
<TextView android:id="#+id/profession1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Mobile Developer" />
</TableRow>
<TableRow>
<TextView android:id="#+id/phone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Phone" />
<TextView android:id="#+id/phone1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="03333736767" />
</TableRow>
<TableRow>
<TextView android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Email" />
<TextView android:id="#+id/email1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="veer.developer#gmail.com" />
</TableRow>
<TableRow>
<TextView android:id="#+id/hobby"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Hobby" />
<TextView android:id="#+id/hobby1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Play Games" />
</TableRow>
<TableRow>
<TextView android:id="#+id/ilike"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" I like" />
<TextView android:id="#+id/ilike1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Java, Objective-c" />
</TableRow>
<TableRow>
<TextView android:id="#+id/idislike"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" I dislike" />
<TextView android:id="#+id/idislike1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Microsoft" />
</TableRow>
<TableRow>
<TextView android:id="#+id/address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Address" />
<TextView android:id="#+id/address1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Johar Mor" />
</TableRow>
</TableLayout>


Just make the top-level layout a ScrollView:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="1">
<!-- everything you already have -->
</TableLayout>
</ScrollView>


How to use ScrollView
Using ScrollView is not very difficult. You can just add one to your layout and put whatever you want to scroll inside. ScrollView only takes one child so if you want to put a few things inside then you should make the first thing be something like a LinearLayout.
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!-- things to scroll -->
</LinearLayout>
</ScrollView>
If you want to scroll things horizontally, then use a HorizontalScrollView.
Making the content fill the screen
As is talked about in this post, sometimes you want the ScrollView content to fill the screen. For example, if you had some buttons at the end of a readme. You want the buttons to always be at the end of the text and at bottom of the screen, even if the text doesn't scroll.
If the content scrolls, everything is fine. However, if the content is smaller than the size of the screen, the buttons are not at the bottom.
This can be solved with a combination of using fillViewPort on the ScrollView and using a layout weight on the content. Using fillViewPort makes the ScrollView fill the parent area. Setting the layout_weight on one of the views in the LinearLayout makes that view expand to fill any extra space.
Here is the XML
<?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"
android:fillViewport="true"> <--- fillViewport
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textview"
android:layout_height="0dp" <---
android:layout_weight="1" <--- set layout_weight
android:layout_width="match_parent"
android:padding="6dp"
android:text="hello"/>
<LinearLayout
android:layout_height="wrap_content" <--- wrap_content
android:layout_width="match_parent"
android:background="#android:drawable/bottom_bar"
android:gravity="center_vertical">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Accept" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Refuse" />
</LinearLayout>
</LinearLayout>
</ScrollView>
The idea for this answer came from a previous answer that is now deleted (link for 10K users). The content of this answer is an update and adaptation of this post.


There are two options. You can make your entire layout to be scrollable or only the TextView to be scrollable.
For the first case,
<?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" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1" >
<TableRow>
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dip"
android:layout_marginRight="5dip"
android:layout_marginTop="10dip"
android:src="#drawable/icon"
android:tint="#55ff0000" >
</ImageView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Name " >
</TextView>
<TextView
android:id="#+id/name1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Veer" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/age"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Age" >
</TextView>
<TextView
android:id="#+id/age1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="23" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/gender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Gender" >
</TextView>
<TextView
android:id="#+id/gender1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Male" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/profession"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Professsion" >
</TextView>
<TextView
android:id="#+id/profession1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Mobile Developer" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/phone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Phone" >
</TextView>
<TextView
android:id="#+id/phone1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="03333736767" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Email" >
</TextView>
<TextView
android:id="#+id/email1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="veer.developer#gmail.com" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/hobby"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Hobby" >
</TextView>
<TextView
android:id="#+id/hobby1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Play Games" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/ilike"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" I like" >
</TextView>
<TextView
android:id="#+id/ilike1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Java, Objective-c" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/idislike"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" I dislike" >
</TextView>
<TextView
android:id="#+id/idislike1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Microsoft" >
</TextView>
</TableRow>
<TableRow>
<TextView
android:id="#+id/address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:text=" Address" >
</TextView>
<TextView
android:id="#+id/address1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:text="Johar Mor" >
</TextView>
</TableRow>
<Relativelayout>
</Relativelayout>
</TableLayout>
</RelativeLayout>
</ScrollView>
or, as I said you can use scrollView for TextView alone.


A ScrollView is a special type of FrameLayout in that it allows users to scroll through a list of views that occupy more space than the physical display.I just add some attributes .
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:scrollbars = "vertical"
android:scrollbarStyle="insideInset"
>
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1"
>
<!-- Add here which you want -->
</TableLayout>
</ScrollView>


As said above you can put it inside a ScrollView... and if you want the Scroll View to be horizontal put it inside HorizontalScrollView... and if you want your component (or layout) to support both put inside both of them like this:
<HorizontalScrollView>
<ScrollView>
<!-- SOME THING -->
</ScrollView>
</HorizontalScrollView>
and with setting the layout_width and layout_height ofcourse.


Put your TableLayout inside a ScrollView Layout.That will solve your problem.


To scroll data in text view you can use this to your text view.
and add
and for anything other layout you can just add scroll view on layout as people are saying above.
/**
android:scrollable=true at textview in xml layout.
TextView txtScroll = (TextView) findViewById(R.id.txt1);
txtScroll.setMovementMethod(new ScrollingMovementMethod());
*//


<?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" >
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<RadioGroup
android:layout_width="fill_parent"
android:layout_height="match_parent" >
<RadioButton
android:id="#+id/butonSecim1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_weight=".50"
android:text="#string/buton1Text" />
<RadioButton
android:id="#+id/butonSecim2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_weight=".50"
android:text="#string/buton2Text" />
</RadioGroup>
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableLayout
android:id="#+id/bilgiAlani"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:visibility="invisible" >
<TableRow
android:id="#+id/BilgiAlanitableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/bilgiMesaji"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight=".100"
android:ems="10"
android:gravity="left|top"
android:inputType="textMultiLine" />
</TableRow>
</TableLayout>
</TableRow>
<TableRow
android:id="#+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/metin4"
android:layout_height="match_parent"
android:layout_weight=".100"
android:text="deneme" />
</TableRow>
<TableRow
android:id="#+id/tableRow4"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/metin5"
android:layout_height="match_parent"
android:layout_weight=".100"
android:text="deneme" />
</TableRow>
</TableLayout>
</ScrollView>

Related

Android studio setting layout up like this

I've tried everything I can think of but can't get this layout working. It's a ListView that list matches in a row.
Row one is first match, and next row is second match, and so on. I don't don't mind the green strokes and borders.
Is it even possible?
See the deisgn here:

Here's an example implementation, it does however use negative margins, to overlap the thing I called badge.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#cdcdcd"
android:gravity="center_vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/score"
android:layout_below="#+id/badge"
android:background="#color/white"
android:orientation="vertical"
android:padding="16dp"
android:showDividers="middle">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 2"/>
</LinearLayout>
<TextView
android:id="#+id/score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="16dp"
android:text="0 vs 7"
android:layout_below="#+id/badge"
android:textSize="32sp"
android:textStyle="bold"/>
<LinearLayout
android:layout_below="#+id/badge"
android:id="#+id/right_table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/score"
android:background="#color/white"
android:orientation="vertical"
android:padding="16dp"
android:showDividers="middle">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 2"/>
</LinearLayout>
<TextView
android:id="#+id/badge"
android:layout_toRightOf="#id/score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#0f0"
android:layout_marginLeft="-12dp"
android:layout_marginBottom="-8dp"
android:text="Badge"
/>
</RelativeLayout>
To alternate the background simply set the background in getView in your adapter.

You'll need a custom adapter that fills the ListView (better use RecyclerView & an Adapter with ViehHolder), this row layout is taken from my own project, not exactly what you requested, but you'll get the idea. Just comment for further information.
<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="wrap_content"
>
<TextView
android:id="#+id/textV_player1"
android:text="player1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="40dp"
android:layout_marginEnd="40dp"
android:textSize="20sp"
android:paddingTop="15dp"
android:gravity="end"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/textV_vs"
android:layout_toStartOf="#+id/textV_vs" />
<TextView
android:id="#+id/textV_player2"
android:text="player2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingTop="15dp"
android:layout_alignBottom="#+id/textV_vs"
android:layout_toRightOf="#+id/textV_vs"
android:layout_toEndOf="#+id/textV_vs" />
<TextView
android:id="#+id/textV_vs"
android:text="vs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="40dp"
android:layout_marginEnd="40dp"
android:textSize="20sp"
android:layout_above="#+id/textV_points1"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/textV_points1"
android:text="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingTop="3dp"
android:paddingBottom="15dp"
android:layout_below="#+id/textV_player1"
android:layout_alignRight="#+id/textV_player1"
android:layout_alignEnd="#+id/textV_player1" />
<TextView
android:id="#+id/textV_points2"
android:text="2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingTop="3dp"
android:paddingBottom="15dp"
android:layout_below="#+id/textV_player2"
android:layout_alignLeft="#+id/textV_player2"
android:layout_alignStart="#+id/textV_player2" />
<TextView
android:id="#+id/textV_vspoints"
android:text=":"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingBottom="15dp"
android:layout_below="#id/textV_vs"
android:layout_centerHorizontal="true" />
</RelativeLayout>

I want to set my spinner in this layout with dropdown triangle icon

This is my spinner layout and I'm setting the spinner inside the table layout in second row. I'm wrapping the spinner and giving manually height and width to it. When i set its weight and height to wrap content it's layout make a issues.
so i want to set the spinner in this layout with drop-down arrow also.
<TableLayout
android:id="#+id/details"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/list_divider"
android:orientation="vertical"
android:stretchColumns="*" >
<TableRow
android:id="#+id/row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="center"
android:padding="5dp"
android:text="Lot Qty."
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="center"
android:padding="5dp"
android:text="Lot Size"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="center"
android:padding="5dp"
android:text="Unit Price"
android:textSize="18sp" />
</TableRow>
<TableRow
android:id="#+id/row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Spinner
android:id="#+id/lot_qty_spinner"
android:layout_width="70dp"
android:layout_height="39dp"
android:layout_marginRight="2dp"
android:background="#ffffff"
android:popupBackground="#DFFFFFFF" />
<TextView
android:id="#+id/size"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_marginRight="2dp"
android:background="#ffffff"
android:gravity="center"
android:text="size"
android:textColor="#000000"
android:textSize="20sp" />
<TextView
android:id="#+id/unit_price"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_weight="1"
android:background="#ffffff"
android:gravity="center"
android:textColor="#000000"
android:textSize="20sp" />
</TableRow>
</TableLayout>

You need to remove background color from background.
Remove android:background="#ffffff"
Try with this.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/details"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="vertical"
android:background="#color/list_divider"
android:stretchColumns="*" >
<TableRow
android:id="#+id/row1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight="1"
android:gravity="center"
android:padding="5dp"
android:text="Lot Qty."
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="2dp"
android:layout_weight="1"
android:gravity="center"
android:padding="5dp"
android:text="Lot Size"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="5dp"
android:text="Unit Price"
android:textSize="18sp" />
</TableRow>
<TableRow
android:id="#+id/row2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Spinner
android:id="#+id/lot_qty_spinner"
android:layout_width="70dp"
android:layout_height="39dp"
android:layout_marginRight="2dp"
android:popupBackground="#DFFFFFFF" />
<TextView
android:id="#+id/size"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_marginRight="2dp"
android:gravity="center"
android:text="size"
android:textColor="#000000"
android:textSize="20sp" />
<TextView
android:id="#+id/unit_price"
android:layout_width="wrap_content"
android:layout_height="39dp"
android:layout_weight="1"
android:gravity="center"
android:textColor="#000000"
android:textSize="20sp" />
</TableRow>
</TableLayout>

LinearLayout on android

I was trying to create a sign up form for my Android application
This is my XML code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<TextView
android:id="#+id/mynumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Number +961"
android:textSize="20sp"
android:color="#android:color/white" />
<EditText
android:id="#+id/editTextNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Number"
android:textColor="#FFFFFF" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical" >
<Button
android:id="#+id/buttonCreateAccount"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="60dp"
android:background="#drawable/ic_create" />
</LinearLayout>
</LinearLayout>
If you notice the first LinearLayout has a horizontal orientation and gravity (I want both the textview and edit text to be next to each others)
After the first linear layout i want the create account button to come out
However it is showing up on the same line with the previous edit text and text view
Any idea if i should change in the settings of the second linear layout

Change it like this
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:gravity="center_vertical"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<TextView
android:color="#android:color/white"
android:id="#+id/mynumber"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Number +961"
android:textSize="20sp" />
<EditText
android:hint="Number"
android:id="#+id/editTextNumber"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textColor="#FFFFFF" />
</LinearLayout>
<Button
android:background="#drawable/ic_create"
android:id="#+id/buttonCreateAccount"
android:layout_height="wrap_content"
android:layout_marginBottom="60dp"
android:layout_width="fill_parent" />
</LinearLayout>

Try Below Xml File
Use Relative layout Or One MAin LinearLayout with Vertical Orientation and in sub take Horizontal as you required.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<TextView
android:id="#+id/mynumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Number +961"
android:textSize="20sp"
android:color="#android:color/white" />
<EditText
android:id="#+id/editTextNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Number"
android:textColor="#FFFFFF" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal" >
<Button
android:id="#+id/buttonCreateAccount"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="60dp"
android:background="#drawable/ic_create" />
</LinearLayout>
</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/sign">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="1200dp">
<TableLayout
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Signup for Juju's"
android:textSize="35dp"
android:textColor="#f45"
android:textStyle="bold" />
<TableRow
android:weightSum="20"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:id="#+id/nametv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="First Name"
android:textSize="25dp"
android:textColor="#23f" />
<EditText
android:textSize="16dp"
android:layout_marginRight="5dp"
android:layout_weight="15"
android:id="#+id/name"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Enter your name" >
</EditText>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:weightSum="20"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:textColor="#23f"
android:id="#+id/emailtv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email"
android:textSize="25dp" />
<EditText
android:textSize="16dp"
android:layout_weight="15"
android:layout_marginRight="5dp"
android:id="#+id/email"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Enter E-mail" />
</TableRow>
<TableRow
android:weightSum="20"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:textColor="#23f"
android:id="#+id/phonetv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Phone"
android:textSize="25dp" />
<EditText
android:textSize="16dp"
android:layout_marginRight="5dp"
android:layout_weight="15"
android:id="#+id/phone"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Enter Phone Number" />
</TableRow>
<TableRow
android:weightSum="20"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:textColor="#23f"
android:id="#+id/addresstv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address"
android:textSize="25dp" />
<EditText
android:textSize="16dp"
android:layout_marginRight="5dp"
android:layout_weight="15"
android:id="#+id/address"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Enter Address" />
</TableRow>
<TableRow
android:weightSum="20"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:textColor="#23f"
android:id="#+id/usernametv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username"
android:textSize="25dp" />
<EditText
android:textSize="16dp"
android:layout_weight="15"
android:layout_marginRight="5dp"
android:id="#+id/username"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Username" />
</TableRow>
<TableRow
android:weightSum="20"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:textColor="#23f"
android:id="#+id/passwordtv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Password"
android:textSize="25dp" />
<EditText
android:textSize="16dp"
android:layout_marginRight="5dp"
android:layout_weight="15"
android:id="#+id/password"
android:inputType="textPassword"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Password" />
</TableRow>
<TableRow
android:weightSum="20"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_weight="5"
android:textColor="#23f"
android:id="#+id/confirmtv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Reenter"
android:textSize="25dp" />
<EditText
android:textSize="16dp"
android:layout_marginRight="5dp"
android:layout_weight="15"
android:inputType="textPassword"
android:id="#+id/confirm"
android:layout_width="220dp"
android:layout_height="wrap_content"
android:hint="Confirm Password" />
</TableRow>
<CheckBox
android:id="#+id/view_password"
android:checked="false"
android:textSize="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="View Password"
android:textColor="#000"/>
<ImageView
android:clickable="true"
android:id="#+id/submit"
android:layout_gravity="center"
android:layout_width="122dp"
android:layout_height="74dp"
android:src="#drawable/button" />
</TableLayout>
</ScrollView>
</LinearLayout>

Change your layout type;
<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" >

Definitely. What your are doing is encapsulating the second LinearLayout inside the first LinearLayout, that dictates a horizontal layout, ultimately resulting in horizontal positioning of all three components. Your hierarchy is as follows:
LinearLayout-Horizontal[TextView + EditText + LinearLayout-Vertical[Button]]
When supplying a LinearLayout with an orientation parameter, you're telling it to arrange all its children in that manner.
What I would recommend to you, to achieve the desired look is either:
Use a RelativeLayout (http://developer.android.com/guide/topics/ui/layout/relative.html) and position the elements in relation to each other and their parent.
Nest several LinearLayouts(not a recommended practice; here it wouldn't prove an issue but in larger and more complex layouts nesting too many such components may ultimately result in long rendering time for your view). This solution is pretty similar to what you have now and would work as follows:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="#+id/mynumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Number +961"
android:textSize="20sp"
android:color="#android:color/white" />
<EditText
android:id="#+id/editTextNumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Number"
android:textColor="#FFFFFF" />
</LinearLayout>
<Button
android:id="#+id/buttonCreateAccount"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="60dp"
android:background="#drawable/ic_create" />
</LinearLayout>
Here you tell your outer layout to position its children vertically, where one of its children is a LinearLayout that positions its children horizontally, resulting in:
[[TEXT][EDIT]]
[ BUTTON ]
Hope this helps.

RelativeLayout inside of ScrollView - Android

I am changing my whole layout for this activity from a TableLayout to RelativeLayout for various reasons. I have 10 "rows" I want inside of this RelativeLayout but right now I am just trying to get one row working. After that 1 row is working, I will implement the other 9.
There are 4 columns in each row and right now only the first column is displaying and not the last 3. Below is the code and screenshot. The "red x" is the first column that is displaying.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/tableLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1"
android:shrinkColumns="0"
android:orientation="vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="70dp"
android:paddingBottom="70dp"
android:background="#drawable/scroll" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="20" >
<TableRow
android:id="#+id/header"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/category"
android:layout_height="wrap_content"
android:layout_width="0px"
android:layout_weight="1"
android:textStyle="bold"
android:textSize="15sp"
android:paddingTop="10dp"
android:gravity="center_horizontal" />
<TableLayout
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TableRow
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/points"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:textSize="9sp"
android:gravity="left"
android:textStyle="bold" />
</TableRow>
<TableRow
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/percentage"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight=".3"
android:textSize="9sp"
android:gravity="left"
android:textStyle="bold" />
</TableRow>
<TableRow
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/total_score"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight=".45"
android:textSize="9sp"
android:gravity="left"
android:textStyle="bold" />
</TableRow>
</TableLayout>
</TableRow>
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#000001" />
<TableRow
android:id="#+id/row3"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/imageColumn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0" />
<TextView
android:id="#+id/questionColumn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight=".45"
android:textSize="10sp"
android:textStyle="bold|italic"
android:gravity="center_vertical" />
<TextView
android:id="#+id/answerColumn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight=".3"
android:textSize="10sp"
android:textStyle="bold|italic"
android:gravity="center_vertical" />
<TextView
android:id="#+id/verseColumn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:textSize="10sp"
android:textStyle="bold|italic"
android:gravity="center_vertical" />
</TableRow>
</TableLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="65"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/q1Image"
android:layout_width="10dp"
android:layout_height="10dp" />
<TextView
android:id="#+id/q1Question"
android:layout_width="0dip"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/q1Answer"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/q1Question" />
<TextView
android:id="#+id/q1Verse"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/q1Answer" />
</RelativeLayout>
</ScrollView>
<TableLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="15" >
<TableRow
android:id="#+id/row14"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="0,1" >
<Button
android:id="#+id/mainmenuBtn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="7sp" />
<Button
android:id="#+id/highscoresBtn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="7sp" />
<Button
android:id="#+id/playBtn"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="7sp" />
</TableRow>
</TableLayout>
</LinearLayout>

If I read it correctly and you are referring to this ScrollView:
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="65"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/q1Image"
android:layout_width="10dp"
android:layout_height="10dp" />
<TextView
android:id="#+id/q1Question"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/q1Image" />
<TextView
android:id="#+id/q1Answer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/q1Question" />
<TextView
android:id="#+id/q1Verse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/q1Answer" />
</RelativeLayout>
</ScrollView>
Your TextView's layout_width was set to 0dip when you need a wrap_content or static width. Also your TextView q1Question was not attached to the right of ImageView q1Image. Unless of course you wanted it stacked ontop of the ImageView.

Looks like your views inside of your imageView have a width of 0dip and no weight. Could you correct that ?
Also, you could remove the weights on the TableRows and set them to match_parent.

Layout of textviews and tablerows in TableLayout - Android

What I am trying to achieve is a simple 3 column, 11 row table. Right now all of the data is displayed in 1 column and 33 rows. Here is the output:
Rank
Percentage
Score
1
1234
13453
2
2352435
312413
3
235325
235423
//etc...
I have messed around with many online examples of TableLayouts but all my output stays the same for all the examples. What I have below is just the last one I tried. Any suggestions?
Highscoresmain.xml
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/scroller"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:fillViewport="true" >"
<TableLayout
android:id="#+id/tableLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1" >
<TableRow
android:id="#+id/rowHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/rank"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:id="#+id/percentage"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:id="#+id/score"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TableRow
android:id="#+id/row1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/r1r"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/r1p"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/r1s"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TableRow
android:id="#+id/row2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/r2r"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/r2p"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/r2s"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
//TableRows 1 through 10 are identical.
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="MAIN MENU"
android:id="#+id/homeBtn" />
</TableLayout>
</ScrollView>

Do it this way for all your rows in the table
<TableRow
android:id="#+id/rowHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/rank"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:id="#+id/percentage"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:id="#+id/score"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" />
</TableRow>

Categories