I have created a relative layout under which i created 3 relative layout
1-for top textviews
2-for buttons at the bottom
3-for he scroll view
now i want to insert a table below 1st relative layout and above 2nd relative layout,which layout should i use? table has 3 columns first cloumn and secound column as text view and 3rd colums as edit text,the data being displayed on the table is coming from database.
so i wanna know which layout shall i use? and how can i display the table?
Its better to use LinearLayout
See this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:padding="5dp">
<ScrollView android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:fadingEdge="none" android:focusable="false">
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:stretchColumns="*">
<TableRow android:gravity="center" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Series"
android:layout_gravity="center"></TextView>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Series"
android:layout_gravity="center"></TextView>
<EditText android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Series"
android:layout_gravity="center"></EditText>
</TableRow>
<TableRow android:gravity="center" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Series"
android:layout_gravity="center"></TextView>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Series"
android:layout_gravity="center"></TextView>
<EditText android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Series"
android:layout_gravity="center"></EditText>
</TableRow>
</TableLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
Note: You can also set width of TextView and EditText and more importantly you can set the
gravity and align it accordingly.
Also, LinearLayout is useful when you need to add the rows dynamically.It will be
useful to you as you are getting the data from database
Related
I use tableLayout, and I want to set height of tableRow as tall as it has to be in order to display textViews correctly (which are in linearLayout). At the moment, the second textView is not displayed correctly (it simply doesn't fit in the row).
This is the XML:
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#color/background">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/stripe_background"
android:gravity="right|center_vertical"
android:paddingTop="#dimen/stripe_padding_buttons_top_bottom"
android:paddingBottom="#dimen/stripe_padding_buttons_top_bottom"
android:paddingLeft="#dimen/stripe_padding_sides"
android:paddingRight="#dimen/stripe_padding_sides"
android:layout_marginBottom="#dimen/stripe_margin_top_bottom">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_column="0"
android:layout_weight="1"
android:paddingRight="#dimen/stripe_padding_between_text_views"
android:gravity="right|center_vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/settings_text_view_current_consumption_main"
android:id="#+id/textViewCurrentConsumptionMain"
android:textColor="#color/big_text"
android:textSize="#dimen/small_text"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/settings_text_view_current_consumption_additional"
android:id="#+id/textViewCurrentConsumptionAdditional"
android:textColor="#color/small_text"/>
</LinearLayout>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/checkBox"
android:layout_column="1"
android:button="#drawable/check_box_custom"
android:checked="true" />
</TableRow>
</TableLayout>
In order to make my question clearer, this is the problem in the image. Second textView is not displayed properly:
Make LinearLayout and all TextViews heights to wrap_content (TableRow) also
Here is my XML.
I want to align the icon to the left and the text should appear right next to the icon, with some space, like you see elsewhere. But the text is showing up in the center. (or right aligned to the 2nd column, in two column layout)
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_scroll"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:background="#android:color/white"
android:layout_margin="5dp"
android:stretchColumns="2"
android:layout_height="wrap_content">
<TableRow
android:id="#+id/events_header"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:drawable/list_selector_background"
android:clickable="true"
android:padding="5dip">
<ImageView android:id="#+id/ImageView02"
android:src="#drawable/event_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|left"
android:layout_margin="5dp">
</ImageView>
<TextView
android:id="#+id/text1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="View Events"
android:layout_gravity="left"
android:textSize="21dp"
android:textStyle="bold"
android:background="#android:color/black"
android:textColor="#android:color/white" />
</TableRow>
</TableLayout>
</ScrollView>
This is how it displays:
[ * View Events ]
is the icon. I want to display like this.
[ * View Events ]
Try changing android:stretchColumns="2" to android:stretchColumns="1" because column index starts with 0. So if you only have two columns then the second column stands at index 1.
I have a linear layout with just a single TableLayout in it.
The Table Layout further has two rows with two columns each.
First Table Row has two Images.
Second Table Rows has two buttons.
But this does not show up on the complete screen, rather only shows on the first half or maybe depends on the image height. Both the images are actually same file, but shown with different Widths.
Help please...
here is the Layout file
<?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="fill_parent"
android:orientation="vertical">
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:stretchColumns="*">
<TableRow
android:layout_height="fill_parent">
<ImageView
android:id="#+id/tp_image"
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="0.9"
android:scaleType="fitXY"
android:src="#drawable/images" />
<ImageView
android:id="#+id/s_image"
android:src="#drawable/images"
android:layout_width="0dip"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:layout_weight="0.1"
/>
</TableRow>
<TableRow >
<Button
android:id="#+id/button_LC"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/button_LC"/>
<Button
android:id="#+id/button_RC"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/button_RC"/>
</TableRow>
</TableLayout>
</LinearLayout>
set
<TableRow
android:layout_height="0dp"
android:layout_weight="1" >
to both table rows or just to the first row.
The layout definition is below. Basically I want the two buttons to be the same width, but right now their width is determined by the string they display, is there a better way to lay this out such that the buttons are the same width and that the Button+EditText combo fills the width of the screen?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/editorlinearlayout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center">
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/setNameBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Set Item Name "/>
<EditText android:id="#+id/nameTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:id="#+id/setGroupBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set Group Name"/>
<EditText android:id="#+id/groupTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
Edit:
I've tried using a TableLayout as was suggested below, but now the EditText's don't fill the remaining portion of the screen. See the image and layout below.
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TableRow>
<Button android:id="#+id/setNameBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Set Item Name "/>
<EditText android:id="#+id/nameTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
<TableRow>
<Button android:id="#+id/setGroupBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set Group Name"/>
<EditText android:id="#+id/groupTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
the trick is to combine the tableview defined in the edit above with a strechColumn tag:
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:stretchColumns="1">
<TableRow>
<Button android:id="#+id/setNameBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Set Item Name "/>
<EditText android:id="#+id/nameTxtBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
Use a TableLayout and TableRows.
Three options:
Put this in a TableLayout instead of the nested LinearLayout thing you are currently doing
Change your nesting from a vertical parent with horizontal children to a horizontal parent with vertical children (however, this opens up possible vertical positioning issues, so I don't favor this option)
Use a RelativeLayout and all of the layout_* attributes that RelativeLayout children have available to them
I'd favor option 1, personally.
you can use specific width and height for laout_width/layout_height, as in layout_width="150dip". You run the risk of having a button that can't fit all your text though, but if your text is fixed, you can double check to make sure it's all good.
I am trying out this table layout in which there are three columns, each column utilizing the maximum space as they could (using strechColumn tag). Now when a column gets content which is too long, then table layout jumps off the screen.
How can I set the content of a column to wrap, so that table layout doesn't jump off the screen.
here is the XML code for table layout i used
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:scrollbars="vertical"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="0,1,2"
android:id="#+id/tLayout"
android:scrollbars="vertical"
>
<TableRow
android:layout_width="fill_parent">
<TextView
android:padding="3dip"
android:gravity="left"
android:text="Name"
/>
<TextView
android:padding="3dip"
android:gravity="left"
android:text="Address"
/>
<TextView
android:padding="3dip"
android:gravity="left"
android:text="Age"
/>
</TableRow>
</TableLayout>
</ScrollView>
There is a corresponding android:shrinkColumns that you can specify in your TableLayout.