《****教学软件》Android tabLayout配合viewPage制作练习题界面
前言
最近开发一款学习软件，练手作品，我暂且命名《****教学软件》。本人初开发android软件，边学习边制作边记录，为以后不踩坑做一下记录。在做这个软件的过程中，会不断记录。后期会分享一下我做的软件包。
由于边开发边记录，只展示比较重要的部分代码，所以代码可能比较杂乱。大家觉得代码不正确或不清晰的，可以在讨论留言，大家一起学习，一起进步
借鉴到学习通的界面，我打算做一个差不多的，左图为学习通答题。右图为我自己做的初期效果图。
由于数据库是access转sqlite做成的，没有转码，所以乱码。由于功能演示用，重点不在界面。所以不纠结了。
前期准备
基本数据准备
前期把需要展示的数据准备好，我是查找数据库导出,我以ArrayLIist配合HashMap存储数据。
//单选题数据，我做了多选题，判断题，填空题，现在只展示单选题
ArrayList singles = new ArrayList<Map<String, Object>>();
准备一系列view
题目嘛，都是文字，耗内存小，我为了省事，就先把需要展示的view添加进ArrayList数组中。如果不想这样，后面还会说另一种加载view的方法。
此处展示添加view进list的方法
public ArrayList<View> setViewArray() {
views = new ArrayList<View>();
for (int i = 0; i < sum; i++) {
View view = lf.inflate(R.layout.test_item_activity_items, null);
LinearLayout layout = view.findViewById(R.id.layout);
TextView question = view.findViewById(R.id.question);
TextView answer = view.findViewById(R.id.answer);
TextView description = view.findViewById(R.id.description);
//question绑定//answer区控件设置，四个类型，四个设置
if (i < singles.size()) {
question.setText((String) singles.get(i).get("question"));
setSingles(layout, i);
true_answers[i] = (String) singles.get(i).get("answer");
descriptions[i] = (String) singles.get(i).get("description");
answer.setText((String) singles.get(i).get("answer"));
description.setText((String) singles.get(i).get("description"));
} else if (i < (singles.size() + multiple.size())) {
int ii = i - singles.size();
question.setText((String) multiple.get(ii).get("question"));
setMultiple(layout, i);
true_answers[i] = (String) multiple.get(ii).get("answer");
descriptions[i] = (String) multiple.get(ii).get("description");
answer.setText((String) multiple.get(ii).get("answer"));
description.setText((String) multiple.get(ii).get("description"));
} else if (i < (singles.size() + multiple.size()) + judge.size()) {
int ii = i - singles.size() - multiple.size();
question.setText((String) judge.get(ii).get("question"));
setJudge(layout, i);
true_answers[i] = (String) judge.get(ii).get("answer");
descriptions[i] = (String) judge.get(ii).get("description");
answer.setText((String) judge.get(ii).get("answer"));
description.setText((String) judge.get(ii).get("description"));
} else if (i < (singles.size() + multiple.size()) + judge.size() + fill.size()) {
int ii = i - singles.size() - multiple.size() - judge.size();
question.setText((String) fill.get(ii).get("question"));
setFill(layout, i);
true_answers[i] = (String) fill.get(ii).get("answer");
descriptions[i] = (String) fill.get(ii).get("description");
answer.setText((String) fill.get(ii).get("answer"));
description.setText((String) fill.get(ii).get("description"));
}
views.add(view);
}
return views;
}
具体实现
定义TestAdapter类
我定义了一个adapter类
class TestAdapter extends PagerAdapter {
ArrayList<View> views;
public String[] ins;
@Override
public int getCount() {
return views.size();
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view == object;
}
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
//这是刚才提到的另一种方法get view；
// View view = LayoutInflater.from(container.getContext()).inflate(R.layout.test_item_activity_items, null);
// //container.addView(view);
// LinearLayout layout = view.findViewById(R.id.layout);
// TextView text = view.findViewById(R.id.question);
// if (position<singles.size()){
// text.setText((String)singles.get(position).get("question"));
// }else if (position<singles.size()+multiple.size()){
// text.setText((String)multiple.get(position-singles.size()).get("question"));
// }
// if (container.getChildAt(position)==null){
// container.addView(view);
// }else{
// return false;
// }
//
// return view;
//这是我想多了
// if (container.getChildAt(position) == null) {
// container.addView(views.get(position));
// } else {
// return false;
// }
container.addView(views.get(position));
return views.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(views.get(position));
}
@Nullable
@Override
public CharSequence getPageTitle(int position) {
return ins[position];
}
}
这是刚才提到的另一种方法get view；,viewPage滑动的时候加载view，如果view复杂，把view加载list耗费时间比较长，可以用这样的方法。我没试过，估计可行，如果有小伙伴懂得话，指点一二。
// View view = LayoutInflater.from(container.getContext()).inflate(R.layout.test_item_activity_items, null);
// //container.addView(view);
// LinearLayout layout = view.findViewById(R.id.layout);
// TextView text = view.findViewById(R.id.question);
// if (position<singles.size()){
// text.setText((String)singles.get(position).get("question"));
// }else if (position<singles.size()+multiple.size()){
// text.setText((String)multiple.get(position-singles.size()).get("question"));
// }
// if (container.getChildAt(position)==null){
// container.addView(view);
// }else{
// return false;
// }
//
// return view;
这里有一些要注意的地方；这是我想多了，因为刚开始想的是以为pageradapter的destroyItem方法在切换下一个页面，会把以前老的view删除掉，用户之前的选择按钮的状态就没有了。但是我想多了，我刚开始不是加view到list嘛，用户操作view的单选按钮，按钮状态也会保存在view中。adapter加载view是从我的list中得到，还会保存的。下面的代码多次一举
//这是我想多了
// if (container.getChildAt(position) == null) {
// container.addView(views.get(position));
// } else {
// return false;
// }
adapter的这个方法一定要加，不然会报错
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(views.get(position));
}
adapter这个方法也加上，设置tabitem的标题字，不加，不显示item
@Nullable
@Override
public CharSequence getPageTitle(int position) {
return ins[position];
}
OnCreate()方法
这是在onCreate（）中实例化viewPage，tabLayout
viewPager = findViewById(R.id.viewpager);
TabLayout tabs = findViewById(R.id.tabss);
submit = findViewById(R.id.submit);
TestAdapter adapter = new TestAdapter();
adapter.views = setViewArray();//使用setViewArray()方法获得view数组
ins = new String[sum];//这是要设置的tabitem标题名字
for (int i = 0; i < sum; i++) {
//tabs.addTab(tabs.newTab());
ins[i] = String.valueOf(i + 1);
}
adapter.ins = ins;
viewPager.setAdapter(adapter);
tabs.setupWithViewPager(viewPager, false);
提交按钮的设置
submit.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
for (int i = 0; i < sum; i++) {
//设置正确答案和错误答案显示的效果
if (user_answers[i].compareToIgnoreCase(true_answers[i]) == 0) {
//这里省略
}
//设置每一个view的两个text可见
TextView text1 = (TextView) views.get(i).findViewById(R.id.answer);
text1.setVisibility(View.VISIBLE);
text1.setText("您的答案是：" + user_answers[i] + " 正确答案是：" + true_answers[i]);
TextView text2 = (TextView) views.get(i).findViewById(R.id.description);
text2.setVisibility(View.VISIBLE);
text2.setText("解析： \n" + descriptions[i]);
//调整好view之后，需要重新适配器
TestAdapter adapter = new TestAdapter();
adapter.views = views;
adapter.ins = ins;
viewPager.setAdapter(adapter);
}
}
});
后期美化
先挖个坑，这个等我APP弄出来在添加吧。
总结
1、我觉得view的PageAdapter的数据最好是ArrayList<View>，省事，不闹心。
2、tabitem的标题不显示的原因可能是adapter中的getPageTitle()没覆写。