How to scrollview in List View in Android - java

I added 11 to 12 column in List view, but I am not able to see all columns. While I scroll list_view will be able to see all columns. Can someone give me ideas how to do this? Here is my XML file code:
ListView Item Xml File
<?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="wrap_content" >
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip"
android:scrollbars="vertical" >
<TextView
android:id="#+id/textView1_ID"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView2_Name"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView3_Email"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView4_Mobile"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView5_Products"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView6_Budget"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView7Priority"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView8_Status"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView9_Notes"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView10_Date_Reminder"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView11_Time_Reminder"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/textView12_AddToContact"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginLeft="5dp"
android:background="#android:color/black"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#android:color/white" />
</TableRow>
</TableLayout>
And here is my ListView Code xml file
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:ems="10"
android:hint="#string/search_hint" >
<requestFocus />
</EditText>
<ListView
android:id="#+id/listView_DisplayData"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/editText1" >
</ListView>
</RelativeLayout>

You can convert the ListView into a ScrollView and put all your content in there.
Or you create your own ListViewAdapter (or take an existing one such as the ArrayAdapter) and let the adapter insert your data into your listview.
For the latter option, your Activity needs to extend ListActivity and your listview should have the id android.R.id.list.

Related

Circular dependencies cannot exist in Relative Layout

I am a newbie in android. Got stuck cannot move forward without this. I don't understand where I am doing the mistake. Looked through the code for 2 hours but cannot find the error. I need serious help. Thank u in advance.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:toomove ls="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimaryDark"
android:padding="16dp"
tools:context="com.zodiac.sanghvi.jplreborn.Admin_ScoreCard">
<TextView
android:id="#+id/Vs"
android:textColor="#f8f8f9"
android:gravity="center"
android:textSize="20sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:text="Team1 Vs Team2"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/BatsMen1"
android:textColor="#f8f8f9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
android:text="TextView"
android:layout_below="#+id/textView7"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#f8f8f9"
android:layout_marginTop="25sp"
android:text="Batting :"
android:textSize="17sp"
android:layout_below="#+id/Vs"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/Batting"
android:gravity="left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#f8f8f9"
android:text="TextView"
android:layout_above="#+id/BatsMen1"
android:layout_toLeftOf="#+id/textView6"
android:layout_toStartOf="#+id/textView6" />
<TextView
android:id="#+id/BatsMen2"
android:textColor="#f8f8f9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/BatsMen1"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="TextView" />
<TextView
android:id="#+id/textView5"
android:textColor="#f8f8f9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
android:text="Bowling :"
android:textSize="17sp"
android:layout_below="#+id/BatsMen2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/Bowling"
android:textColor="#f8f8f9"
android:gravity="left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textView5"
android:layout_alignEnd="#+id/Batting"
android:layout_alignRight="#+id/Batting"
android:text="TextView" />
<TextView
android:id="#+id/Bowler"
android:layout_width="match_parent"
android:textColor="#f8f8f9"
android:layout_height="wrap_content"
android:layout_marginTop="18dp"
android:text="TextView"
android:layout_below="#+id/Bowling"
android:layout_centerHorizontal="true" />
<EditText
android:id="#+id/Runs"
android:layout_width="80dp"
android:layout_height="60dp"
android:background="#f8f8f9"
android:textSize="35sp"
android:padding="9dp"
android:ems="10"
android:inputType="numberSigned" />
<EditText
android:id="#+id/Wickets"
android:layout_width="60dp"
android:layout_height="60dp"
android:background="#f8f8f9"
android:textSize="35sp"
android:padding="9dp"
android:ems="10"
android:inputType="numberSigned"
android:layout_marginRight="27dp"
android:layout_marginEnd="27dp"
android:layout_alignBaseline="#+id/Runs"
android:layout_alignBottom="#+id/Runs"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/Runs"
android:layout_alignEnd="#+id/Runs"
android:layout_marginBottom="48dp" />
<TextView
android:id="#+id/textView4"
android:textColor="#f8f8f9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/Overs"
android:layout_alignStart="#+id/Overs"
android:layout_below="#+id/Overs"
android:layout_marginTop="10dp"
android:gravity="center"
android:text="Overs"
android:layout_alignRight="#+id/Overs"
android:layout_alignEnd="#+id/Overs" />
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#f8f8f9"
android:text="Runs"
android:layout_below="#+id/Runs"
android:layout_centerHorizontal="true"
android:layout_marginTop="18dp" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/Wickets"
android:layout_alignStart="#+id/Wickets"
android:layout_alignTop="#+id/textView6"
android:textColor="#f8f8f9"
android:text="Wickets"
android:gravity="center"
android:layout_alignRight="#+id/Wickets"
android:layout_alignEnd="#+id/Wickets" />
<TextView
android:id="#+id/Choose"
android:textColor="#f8f8f9"
android:textSize="10sp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/Vs"
android:text="Sultan Won The Toss And Choose to Bat"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<TextView
android:id="#+id/Overs"
android:layout_width="60dp"
android:layout_height="60dp"
android:text="TextView"
android:gravity="center"
android:background="#f8f8f9"
android:layout_marginTop="71dp"
android:layout_below="#+id/Bowler"
android:layout_toRightOf="#+id/textView4"
android:layout_toEndOf="#+id/textView4" />
</RelativeLayout>
TextView with id textView4 and TextView with id Overs are creating this circular dependency because:
TextView with id textView4 is alignLeft and alignRight to the TextView with id Overs. Again, TextView with id Overs is toRightOf to the TextView with id textView4.
It's not possible because they can't be dependent on each other.

Preventing TextView and ImageView Overlap In Relative Layout

I have a textView (titleTv) and an imageView (buyButton) which are sometimes have an overlap if the titleTv has a somewhat long name.
How might this be prevented? I understand this can be done using an external library - but it seems strange there isn't a simple way to accomplish this.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="7dip"
android:paddingTop="7dip" >
<TextView
android:id="#+id/titleTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/white"
android:paddingLeft="5dp"
android:text=""
android:textSize="20sp" />
<TextView
android:id="#+id/uploaderTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titleTv"
android:paddingLeft="5dip"
android:paddingTop="5dp"
android:textColor="#color/verylightgrey"
android:textSize="16sp" />
<TextView
android:id="#+id/viewCountTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titleTv"
android:layout_toRightOf="#id/uploaderTv"
android:paddingTop="5dp"
android:textColor="#android:color/black"
android:textSize="16sp" />
<ImageView
android:id="#+id/buyButton"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:paddingTop="7dip"
android:src="#drawable/buy_a_up_btn" />
</RelativeLayout>
Example:
(the overlapping fields are the video's title and the $ button)
http://i.stack.imgur.com/clpNv.png
just add your ImageView below that TextView. Add this attribute in your ImageView declaration
android:layout_below="#+id/titleTv"
Now the xml should be like this:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="7dip"
android:paddingTop="7dip" >
<TextView
android:id="#+id/titleTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/white"
android:paddingLeft="5dp"
android:text=""
android:textSize="20sp" />
<TextView
android:id="#+id/uploaderTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titleTv"
android:paddingLeft="5dip"
android:paddingTop="5dp"
android:textColor="#color/verylightgrey"
android:textSize="16sp" />
<TextView
android:id="#+id/viewCountTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titleTv"
android:layout_toRightOf="#id/uploaderTv"
android:paddingTop="5dp"
android:textColor="#android:color/black"
android:textSize="16sp" />
<ImageView
android:id="#+id/buyButton"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_below="#+id/titleTv"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:paddingTop="7dip"
android:src="#drawable/buy_a_up_btn" />
</RelativeLayout>
Try this:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="7dip"
android:paddingTop="7dip" >
<ImageView
android:id="#+id/buyButton"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:paddingTop="7dip"
android:src="#drawable/buy_a_up_btn" />
<TextView
android:id="#+id/titleTv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/buyButton"
android:background="#color/white"
android:paddingLeft="5dp"
android:text=""
android:textSize="20sp" />
<TextView
android:id="#+id/uploaderTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titleTv"
android:paddingLeft="5dip"
android:paddingTop="5dp"
android:textColor="#color/verylightgrey"
android:textSize="16sp" />
<TextView
android:id="#+id/viewCountTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titleTv"
android:layout_toRightOf="#id/uploaderTv"
android:paddingTop="5dp"
android:textColor="#android:color/black"
android:textSize="16sp" />
</RelativeLayout>

how to set a title and gap between paragraphs?

I want to rewrite an existing view to look like this:
This is my current xml and screenshot:
I'm using this 9 patch:
<!--
========================================================================
* Information layout - contains the explanation text on the background
========================================================================
-->
<RelativeLayout
android:id="#+id/layout_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/widget_bg_info1"
android:orientation="vertical" >
<TextView
android:id="#+id/text_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/widget_nodata_title"
android:textColor="#color/solid_white"
android:textSize="22sp"
android:layout_above="#+id/widget_error"
android:paddingBottom="20dp"/>
<ImageView
android:id="#+id/widget_error"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:src="#drawable/widget_error"
android:layout_centerHorizontal="true" />
<LinearLayout
android:id="#+id/layout_text_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/text_info1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="87dp"
android:gravity="left"
android:paddingLeft="18dp"
android:paddingRight="15dp"
android:text="#string/widget_nodata_info1"
android:textColor="#color/solid_black"
android:textSize="15sp" />
<TextView
android:id="#+id/text_info2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="10dp"
android:gravity="left"
android:paddingLeft="18dp"
android:paddingRight="15dp"
android:text="#string/widget_nodata_info2"
android:textColor="#color/solid_black"
android:textSize="15sp"
android:textStyle="bold" />
<TextView
android:id="#+id/text_info3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="10dp"
android:gravity="left"
android:paddingLeft="18dp"
android:paddingRight="15dp"
android:text="#string/widget_nodata_info3"
android:textColor="#color/solid_black"
android:textSize="15sp" />
</LinearLayout>
<!--
========================================================================
* Buttons layout - contains all the texts
========================================================================
-->
<LinearLayout
android:id="#+id/layout_buttons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal"
android:layout_below="#+id/layout_text_info"
android:layout_centerHorizontal="true"
android:gravity="center"
android:paddingTop="20dp">
<LinearLayout
android:layout_width="130dp"
android:layout_height="wrap_content"
android:background="#drawable/button_blue"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp" >
<TextView
android:id="#+id/text_btn_enter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/widget_no_data_accept"
android:textColor="#000000" />
</LinearLayout>
<LinearLayout
android:layout_width="130dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:background="#drawable/button_blue"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp" >
<TextView
android:id="#+id/text_btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/widget_no_data_close"
android:textColor="#000000" />
</LinearLayout>
</LinearLayout>
</RelativeLayout> <!-- -->
How pose the title on top the gray top area?
How to center the two bottom buttons?
This will fix your button layout to the bottom and center them as you want. If you can be more clear I can help you about the house image and title as well. (about the id names).
<LinearLayout
android:id="#+id/layout_buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:gravity="center"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="130dp"
android:layout_height="wrap_content"
android:background="#drawable/button_blue"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp" >
<TextView
android:id="#+id/text_btn_enter"
android:layout_width="wrap_content"
android:gravity="center"
android:layout_height="wrap_content"
android:text="#string/widget_no_data_accept"
android:textColor="#000000" />
</LinearLayout>
<LinearLayout
android:layout_width="130dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:background="#drawable/button_blue"
android:clickable="true"
android:gravity="center"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp" >
<TextView
android:id="#+id/text_btn_close"
android:layout_width="wrap_content"
android:gravity="center"
android:layout_height="wrap_content"
android:text="#string/widget_no_data_close"
android:textColor="#000000" />
</LinearLayout>
</LinearLayout>
If this is your imageview for the house picture, then it is fixed as well. Just give top margin as much as your want.
<ImageView
android:id="#+id/widget_error"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/text_title"
android:gravity="center"
android:src="#drawable/widget_error" />

How can i make a layout like as give below in the picture?

I am actually trying to create a layout like this but it seems to scatter all over the place.
Any help or idea to optimize it will be greatly appreciated.
xml
<RelativeLayout
android:id="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true" >
<ImageView
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/menu_normal"
android:onClick="onClickContentButton" />
<ImageView
android:id="#+id/new_chat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:onClick="actionPerformed"
android:src="#drawable/invite_friends_normal" />
<TextView
android:id="#+id/headerText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Profile"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/header"
android:background="#049080"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="My profile"
android:textColor="#FFFFFF"
android:textSize="15sp" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView1"
android:orientation="vertical"
android:weightSum="2" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/darker_gray"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="20dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/com_facebook_profile_picture_blank_square" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_alignTop="#+id/imageView1"
android:src="#drawable/bang_selected" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView1"
android:layout_toRightOf="#+id/imageView1"
android:text="John smith"
android:textColor="#2D2D2D"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView2"
android:layout_below="#+id/textView2"
android:text="latitude:"
android:textColor="#2d2d2d"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/textView2"
android:text="longitude:"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical" >
</LinearLayout>
</LinearLayout>
Graphical layout
I would make the main layout be a relative layout.
The "My Profile" button would be the first object in the layout
The segment underneath that can be another relative layout in which you would specify the association of all the elements.
And the bottom map portion would be the map view
Within the second portion, use a mix of vertical and horizontal linear layouts to get the look you desire

Why different android versions display different GUI?

Please have a look at the following code
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/tableLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFF"
android:gravity="right"
android:padding="5dp"
android:paddingBottom="5dp"
android:stretchColumns="1,2,3"
tools:context=".MainActivity" >
<TableRow
android:id="#+id/tableRow0"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/billTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:padding="5dp"
android:text="#string/billTextView"
android:textColor="#000" />
<EditText
android:id="#+id/billEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_span="3"
android:layout_weight="1"
android:inputType="numberDecimal"
android:longClickable="false" >
<requestFocus />
</EditText>
</TableRow>
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/tenTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_weight="1"
android:gravity="center"
android:text="10%"
android:textColor="#000" />
<TextView
android:id="#+id/fifteenTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="15%"
android:textColor="#000" />
<TextView
android:id="#+id/twentyTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="20%"
android:textColor="#000" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/tipTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:padding="5dp"
android:text="#string/tipTxtView"
android:textColor="#000" />
<EditText
android:id="#+id/tip10EditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
<EditText
android:id="#+id/tip15EditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
<EditText
android:id="#+id/tip20EditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
</TableRow>
<TableRow
android:id="#+id/tableRow3"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/totalTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:padding="5dp"
android:text="#string/totalTextView"
android:textColor="#000" />
<EditText
android:id="#+id/total10EditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
<EditText
android:id="#+id/total15EditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
<EditText
android:id="#+id/total20EditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
</TableRow>
<TableRow
android:id="#+id/tableRow4"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/customTextView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="right|center_vertical"
android:padding="5dp"
android:text="#string/customTextView"
android:textColor="#000" />
<SeekBar
android:id="#+id/customSeekBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_span="2"
android:layout_weight="1"
android:focusable="false"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:progress="18" />
<TextView
android:id="#+id/customTipTextView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical"
android:paddingLeft="5dp"
android:text="a"
android:textColor="#000" />
</TableRow>
<TableRow
android:id="#+id/tableRow5"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/tipCustomTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:padding="5dp"
android:text="#string/tipCustomTextView"
android:textColor="#000" />
<EditText
android:id="#+id/tipCustomEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
<TextView
android:id="#+id/totalCustomTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center|right"
android:padding="5dp"
android:text="#string/totalCustomTextView"
android:textColor="#000" />
<EditText
android:id="#+id/totalCustomEditText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:cursorVisible="false"
android:focusable="false"
android:gravity="center"
android:longClickable="false"
android:textSize="14sp" />
</TableRow>
</TableLayout>
The project is created using Android Version 3.2.
This is how it get displayed in Galaxy Nexus, which is set to Android version 2.3.3
This is how it get displayed in Galaxy Nexus, which is set to Android version 3.2
As you can see, in that new version one, the GUI is bit upset. It seems like the components are overlapping. That is why it doesn't show the borders of the components. Please help!
Yep, this is normal. The visual appearance of Android has been greatly polished with Android 4.0. It has nothing to do with your code directly. Android does this automatically.
If you want all your users to see the old style, you can set down the targetVersion within the <uses-sdk> tag of your manifest file. However, I discourage you from doing this.

Categories

Resources