【问题标题】:Android: How to swipe columns in a TableLayout?Android:如何在 TableLayout 中滑动列?
【发布时间】:2015-11-16 08:43:09
【问题描述】:

我正在尝试在支持列滑动的 Fragment 中创建一个 TableLayout。

如下链接中的图片所示,第一列(“Header 1”)应该是固定的,而其他列(“Header 2”、“Header 3”和“Header 4”)应该是可滑动的。

根据它所在的列,标题还应显示一个或两个箭头图标。单击这些箭头图标时,列也应更改。

任何想法如何最好地实现这一点? 提前致谢。

Show image

【问题讨论】:

  • 其实我没有得到你的要求!我希望你知道ViewPager 的功能。 (如果不是,请检查一次)稍后检查是否满足。因为你问的和ViewPager一模一样,所以你不需要TableLayout。要显示这些数据列表,您可以使用ListViewLinearLayout(垂直方向),甚至可以使用TableLayout 单列!如果这不是您的要求,请详细说明您的要求!

标签: android android-layout android-viewpager tablelayout swipe-gesture


【解决方案1】:

检查ViewPager 是否有滑动片段。 Here是教程。

将此插入为TableLayoutTableRow 的子级:

<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />

【讨论】:

    【解决方案2】:

    首先感谢大家。好像我没有看到明显的。

    对我来说,解决方案是对第一列使用固定的 ListView,对可滑动的列使用带有 ListView 的 ViewPager。

    因此,在我的主布局文件中,我声明了一个 ListView 和一个 ViewPager,它们的布局权重都设置为 0.5。这样可以确保固定列和可滑动列具有相同的宽度:

    my_main_layout.xml

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:padding="16dp">
    
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:orientation="vertical">
    
        <TextView
            android:id="@+id/firstColumnHeader"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:paddingRight="@dimen/padding_horizontal_small"
            android:textAppearance="?android:textAppearanceMedium"
            android:textStyle="bold" />
    
        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@color/gray" />
    
    
        <ListView
            android:id="@+id/firstColumnList"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:divider="@null"
            android:dividerHeight="0dp"
            android:scrollbars="none"
            />
    </LinearLayout>
    
    
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:listSelector="@android:color/transparent"
        android:layout_weight="0.5" />
    

    对于可滑动的列,我使用 ListView 和一个包含列名和两个箭头的水平 LinearLayout 创建了第二个自定义布局文件:

    slideable_column_layout.xml

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
    
    <LinearLayout
        android:id="@+id/viewpagerHeader"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal">
    
        <ImageView
            android:id="@+id/leftPagerArrow"
            android:layout_width="wrap_content"
            android:layout_height="15dp"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="10dp"
            android:adjustViewBounds="true"
            android:src="@drawable/arrow_left" />
    
        <TextView
            android:id="@+id/headerText"
            android:textAppearance="?android:textAppearanceMedium"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textStyle="bold" />
    
        <ImageView
            android:id="@+id/rightPagerArrow"
            android:layout_width="wrap_content"
            android:layout_height="15dp"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="10dp"
            android:adjustViewBounds="true"
            android:src="@drawable/arrow_right" />
    
    </LinearLayout>
    
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@color/gray" />
    
    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:divider="@null"
        android:dividerHeight="0dp"
        android:listSelector="@android:color/transparent"
        android:scrollbars="none" />
    

    然后,在我想要使用可滑动列的 Fragment 中,我实现了 ViewPager、PagerAdapter 和 ListViews:

    import android.app.Fragment;
    import android.app.FragmentManager;
    import android.app.ListFragment;
    import android.os.Bundle;
    import android.support.v13.app.FragmentStatePagerAdapter;
    import android.support.v4.view.PagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ArrayAdapter;
    import android.widget.ImageView;
    import android.widget.ListView;
    import android.widget.TextView;
    
    
    public class MyFragment extends Fragment {
    
        private static final int NUM_PAGES = 4;
        private static final String[] titles = {"Column2", "Column3", "Column4", "Column5"};
        private final String[] column_one = {"Data 1.0", "Data 1.1", "Data 1.2", "Data 1.3"};
    
        public static final String[] column_two = {"Data 2.0", "Data 2.1", "Data 2.2", "Data 2.3"};
    
        public static final String[] column_three = {"Data 3.0", "Data 3.1", "Data 3.2", "Data 3.3"};
    
        public static final String[] column_four = {"Data 4.0", "Data 4.1", "Data 4.2", "Data 4.3"};
    
        public static final String[] column_five = {"Data 5.0", "Data 5.1", "Data 5.2", "Data 5.3"};
    
    
        public static ViewPager mViewPager;
        private PagerAdapter mAdapter;
        private ListView mListView;
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
            View view = inflater.inflate(R.layout.my_main_layout,
                    container, false);
    
            //Set ListView and its adapter
            mListView = (ListView) view.findViewById(R.id.firstColumnList);
            ArrayAdapter<String> sAdapter = new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1, column_one);
            mListView.setAdapter(sAdapter);
    
            //Set ViewPager and its adapter
            mViewPager = (ViewPager) view.findViewById(R.id.pager);
            mAdapter = new ViewPagerAdapter(getFragmentManager());
            mViewPager.setAdapter(mAdapter);
    
            return view;
        }
    
        public static class ViewPagerAdapter extends FragmentStatePagerAdapter {
            public ViewPagerAdapter(FragmentManager fm) {
                super(fm);
            }
    
            @Override
            public int getCount() {
                return NUM_PAGES;
            }
    
            @Override
            public CharSequence getPageTitle(int position) {
                return titles[position];
            }
    
            @Override
            public Fragment getItem(int position) {
                return SlidingListFragment.newInstance(position);
            }
    
    
        }
    
        public static class SlidingListFragment extends ListFragment {
    
            private int mNum;
            private ImageView leftArrow;
            private ImageView rightArrow;
    
            @Override
            public void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                if (getArguments() != null) {
                    mNum = getArguments().getInt("num");
    
                } else {
                    mNum = 1;
                }
            }
    
            @Override
            public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                     Bundle savedInstanceState) {
                View view = inflater.inflate(R.layout.sliding_column_layout,
                        container, false);
    
                ListView slidingList = (ListView) view.findViewById(android.R.id.list);
                TextView header = (TextView) view.findViewById(R.id.headerText);
                header.setText(getHeader());
                leftArrow = (ImageView) view.findViewById(R.id.leftPagerArrow);
                rightArrow = (ImageView) view.findViewById(R.id.rightPagerArrow);
                if (leftArrow.getVisibility() == View.VISIBLE) {
                    leftArrow.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            mViewPager.setCurrentItem(mNum - 1);
                        }
                    });
                }
                if (rightArrow.getVisibility() == View.VISIBLE) {
                    rightArrow.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            mViewPager.setCurrentItem(mNum + 1);
                        }
                    });
                }
                setArrows();
    
                slidingList.setAdapter(new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1, getMyListArray()));
    
                return view;
            }
    
            private String getHeader() {
                String header = "";
                switch (mNum) {
                    case 0:
                        header = titles[0];
                        break;
                    case 1:
                        header = titles[1];
                        break;
                    case 2:
                        header = titles[2];
                        break;
                    case 3:
                        header = titles[3];
                        break;
                }
                return header;
            }
    
            private void setArrows() {
                switch (mNum) {
                    case 0:
                        leftArrow.setVisibility(View.INVISIBLE);
                        break;
                    case 1:
                        break;
                    case 2:
                        break;
                    case 3:
                        rightArrow.setVisibility(View.INVISIBLE);
                        break;
                }
            }
    
            private String[] getMyListArray() {
                String[] returnArray = {"no lists"};
                switch (mNum) {
                    case 0:
                        returnArray = column_two;
                        break;
                    case 1:
                        returnArray = column_three;
                        break;
                    case 2:
                        returnArray = column_four;
                        break;
                    case 3:
                        returnArray = column_five;
                        break;
                }
                return returnArray;
            }
    
    
            /**
             * Create a new instance of SlidingFragment, providing "num"
             * as an argument.
             */
            static SlidingListFragment newInstance(int num) {
                SlidingListFragment f = new SlidingListFragment();
    
                // Supply num input as an argument.
                Bundle args = new Bundle();
                args.putInt("num", num);
                f.setArguments(args);
    
                return f;
            }
    
        }
    
    }
    

    我不知道这是否是最有效的解决方案,但它正在工作:-)

    【讨论】:

      【解决方案3】:

      【讨论】:

      • 谢谢,我知道链接,但我不知道如何将 Viewpager 与 TableLayout 结合起来
      • 它们是不同的。您可以在其中一个页面中使用 TableLayout,但如果通常仅用于在一个屏幕上显示项目,则可以使用表格布局。 TableLayout 不提供您正在寻找的滑动功能。相反,将“ViewPager”的每个“页面”视为表格的一列。效果非常相似。
      猜你喜欢
      • 1970-01-01
      • 2011-07-27
      • 2011-06-11
      • 2016-01-10
      • 2014-07-27
      • 2013-01-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多