Android TableLayout Header row - android

Okay, so I've got this TableLayout, and its full of data - with all of the rows added programmatically. I've got the TableLayout inside of a HorizontalScrollView, which in turn is inside a ScrollView - this gives me scrolling both horizontally and vertically. What I'm trying to do now is add a header row to it that will not scroll. I've tried moving things around so that both of my scroll views were actually inside of the TableLayout and adding the TableRows to the HorizontalScrollView; my hope was to be able to then add the header row outside of the scroll views.
The only other thing I can think of is having a second table layout just for the header row, but getting the columns to line up seems like it would be difficult. Any ideas?

One approach is by embedding a TableLayout within another TableLayout's row and putting the header in the preceding row as seen below. Aligning the data and the header requires the layout_width property of the header View objects and the data's View objects to be set to the same dip values. Also, the layout_weight property of the inner TableLayout's View objects must match its corresponding header.
Now, in the XML below, I have placed 3 TextViews in the inner TableLayout in a single row to match with the column headers. This is just to show how the alignment can be done. You can populate that data programmatically by inflating a layout and adding it at runtime.
<?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">
<TableRow>
<TextView android:text="Name"
android:layout_width="100dp"
android:layout_column="0"
android:layout_weight="1"/>
<TextView android:text="Score"
android:layout_width="30dp"
android:layout_column="1"
android:layout_weight="1">
</TextView>
<TextView android:text="Level"
android:layout_width="30dp"
android:layout_column="2"
android:layout_weight="1">
</TextView>
</TableRow>
<ScrollView android:layout_height="120dp">
<TableLayout android:id="#+id/score_table"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableRow>
<TextView android:text="Al"
android:layout_width="100dp"
android:layout_column="0"
android:layout_weight="1">
</TextView>
<TextView android:text="1000"
android:layout_width="30dp"
android:layout_column="1"
android:layout_weight="1">
</TextView>
<TextView android:text="2"
android:layout_width="30dp"
android:layout_column="2"
android:layout_weight="1">
</TextView>
</TableRow>
</TableLayout>
</ScrollView>
</TableLayout>

I actually came up with another decent way of doing this.
Simply build the table normally with the header row as the first row, inside of a vertical orientation LinearLayout. Next, programmatically remove the first row then add it as the first child to the LinearLayout. This worked like a charm.
Edit: This also works without having to specify static column widths.

I know that the question is old, but it was the first one, that Google gave me as I've had the same problem. And since I think I've found a better solution, I would like to share it.
Idea: put the TableLayout (inside the ScrollView) into RelativeLayout and create an overlay, that would draw the first (header) row over everything else.
Here is layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/table_wrapper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:ignore="UselessParent"
>
<TableLayout
android:id="#+id/table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</ScrollView>
</RelativeLayout>
And here is the code:
TableLayout table = (TableLayout)view.findViewById(R.id.table);
final TableRow headerRow = new TableRow(context);
table.addView(headerRow);
table.addView(new TableRow(context));
table.addView(new TableRow(context));
table.addView(new TableRow(context));
RelativeLayout tableWrapper = (RelativeLayout)view.findViewById(R.id.table_wrapper);
View fakeHeaderView = new View(context) {
#Override
public void draw(Canvas canvas) {
headerRow.draw(canvas);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int width = headerRow.getMeasuredWidth();
int height = headerRow.getMeasuredHeight();
widthMeasureSpec = MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY);
heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
};
tableWrapper.addView(fakeHeaderView);

<?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">
<TableRow>
<TextView android:text="Name"
android:layout_width="100dp"
android:layout_column="0"
android:layout_weight="1"/>
<TextView android:text="Score"
android:layout_width="30dp"
android:layout_column="1"
android:layout_weight="1">
</TextView>
<TextView android:text="Level"
android:layout_width="30dp"
android:layout_column="2"
android:layout_weight="1">
</TextView>
</TableRow>
<ScrollView android:layout_height="120dp">
<TableLayout android:id="#+id/score_table"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableRow>
<TextView android:text="Al"
android:layout_width="100dp"
android:layout_column="0"
android:layout_weight="1">
</TextView>
<TextView android:text="1000"
android:layout_width="30dp"
android:layout_column="1"
android:layout_weight="1">
</TextView>
<TextView android:text="2"
android:layout_width="30dp"
android:layout_column="2"
android:layout_weight="1">
</TextView>
</TableRow>
</TableLayout>
</ScrollView>
</TableLayout>

For those not happy with having to pre-define your sizes, I found a bit of a hack that's working for me.
Basically, make a separate table for the title and put it over your main table, but with the same Top alignment, then create two copies of the title row and after adding one to the main table, add the other to the title table and set the child view's layoutParams to the row form the main table.
Here's my basic example.
in your layout:
<HorizontalScrollView
android:id="#+id/table_horizontal_scroll_view"
android:layout_alignParentTop="true"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:clickable="false">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ScrollView
android:layout_alignParentTop="true"
android:layout_marginTop="0dp"
android:id="#+id/table_vertical_scroll_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/grid_table_layout"
/>
</ScrollView>
<TableLayout
android:layout_alignLeft="#+id/table_vertical_scroll_view"
android:layout_alignRight="#+id/table_vertical_scroll_view"
android:layout_alignStart="#+id/table_vertical_scroll_view"
android:layout_alignEnd="#+id/table_vertical_scroll_view"
android:layout_alignParentTop="true"
android:background="#color/grid_view_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/grid_floating_row_layout"
/>
</RelativeLayout>
</HorizontalScrollView>
Then when you add your rows:
//clear out any views
tableLayout.removeAllViews();
floatingRowLayout.removeAllViews();
TableRow[] rows = getTableContentRows() // content of your table
TableRow[] titleRows = {getTitleRow(), getTitleRow()}; //two copies of your title row
tableLayout.addView(titleRows[0]); // first add the first title to the main table
addRows(rows) // add any other rows
floatingRowLayout.addView(titleRows[1]); // floatingRowLayout is connected to id/grid_floating_row_layout
titleRows[0].setVisibility(View.INVISIBLE); // make the title row added to the main table invisible
// Set the layoutParams of the two title rows equal to each other.
// Since this is done after the first is added to the main table, they should be the correct sizes.
for(int i = 0; i < titleRows[0].getChildCount(); i++) {
titleRows[1].getChildAt(i).setLayoutParams(titleRows[0].getChildAt(i).getLayoutParams());
}

Use Two tableLayout One in ScrollView like give android:stretchColumns="*"
<RelativeLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:paddingTop="5dp"
android:layout_height="match_parent"
android:layout_below="#+id/llSpinner">
<TableLayout
android:layout_width="match_parent"
android:id="#+id/tableHead"
android:stretchColumns="*"
android:layout_height="wrap_content">
</TableLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/tableTotal"
android:layout_below="#+id/tableHead"
android:id="#+id/scrolltable">
</ScrollView>
<TableLayout
android:layout_width="match_parent"
android:id="#+id/tableTotal"
android:stretchColumns="*"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content">
</TableLayout>
</RelativeLayout>
then create a common view for ROWs and most important mention android:layout_width="0dp"
<TableRow
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:focusable="true"
android:focusableInTouchMode="false"
android:clickable="true"
android:background="#android:drawable/list_selector_background">
<TextView
android:text="S.No"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/tbsNo"
android:layout_weight="1"
android:gravity="center"
android:layout_column="1" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Date"
android:layout_weight="1"
android:gravity="center"
android:id="#+id/tbDate"
android:layout_column="2" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Count"
android:layout_weight="1"
android:gravity="center"
android:id="#+id/tbMrCount"
android:layout_column="3" />
</TableRow>
Now in Activity
Tablelayout tableHeading =(TableLayout)findViewById(R.id.tableHead);
Tablelayout table =(TableLayout) findViewById(R.id.table_repots);
trHeading = (TableRow) getLayoutInflater().inflate(R.layout.table_row_item, null);
trHeading.setBackgroundColor(Color.parseColor("#6688AC"));
trHeading.setPadding(0,10,0,10);
TextView tv;
tv = (TextView) trHeading.findViewById(R.id.tbsNo);
tv.setText("S.No");
tv = (TextView) trHeading.findViewById(R.id.tbDate);
tv.setText("Date");
table.addView(tv);

Related

Scrollview and Tablelayout usage with banner to bottom in xml

This is my xml file. There are 35 xml files like this in my app. Their textview and button numbers are different. Some of them are more than 10 , some of are less than 5. But considering the devices screen, i designed all xml files using scroll view. Also i needed tablelayout and used tablelayout, table row inside it and textviews inside tablerows. When i finished the app everything was ok. Now i added mobile ad banners in xml files and it started to crash.
If i add the banner just before ending of tablelayout , app doesnt crash and ad is displayed at teh end of table but the vision is too bad.Because if there are 3 rows in the xml then the banner takes place after the last textview and this is something like the middle of the page. No matter how many textviews the xml use, i want them to be scrollable and in the end i want the banner take place at the end of the page.
I tried some android:gravity="bottom" or
alignparentbottom="true" things but they didn't work. In my researches i realised that i may need to add some linear or relative layout codes but when i tried them thay dont fit with scrollview and crash. Here is one of the xml files. How should i need to modify this ?
In the images , First one is how it works , the banner takes place where the textview ends , i want the second image , no matter how long the tetviews the banner should be at the bottom of the page.
<?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:background="#drawable/blue">
<TableLayout
android:id="#+id/table"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TableRow android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:padding="5dp"
android:text="TRY"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#FFFFFF" >
</TextView>
// some other buttons or textviews...
</TableRow>
</TableLayout>
<com.startapp.android.publish.banner.Banner
android:id="#+id/startAppBanner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</ScrollView>
If the banner needs to be always shown at the bottom,
you can set the weight of the ScrollView in a LinearLayout to 1.
Example
<?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"
android:background="#drawable/blue">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:background="#drawable/blue">
<TableLayout
android:id="#+id/table"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TableRow android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:padding="5dp"
android:text="TRY"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#FFFFFF" >
</TextView>
// some other buttons or textviews...
</TableRow>
</TableLayout>
</ScrollView>
<com.startapp.android.publish.banner.Banner
android:id="#+id/startAppBanner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
I can't test the code here because I do not have the Banner component but try wrapping both the TableLayout and the Banner in a LinearLayout.
modified layout file
<?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:background="#drawable/blue">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TableLayout
android:id="#+id/table"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TableRow android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:padding="5dp"
android:text="TRY"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#FFFFFF" />
</TableRow>
</TableLayout>
<com.startapp.android.publish.banner.Banner
android:id="#+id/startAppBanner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</LinearLayout>
</ScrollView>
UPDATE
After testing the file locally I realized that crash is being caused by the Banner because a ScrollView can have only one child. I'm surprised that you were able to compile your project with the error in the layout file. So one solution is wrap the TableLayout and Banner in a LinearLayout. See example 1:
example 1
<?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="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TableLayout
android:id="#+id/table"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="TRY"
android:textAppearance="?android:attr/textAppearanceMedium"
/>
</TableRow>
</TableLayout>
<com.startapp.android.publish.banner.Banner
android:id="#+id/startAppBanner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</LinearLayout>
</ScrollView>
After thinking about it, it may be possible to eliminate the TableLayout completely. You can use a LinearLayout to stack items on top of each other. So that would simplify your layout file quite a bit. See example 2.
example 2
<?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:background="#drawable/blue">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:padding="5dp"
android:text="TRY"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#FFFFFF" />
<com.startapp.android.publish.banner.Banner
android:id="#+id/startAppBanner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</LinearLayout>
</ScrollView>
UPDATE 2
Then your issue must be with your Java file. I have tested the layout file locally and it does render properly. See screenshot below.
UPDATE 3
The solution required updates to both the layout file and the Activity class. The logic is fairly simple. If the number of rows in the table cause the table height to exceed the height of the scrollview, then scrolling is enabled. If scrolling is enabled, the banner ad is appended as child of the table. If scrolling is disabled, the banner ad is inserted as a child of the linearlayout. In order to determine the correct heights it is necessary to subscribe to the OnGlobalLayout event. The following code is a ** working sample ** of what you will need. In order to test both scenarios (scrolling enabled/disabled) just change the value of the ROW_COUNT variable. I used 3 for scrolling disabled and 30 for enabled. You will see the banner placed appropriately.
activity_test.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativelayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/linearlayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ScrollView
android:id="#id/scrollview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#e0e0e0">
<TableLayout
android:id="#+id/table"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp"
android:text="TRY" />
</TableRow>
</TableLayout>
</ScrollView>
</LinearLayout>
</RelativeLayout>
TestActivity.java
public class TestActivity extends Activity {
private static String TAG = "TestActivity";
private Activity mActivity;
private LinearLayout mLinearLayout;
private TableLayout mTableLayout;
private RelativeLayout mRelativeLayout;
private static int ROW_COUNT = 30;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
Log.d(TAG, "onCreate");
mActivity = this;
mRelativeLayout = (RelativeLayout)findViewById(R.id.relativelayout);
mLinearLayout = (LinearLayout)findViewById(R.id.linearlayout);
mTableLayout = (TableLayout)findViewById(R.id.table);
float density = getResources().getDisplayMetrics().density;
final int padding = (int)Math.floor((density * 20f));
for(int i=0;i<ROW_COUNT;i++){
TextView view = new TextView(mActivity);
view.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT));
view.setPadding(padding,padding,padding,padding);
view.setText("TableRow");
TableRow row = new TableRow(mActivity);
row.setLayoutParams(new TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT, TableRow.LayoutParams.WRAP_CONTENT));
row.addView(view);
mTableLayout.addView(row);
}
ViewTreeObserver observer = mRelativeLayout.getViewTreeObserver();
observer.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
TextView view = (TextView) findViewById(R.id.banner);
if(view == null){
view = new TextView(mActivity);
view.setId(R.id.banner);
view.setBackgroundColor(Color.LTGRAY);
view.setText("BannerAd");
view.setGravity(Gravity.CENTER_HORIZONTAL);
view.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
view.setPadding(0, padding, 0, padding);
if(mTableLayout.getHeight() > mLinearLayout.getHeight()) {
mTableLayout.addView(view);
}else{
mLinearLayout.addView(view);
}
}
}
});
}
}
I can post screenshots if needed, but test this code out and let me know if you have any questions.

How to set height according to the highest column?

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

fixed first TableRow android

I have a table layout inside this table I defined a tablerow with 4 edittexts as columns headers.
My problem is that I want to make this static row as a fixed position, so while I scroll the screen down this row position doesn't changed.
I load the other rows dynamically from DB.
thank for help!
this is my xml code:
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/horizontalScrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background">
<ScrollView
android:id="#+id/scrollViewPhysicalExam"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableLayout
android:id="#+id/TLArchiveHeader"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TableRow style="#style/HeaderRow">
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Owner name"/>
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Phone" />
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Address" />
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Mail" />
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Fax" />
</TableRow>
</TableLayout>
</LinearLayout>
</ScrollView>
</HorizontalScrollView>
First of all,
Why do u need LinearLayout inside ScrollView?
TableLayout will spread rows vertically without LinearLayout.
Second - a ton of views will significantly slow down application performance.
Consider replacing TableLayout to.. maybe a ListView or code your own component. As i understand you need a simple table with text-only fields - it's not so hard to implement a single, fast and simple to use component.
Third - the solution - just place header row outside ScrollView, like this:
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/horizontalScrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background">
<TableLayout
android:id="#+id/TLArchiveHeader"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TableRow style="#style/HeaderRow">
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Owner name"/>
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Phone" />
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Address" />
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Mail" />
<TextView
style="#style/HeaderText"
android:layout_width="200dp"
android:text="Fax" />
</TableRow>
</TableLayout>
<ScrollView
android:id="#+id/scrollViewPhysicalExam"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableLayout
android:id="#+id/TLArchiveRowPlaceholder"
android:layout_height="wrap_content"
android:layout_width="match_parent">
</TableLayout>
</ScrollView>
</HorizontalScrollView>
Add rows to TLArchiveRowPlaceholder.
But in this case u need to have fixed widths of column. Or update header column widths after each main table update to not get headers misaligned.
Hope this helps.
My bad.
Why answers were in comments?
Didn't read them before =)

How can I layout two buttons to be the same size?

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.

how to insert table between two realtive layouts?

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

Categories

Resources