开发者

Android UI: Multiple Horizontally Paged Table

开发者 https://www.devze.com 2023-03-13 02:13 出处:网络
I am trying to implement a UI that contains a data table (populated dynamically) displayed using a TableLayout.I would like 4 columns of the table to be displayed by default, with the ability to horiz

I am trying to implement a UI that contains a data table (populated dynamically) displayed using a TableLayout. I would like 4 columns of the table to be displayed by default, with the ability to horizontally scroll the table to reveal 4 (or more) additional columns. Is this possible using a TableLayout combined with a horizontal/vertical ScrollView? I would appreciate any example XML exhibiting this style.

Here is an example to c开发者_StackOverflow社区larify:

Default table view

Android UI: Multiple Horizontally Paged Table

View after scrolling to right

Android UI: Multiple Horizontally Paged Table


You should be able to achieve this by placing your TableLayout inside a HorizontalScrollView. Define the width of your elements inside your TableLayout

Something like this (i did not test this):

<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/hsv1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">

    <TableLayout android:layout_height="wrap_content" 
           android:gravity="center" 
           android:layout_width="wrap_content"  
           android:id="@+id/tl1" 
           android:scrollbars="horizontal">

        // Your other elements go here.

    </TableLayout>
</HorizontalScrollView>


I am not sure if this directly solves your problem, but do take a look at android-viewflow on github. https://github.com/pakerfeldt/android-viewflow


The way I went about solving this was by using a ViewFlipper. I am rather surprised no one had mentioned this before.

I changed my XML around to look like this:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
                        android:id="@+id/hsv1"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content">
        <ViewFlipper android:id="@+id/dataTableFlipper"
                 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="wrap_content"
                            android:id="@+id/dataTable"
                            android:stretchColumns="*">
                </TableLayout>
                <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
                            android:layout_width="fill_parent" 
                            android:layout_height="wrap_content"
                            android:id="@+id/dataTable2"
                            android:stretchColumns="*">
                </TableLayout>
        </ViewFlipper>
</ScrollView>

This way I could manage each page of the table as separate TableLayouts.

Declaring the ViewFlipperprogrammatically allowed me to use ViewFlipper.showNext() to alternate between the two tables. Works like a charm!

0

精彩评论

暂无评论...
验证码 换一张
取 消