Android: 如何在 TableLayout 中滑动列?
Android: How to swipe columns in a TableLayout?
我正在尝试在支持列滑动的 Fragment 中制作 TableLayout。
如下面 link 中的图像所示,第一列 ("Header 1") 应该固定,而其他列 ("Header 2"、"Header 3" 和"Header 4" ) 应该可以滑动。
根据所在的列,header 还应显示一个或两个箭头图标。单击这些箭头图标时,列也应更改。
关于如何最好地实施它有什么想法吗?
提前致谢。
查看 ViewPager
和 PagerAdapter
http://developer.android.com/training/animation/screen-slide.html
检查 ViewPager
滑动片段。 Here 是教程。
将此作为您的 TableLayout
的 TableRow
的子项插入:
<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" />
首先感谢大家。好像没看清楚。
我的解决方案是为第一列使用固定的 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;
}
}
}
我不知道这是否是最有效的解决方案,但它确实有效:-)
我正在尝试在支持列滑动的 Fragment 中制作 TableLayout。
如下面 link 中的图像所示,第一列 ("Header 1") 应该固定,而其他列 ("Header 2"、"Header 3" 和"Header 4" ) 应该可以滑动。
根据所在的列,header 还应显示一个或两个箭头图标。单击这些箭头图标时,列也应更改。
关于如何最好地实施它有什么想法吗? 提前致谢。
查看 ViewPager
和 PagerAdapter
http://developer.android.com/training/animation/screen-slide.html
检查 ViewPager
滑动片段。 Here 是教程。
将此作为您的 TableLayout
的 TableRow
的子项插入:
<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" />
首先感谢大家。好像没看清楚。
我的解决方案是为第一列使用固定的 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;
}
}
}
我不知道这是否是最有效的解决方案,但它确实有效:-)