初识Android 制作一个简单的记账本

主要功能

实现一个记账本页面

可以添加数据并更新到页面中

主要步骤

1. 创建一个新项目，选择Basic Activity
   
2. 修改content_main.xml，将TextView修改成ListView

<ListView
    android:id="@+id/lv_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
     />

3. 创建一个layout,取名为list_item.xml

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp">

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="150dp"
        android:layout_height="80dp"
        android:layout_marginLeft="10dp"
        android:layout_alignParentLeft="true"
        android:gravity="center"
        android:singleLine="true"
        android:textSize="30sp"
        android:ellipsize="marquee"
        android:text="costTitle" />

    <TextView
        android:id="@+id/tv_date"
        android:layout_width="wrap_content"
        android:layout_height="80dp"
        android:gravity="center"
        android:textSize="20sp"
        android:layout_marginLeft="15dp"
        android:layout_toRightOf="@+id/tv_title"
        android:text="costDate"/>

    <TextView
        android:id="@+id/tv_cost"
        android:layout_width="wrap_content"
        android:layout_height="80dp"
        android:gravity="center"
        android:layout_alignParentRight="true"
        android:layout_marginRight="20dp"
        android:textSize="25sp"
        android:text="25"/>
RelativeLayout>

效果如图：

4. 创建一个CostBean.java

public class CostBean {
    public String costTitle;
    public String costDate;
    public String costMoney;
}

5. 创建一个CostListAdapter.java,继承BaseAdapter

public class CostListAdapter extends BaseAdapter {

    private List<CostBean> mList;
    private Context mContext;
    private LayoutInflater mLayoutInflater;

    public CostListAdapter(Context context, List<CostBean> list) {
        mContext = context;
        mList = list;
        mLayoutInflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return mList.size();
    }

    @Override
    public Object getItem(int position) {
        return mList.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder viewHolder;
        if(convertView == null){
            viewHolder = new ViewHolder();
            convertView = mLayoutInflater.inflate(R.layout.list_item, null);
            viewHolder.mTvCostTitle = (TextView) convertView.findViewById(R.id.tv_title);
            viewHolder.mTvCostDate = (TextView)convertView.findViewById(R.id.tv_date);
            viewHolder.mTvCostMoney =(TextView) convertView.findViewById(R.id.tv_cost);
            convertView.setTag(viewHolder);
        }else{
            viewHolder = (ViewHolder) convertView.getTag();
        }
        CostBean bean = mList.get(position);
        viewHolder.mTvCostTitle.setText(bean.costTitle);
        viewHolder.mTvCostDate.setText(bean.costDate);
        viewHolder.mTvCostMoney.setText(bean.costMoney);
        return convertView;
    }

    private static class ViewHolder{
        public TextView mTvCostTitle;
        public TextView mTvCostDate;
        public TextView mTvCostMoney;
    }
}

6. 在MainActivity中设置

mDatabaseHelper = new DatabaseHelper(this);
mCostBeanList = new ArrayList<>();
ListView costList = findViewById(R.id.lv_main);
initCostData();
costList.setAdapter(mAdapter);

定义的全局变量

private List<CostBean> mCostBeanList;
private DatabaseHelper mDatabaseHelper;
private CostListAdapter mAdapter;

调用之前，创建一个initCostData()方法，使得调用它时，我们可以从数据库中查出所有的数据并显示到ListView上

private void initCostData() {
        Cursor cursor = mDatabaseHelper.getAllCostData();
        if (cursor!=null){
            while (cursor.moveToNext()){
                CostBean costBean = new CostBean();
                int dataColumnIndex = cursor.getColumnIndex("cost_title");
                costBean.costTitle = cursor.getString(dataColumnIndex + 0);
                costBean.costDate = cursor.getString(dataColumnIndex + 1);
                costBean.costMoney = cursor.getString(dataColumnIndex + 2);
                mCostBeanList.add(costBean);
            }
            cursor.close();
        }
    }

7. 数据库的创建，创建一个DatabaseHelper.java,用以保存记账的数据
   创建一个数据库取名为account_daily;在onCreate方法中创建一张表account_cost,在其中增加相应的字段

public class DatabaseHelper extends SQLiteOpenHelper {
    public DatabaseHelper(Context context) {
        super(context,"account_daily", null, 1);
    }

    @Override
    public void onCreate(SQLiteDatabase db) {
        db.execSQL("create table if not exists account_cost(" +
        "id integer primary key, " +
        "cost_title varchar, " +
        "cost_date varchar, " +
        "cost_money varchar)");
    }

调用insertCost(),将一个插入的对象传递进数据库中:

public void insertCost(CostBean costBean){
        SQLiteDatabase database = getWritableDatabase();
        ContentValues cv = new ContentValues();
        cv.put("cost_title", costBean.costTitle);
        cv.put("cost_date", costBean.costDate);
        cv.put("cost_money", costBean.costMoney);
        database.insert("account_cost",null,cv);
    }

查询数据库中Cursor所有结果:

    public Cursor getAllCostData(){
        SQLiteDatabase database =getWritableDatabase();
        return database.query("account_cost",null,null,
                null,null,null, "cost_date ASC");
    }

    public void deleteAllData(){
        SQLiteDatabase database = getWritableDatabase();
        database.delete("account_cost",null,null);
    }

    @Override
    public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {
    }
}

8. 修改fab按钮，使得当我们点击时弹出一个新的窗口，可以创建一条新纪录，并且能保存并更新数据,在MainActivity中修改

fab.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
            LayoutInflater inflater = LayoutInflater.from(MainActivity.this);
            View viewDialog = inflater.inflate(R.layout.new_cost_data, null);
            final EditText title = (EditText) viewDialog.findViewById(R.id.et_cost_title);
            final EditText money = (EditText) viewDialog.findViewById(R.id.et_cost_money);
            final DatePicker date = (DatePicker) viewDialog.findViewById(R.id.dp_cost_date);
            builder.setView(viewDialog);
            builder.setTitle("New Cost");
            builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    CostBean costBean = new CostBean();
                    costBean.costTitle = title.getText().toString();
                    costBean.costMoney = money.getText().toString();
                    costBean.costDate = date.getYear() + "-" +(date.getMonth() + 1) + "-" +
                            date.getDayOfMonth();

                    mDatabaseHelper.insertCost(costBean);
                    mCostBeanList.add(costBean);
                    mAdapter.notifyDataSetChanged();
                }
            });
            builder.setNegativeButton("Cancel",null);
            builder.create().show();
        }
    });
}

其中还要给创建的Dialog创建一个新的布局，我们取名为new_cost_data.xml

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center">

    <EditText
        android:id="@+id/et_cost_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="4dp"
        android:hint="Cost Title"
        />

    <EditText
    android:id="@+id/et_cost_money"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="4dp"
    android:hint="Cost Money"
    />

    <DatePicker
        android:id="@+id/dp_cost_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="4dp"
        android:datePickerMode="spinner"
        android:calendarViewShown="false"
        />
LinearLayout>

效果大致如下：

至此程序大致编辑完毕，我们可以来运行测试一下！

运行截图

主页面

点击红色按钮弹出添加页面

完成后自动更新到目录下

作者：杨坤萍
链接: link.