基于Android的手机订餐系统设计与实现
# 前言 提示:上节写到了登录,注册按钮添加数据库的实现,这节我们将学到如何构建RadioGroup控制的滑动页面以及CardView中加载图片文字列表
以下是本篇文章正文内容,下面案例可供参考
一、底部RadioGroup+ViewPager。
RadioGroup+ViewPager实现左右滑动的底部状态栏
1.建立MenuActivity.java
@BindView(R.id.fragment_vp)
ViewPager fragmentVp;
@BindView(R.id.today_tab)
RadioButton todayTab;
@BindView(R.id.record_tab)
RadioButton recordTab;
@BindView(R.id.contact_tab)
RadioButton contactTab;
@BindView(R.id.tabs_rg)
RadioGroup tabsRg;
private List<Fragment> mFragments; //将Fragment加载到List中
private FragmentPagerAdapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
ButterKnife.bind(this);
initView();
}
private void initView() {
mFragments = new ArrayList<>(3);
HomeFragment homeFragment = new HomeFragment(); //自己定义的fragment
OrderFragment orderFragment = new OrderFragment();
UserFragment userFragment = new UserFragment();
mFragments.add(homeFragment);
mFragments.add(orderFragment);
mFragments.add(userFragment);
mAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), mFragments);
fragmentVp.setAdapter(mAdapter);
// register listener
fragmentVp.addOnPageChangeListener(mPageChangeListener);
tabsRg.setOnCheckedChangeListener(mOnCheckedChangeListener);
}
@Override
protected void onDestroy() {
super.onDestroy();
fragmentVp.removeOnPageChangeListener(mPageChangeListener);
}
private ViewPager.OnPageChangeListener mPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
RadioButton radioButton = (RadioButton) tabsRg.getChildAt(position);
radioButton.setChecked(true);
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
private RadioGroup.OnCheckedChangeListener mOnCheckedChangeListener = new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
for (int i = 0; i < group.getChildCount(); i++) {
if (group.getChildAt(i).getId() == checkedId) {
fragmentVp.setCurrentItem(i);
return;
}
}
}
};
private class MyFragmentPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> mList;
public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> list) {
super(fm);
this.mList = list;
}
@Override
public Fragment getItem(int position) {
return this.mList == null ? null : this.mList.get(position);
}
@Override
public int getCount() {
return this.mList == null ? 0 : this.mList.size();
}
}
2.建立activity_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Personage.Activity.MenuActivity">
<androidx.viewpager.widget.ViewPager
android:id="@+id/fragment_vp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/tabs_rg" />
<RadioGroup
android:id="@+id/tabs_rg"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_alignParentBottom="true"
android:background="#dcdcdc"
android:orientation="horizontal">
<RadioButton
android:id="@+id/today_tab"
style="@style/Custom.TabRadioButton"
android:checked="true"
android:drawableTop="@drawable/tab_home_selector"
android:text="首页" />
<RadioButton
android:id="@+id/record_tab"
style="@style/Custom.TabRadioButton"
android:drawableTop="@drawable/tab_order_selector"
android:text="订单" />
<RadioButton
android:id="@+id/contact_tab"
style="@style/Custom.TabRadioButton"
android:drawableTop="@drawable/tab_user_selector"
android:text="个人" />
</RadioGroup>
</RelativeLayout>
3.RadioButton中的Style控件风格
<!-- 自定义控件风格-->
<style name="Custom" />
<style name="Custom.TabRadioButton">
<item name="android:layout_width">0dp</item>
<item name="android:layout_weight">1</item>
<item name="android:layout_height">match_parent</item>
<item name="android:padding">5dp</item>
<item name="android:gravity">center</item>
<item name="android:button">@null</item>
<item name="android:textSize">14sp</item>
<item name="android:textColor">@color/tab_text_color_selector</item>
</style>
4.RadioButton中的draw图片设置
此处只填写一处代码,其余两个大同小异
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/icon_home_show" android:state_checked="true"/>
<item android:drawable="@mipmap/icon_home_hid" />
</selector>
二、HomeFragment实现
1.建立HomeFragment.java
@BindView(R.id.edit_inquire) //搜索框Edittext
EditText editInquire;
@BindView(R.id.btn_inquire) //搜索按钮
Button btnInquire;
@BindView(R.id.recy2)
RecyclerView recy2;
@BindView(R.id.lin_show)
LinearLayout linShow;
@BindView(R.id.list_item)
ListView listItem;
@BindView(R.id.home_frag)
LinearLayout homeFrag;
private Unbinder binder;
private IndustryAdapter industryAdapter; //RecyclerView绑定适配器
private boolean isShowSuper = false;
private String[] stringList = {"下午茶", "汉堡披萨", "日式料理", "快食简餐", "甜点饮品", "特色小吃"}; //加载文字list
private Integer[] integerList = {R.mipmap.icon_tea, R.mipmap.icon_hbps, R.mipmap.icon_rsll, R.mipmap.icon_kcjs, R.mipmap.icon_tdyp, R.mipmap.icon_tsxc};//加载图片list
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View view = inflater.inflate(R.layout.fragment_home, container, false);
binder = ButterKnife.bind(this, view);
initView();
return view;
}
private void initView() {
GridLayoutManager gridLayoutManager = new GridLayoutManager(getContext(), 3);
gridLayoutManager.setOrientation(GridLayoutManager.VERTICAL);
recy2.setLayoutManager(gridLayoutManager);
recy2.setNestedScrollingEnabled(false);
setAdapter();
}
//在点击事件里面可以写上自己的操作
private void setAdapter() {
industryAdapter = new IndustryAdapter();
industryAdapter.setOnItemClickListener((view, position) -> {
if (isShowSuper) {
switch (position) {
case 0:
Intent intent = new Intent(getActivity(), ShopInfoActivity.class);
String string = "下午茶";
intent.putExtra("flag", string);
startActivity(intent);
break;
case 1:
Intent intent1 = new Intent(getActivity(), ShopInfoActivity.class);
String string1 = "汉堡披萨";
intent1.putExtra("flag", string1);
startActivity(intent1);
break;
case 2:
Intent intent2 = new Intent(getActivity(), ShopInfoActivity.class);
String string2 = "日式料理";
intent2.putExtra("flag", string2);
startActivity(intent2);
break;
case 3:
Intent intent3 = new Intent(getActivity(), ShopInfoActivity.class);
String string3 = "快食简餐";
intent3.putExtra("flag", string3);
startActivity(intent3);
break;
case 4:
Intent intent4 = new Intent(getActivity(), ShopInfoActivity.class);
String string4 = "甜点饮品";
intent4.putExtra("flag", string4);
startActivity(intent4);
break;
case 5:
Intent intent5 = new Intent(getActivity(), ShopInfoActivity.class);
String string5 = "特色小吃";
intent5.putExtra("flag", string5);
startActivity(intent5);
break;
}
}
});
recy2.setAdapter(industryAdapter);
}
public void onResume() {
super.onResume();
gain();
getShow();
}
private void getShow() {
isShowSuper = true;
industryAdapter.setData(integerList, stringList);
}
@Override
public void onDestroyView() {
super.onDestroyView();
binder.unbind();
}
2.建立IndustryAdapter.java
public class IndustryAdapter extends RecyclerView.Adapter<IndustryAdapter.MyViewHolder> implements View.OnClickListener {
String[] stringList;
Integer[] integerList;
public void setData(Integer[] integerList1, String[] stringList1) {
this.stringList = stringList1;
this.integerList = integerList1;
notifyDataSetChanged();
}
//创建构造参数
public IndustryAdapter() {
}
//创建构造参数
public IndustryAdapter(String[] stringList, Integer[] integerList) {
this.stringList = stringList;
this.integerList = integerList;
}
public interface OnItemClickListener {
void onItemClick(View view, int position);
}
private OnItemClickListener mOnItemClickListener = null;
public void setOnItemClickListener(OnItemClickListener listener) {
this.mOnItemClickListener = listener;
}
//创建ViewHolder
@NonNull
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_list_near_industy2, parent, false);
MyViewHolder viewHolder = new MyViewHolder(view);
view.setOnClickListener(this);
return viewHolder;
}
//绑定ViewHolder
@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
holder.tvContent.setText(stringList[position]);
Glide.with(holder.itemView.getContext())
.load(integerList[position])
.into(holder.ivContent);
holder.itemView.setTag(position);
}
@Override
public int getItemCount() {
return stringList == null ? 0 : stringList.length;
}
@Override
public void onClick(View view) {
if (mOnItemClickListener != null) {
//注意这里使用getTag方法获取position
mOnItemClickListener.onItemClick(view, (int) view.getTag());
}
}
public static class MyViewHolder extends RecyclerView.ViewHolder {
LinearLayout llContent;
TextView tvContent;
ImageView ivContent;
public MyViewHolder(View itemView) {
super(itemView);
tvContent = (TextView) itemView.findViewById(R.id.tv_content);
ivContent = itemView.findViewById(R.id.iv_content);
llContent = itemView.findViewById(R.id.ll_content);
}
}
}
3.建立item_list_near_industy2.xml
Adapter 加载item_list
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:id="@+id/ll_content"
android:layout_marginTop="10dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="@+id/iv_content"
android:layout_width="55dp"
android:layout_height="55dp"
android:src="@mipmap/icon_bill" />
<TextView
android:id="@+id/tv_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:text="餐饮"
android:textColor="@color/threethree"
android:textSize="14sp" />
</LinearLayout>
</LinearLayout>
4.fragment_home.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/home_frag"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".Personage.Fragment.HomeFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@mipmap/bj"
android:elevation="4dp"
android:orientation="vertical"
tools:ignore="UselessParent">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:text="订餐啦外卖"
android:textColor="@color/four"
android:textSize="18sp"
app:layout_scrollFlags="scroll|enterAlways"
tools:ignore="HardcodedText" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:background="@mipmap/bj"
android:orientation="horizontal">
<EditText
android:id="@+id/edit_inquire"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_marginStart="20dp"
android:background="@drawable/custom_edittext_background"
android:focusable="true"
android:hint="搜索发现"
android:paddingStart="5dp"
android:textColor="@color/black"
android:textSize="14sp"
tools:ignore="Autofill,HardcodedText,LabelFor,RtlSymmetry,TextFields" />
<Button
android:id="@+id/btn_inquire"
android:layout_width="75dp"
android:layout_height="30dp"
android:layout_gravity="right"
android:background="@drawable/setbar_btn"
android:clickable="true"
android:focusable="true"
android:text="查询"
android:textColor="@color/white"
tools:ignore="HardcodedText,RtlHardcoded" />
</FrameLayout>
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="ScrollViewCount,UselessParent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="ScrollViewSize">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="ScrollViewSize">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="@color/white"
app:cardCornerRadius="0dp"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@mipmap/bj"
android:orientation="vertical"
android:paddingBottom="15dp">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recy2"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
<LinearLayout
android:id="@+id/lin_show"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@mipmap/kong"
android:visibility="gone"
tools:ignore="Orientation">
</LinearLayout>
<com.wx.mobilephoneorder.View.ListViewForScrollView
android:id="@+id/list_item"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="NestedScrolling" />
</LinearLayout>
</ScrollView>
</LinearLayout>
三、HomeFragment中数据实现
1.HomeFragment中list中加载的数据实现
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View view = inflater.inflate(R.layout.fragment_home, container, false);
binder = ButterKnife.bind(this, view);
linShow.setVisibility(View.GONE);
gain();
return view;
}
private void gain() {
int num;
//这里面写获取到数据库中的数据
StoreDatabase storeDatabase = new StoreDatabase(getContext());
SQLiteDatabase database = storeDatabase.getReadableDatabase();
@SuppressLint("Recycle") Cursor cursor = database.query(//里面写sql相关语句)
num = cursor.getCount();
//num可以做非0判断,如果num>0,证明数据库中是有数据的
//list加载数据
if (num > 0) {
linShow.setVisibility(View.GONE);
//SimpleAdapter 绑定视图文件,进行显示
listItem.setAdapter(simpleAdapter);
} else {
linShow.setVisibility(View.VISIBLE);
}
总结
这里对文章第二部分的总结:
以上就是今天要讲的内容,本文仅仅简单介绍了如何使用RadioGroup控制的滑动页面以及CardView中加载图片文字列表,下篇文章将写,如何构建TabLayout和ViewPager联动,嵌入滑动
如下图: