UML电子商城(2)-首页功能及适配器的使用

前言

上次大概给大家展示了一下电子商城的界面和功能，代码倒没有作太详细的讲解。这次带着大家从大体框架分析一下代码吧。由于做之前很认真的画了用例图和类图，服务器连到数据库的接口用JDBC的方式连接。那边针对十几个表写了十几个接口，而且感觉需求不对的时候还经常要改，感觉那一块耽误了不少的时间。好了，废话也不多说了，项目的过程中总会碰到困难的容易的事情，遇到问题想办法先解决，然后回头再看看原理之类的。

首页

首先，作为电子商城，一个首页必不可少。虽然做了设计，但很多界面方面还是参考天猫做了一定的改进的。当然这里声明一下，这边的代码仅供学习使用，还是不要用到商业用途避免一些版权等问题，毕竟几乎所有的图标都是从阿里矢量图上扣来的。虽然说界面不重要，但是我觉得我第一个认认真真想要做好的app还是好看一点的好。这边大的框架上我是分了四类：首页、品牌中心、购物车和个人中心。自然这边是用了4个fragment来做的，代码如下：

package com.tmall.view;

import com.example.tmall.R;

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.widget.CompoundButton;
import android.widget.CompoundButton.OnCheckedChangeListener;
import android.widget.RadioButton;

public class HomeActivity extends FragmentActivity implements
        OnCheckedChangeListener {
   
   
    private HomeFragment homeFragment;
    private BrandFragment brandFragment;
    private CarFragment carFragment;
    private CenterFragMent centerFragMent;

    private FragmentManager fm;
    private FragmentTransaction transaction;

    private RadioButton rbHome;
    private RadioButton rbBrand;
    private RadioButton rbCar;
    private RadioButton rbCenter;

    @Override
    protected void onCreate(Bundle arg0) {
        super.onCreate(arg0);
        setContentView(R.layout.activity_home);
        findView();
        init();
    }

    private void init() {
        // 创建4个fragment
        homeFragment = new HomeFragment();
        brandFragment = new BrandFragment();
        carFragment = new CarFragment();
        centerFragMent = new CenterFragMent();
        fm = getSupportFragmentManager();
        rbHome.setChecked(true);
    }

    private void findView() {
        rbHome = (RadioButton) findViewById(R.id.rbHome);
        rbHome.setOnCheckedChangeListener(this);
        rbBrand = (RadioButton) findViewById(R.id.rbBrand);
        rbBrand.setOnCheckedChangeListener(this);
        rbCar = (RadioButton) findViewById(R.id.rbCar);
        rbCar.setOnCheckedChangeListener(this);
        rbCenter = (RadioButton) findViewById(R.id.rbCenter);
        rbCenter.setOnCheckedChangeListener(this);
    }

    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        int id = buttonView.getId();
        switch (id) {
        case R.id.rbHome:
            if (rbHome.isChecked()) {
                transaction = fm.beginTransaction();
                homeFragment = null;
                homeFragment = new HomeFragment();

                transaction.replace(R.id.flContent, homeFragment);
                transaction.commit();

            }
            break;
        case R.id.rbBrand:
            if (rbBrand.isChecked()) {
                transaction = fm.beginTransaction();
                brandFragment = null;
                brandFragment = new BrandFragment();
                transaction.replace(R.id.flContent, brandFragment);
                transaction.commit();
            }

            break;
        case R.id.rbCar:
            if (rbCar.isChecked()) {
                transaction = fm.beginTransaction();
                carFragment = null;
                carFragment = new CarFragment();
                transaction.replace(R.id.flContent, carFragment);
                transaction.commit();
            }

            break;
        case R.id.rbCenter:
            if (rbCenter.isChecked()) {
                transaction = fm.beginTransaction();
                centerFragMent = null;
                centerFragMent = new CenterFragMent();
                transaction.replace(R.id.flContent, centerFragMent);
                transaction.commit();
            }

            break;

        default:
            break;
        }
    }
}

 可以看到，底层的四个是RadioButton，设置好了布局和selector就能实现点击对应的button回跳到对应的fragment中去。同时会切换成红色的那张图片。当然Android中还是不建议大家什么都用图片去做，比如按钮、TextView等，只要在Android原生的基础上稍加修改就能达到很好的动态效果，至少能满足基本的需求。这里由于我对fragment的栈的原理了解不充分，所以每次进入对应的fragment时，为了避免占用过多的内存，把原来的fragment置空，然后再重新new出来，不过其实这样做还是蛮不好的，因为即使置空了，虚拟机也不一定立即回收它的内存，即使gc也不会，因为什么时候回收你的堆内存，还是由java虚拟机自己决定的。如果能够更了解fragment的回退栈等原理，应该会更好的处理。这里多一句题外话，个人感觉大家做Android程序开发时还是多考虑内存性能等问题，每写一行代码问问自己会不会太占用内存，有没有占用内存的地方没有释放，怎样写效率和性能会更好，带着这些问题去写代码，我觉得提升应该会更大。当然也不希望大家完全陷入代码中，不要用停滞的眼光去看待这个世界，总之还是多多学习，靠自己学习，才能取得更大的进步。

首页fragment

接下来看看首页的fragment吧，可以看到，效果如图:
应该可以看出来，首页很简单，一个搜索框区域，一个ViewPager+上一组view组成的小圆点，最后是一个listview，这边的倒是当时提前做的样板，所以没有用到网络加载，而是从本机加载的图片。
看看首页activity的布局和fragment的布局吧：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/lightdrak"
    android:orientation="vertical" >

    <FrameLayout
        android:id="@+id/flContent"