#土豆記事#教你開發Android App之 —— 真的開始寫App了

基礎界面

咱們要開發的App界面以下

1. 有一個title
2. 一個列表
3. 右下角一個按鈕

1. title 能夠用系統自帶的ActionBar實現（Lollipop以上爲Toolbar）。
2. 下面的列表能夠用ListView或者android-support-compact-v7提供的新的RecyclerView。展現一個列表。
3. 按鈕可使用普通的Button，我這裏爲了符合Material Design規範，使用了FloatingActionButton，沒什麼不一樣，只是展現出來的樣式不同而已。

整個界面就這麼簡單。

咱們能夠看到Toolbar如下的部分是列表和按鈕，它們的排列不是屬於線性排列，因此咱們就想到用RelativeLayout佈局 —— 列表佔滿空間，而按鈕存在容器的右下角。
咱們的佈局文件就以下：

<RelativeLayout 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"
    tools:context=".MainActivity">

    <org.lifefortheorc.tudounotepad.widget.EmptyRecyclerView
        android:id="@+id/recycler_note"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/tv_empty"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/empty"
        android:gravity="center"
        android:layout_centerInParent="true" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="@dimen/activity_horizontal_margin"
        android:layout_marginBottom="@dimen/activity_vertical_margin"
        android:src="@drawable/ic_add" />

</RelativeLayout>

這其中的tv_empty是咱們用來作一個列表空內容的提醒的，觸發的結果以下
當列表不爲空時隱藏，當列表爲空時就顯示

關於列表

無論是ListView仍是RecylerView，若是你熟悉iOS開發的話，會理解item重用的機制——Android爲了省資源，只會建立一屏幕的item，若是你的列表項目數目大於一個屏幕，當你滾下列表時，系統會把頂上的item回收，在回調函數裏提供給你從新使用，而後從新在底部顯示出來，這樣的好處是你建立的item不論你實際數據的大小，它至多隻建立一個屏幕多的數量，能節省資源。

列表、子視圖和數據之間的交互使用了適配器模式，在Adapter中把你的數據渲染到item view上，而後應用給父視圖。
關於ListView的介紹，請看傳送門：http://developer.android.com/guide/topics/ui/layout/listview.html

若是你看懂了ListView，那麼RecylerView只是對其的一種優化，使用了更多的自定義的屬性和更方便自由的佈局管理系統。

我這裏使用了RecylerView，咱們來看下適配器的源碼

public class NoteAdapter extends RecyclerView.Adapter<NoteAdapter.ViewHolder> {

    private static final SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy年MM月dd日 HH:mm:ss");

    private Context mContext;
    private List<NoteModel> noteList;

    public NoteAdapter(Context ctx) {
        this.noteList = new ArrayList<>();
        this.mContext = ctx;
    }

    public void setNoteList(List<NoteModel> noteList) {
        //設置數據
        this.noteList.clear();
        this.noteList.addAll(noteList);
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        LayoutInflater layoutInflater = LayoutInflater.from(mContext);
        View view = layoutInflater.inflate(R.layout.item_note, viewGroup, false);
        //返回默認界面佈局
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder viewHolder, int position) {
        NoteModel note = noteList.get(position);

        String content = note.getContent();
        long time = note.getTime();

        //根據數據渲染界面
        viewHolder.mTextViewContent.setText(content);
        viewHolder.mTextViewTitle.setText(dateFormat.format(time));
    }

    public void remove(int position) {
        NoteModel note = this.noteList.get(position);
        note.delete();
        this.noteList.remove(position);
    }

    @Override
    public int getItemCount() {
        return noteList.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
        @Bind(R.id.tv_title)
        public TextView mTextViewTitle;
        @Bind(R.id.tv_content)
        public TextView mTextViewContent;

        public ViewHolder(View itemView) {
            super(itemView);
            ButterKnife.bind(this, itemView);
            itemView.setOnClickListener(this);
        }

        @Override
        public void onClick(View v) {
            int position = this.getAdapterPosition();
            NoteModel note = noteList.get(position);


            long id = note.getId();
            Intent intent = new Intent(mContext, EditActivity.class);
            intent.putExtra("id", id);
            ActivityOptions options =  ActivityOptions.makeSceneTransitionAnimation((Activity) mContext,
                    v, "content");
            mContext.startActivity(intent,
                    options.toBundle());
        }
    }

}

靠這一套Adapter，RecyclerView就能一項一項渲染出咱們要的列表了。

關於數據

渲染界面少不了數據，咱們建立數據的入口在右下角，點"+"號就能夠跳轉到新建的頁面
代碼以下：

Intent intent = new Intent(this, EditActivity.class);
startActivity(intent);

兩行便可搞定。

咱們跳轉到新的界面

在這裏用戶能夠輸入想要的內容，點右上角的保存便可保存。保存到內存很簡單，咱們如何把數據持久化呢？
Android系統提供了SQLite來給咱們持久化數據。SQLite是一種輕量級的文件關係型數據庫，能夠知足咱們的需求，咱們使用SQLite存儲用戶輸入的數據，而後保存到本地，就是這樣。

關於Android中，SQLite的部分，能夠看這個傳送門：http://developer.android.com/training/basics/data-storage/databases.ht...

在這裏，咱們爲了方便直接使用ActiveAndroid的ORM方案(http://www.activeandroid.com/)，能夠
把Model直接持久化到數據庫，而後從數據庫中讀取數據。
咱們的模型以下：

@Column(name = "content")
private String content;

@Column(name = "time")
private long time;

public String getContent() {
    return content;
}

public void setContent(String content) {
    this.content = content;
}

public long getTime() {
    return time;
}

public void setTime(long time) {
    this.time = time;
}

public static List<NoteModel> queryNoteList() {
    return new Select().from(NoteModel.class).execute();
}

public static NoteModel queryById(long id) {
    return new Select().from(NoteModel.class)
                       .where("Id = ?", id).executeSingle();
}

咱們記錄用戶存入的內容，存入的事件，而後定義兩個方法——列出全部存着的列表和根據id查詢其中一個對象，咱們使用這兩個方法就能獲取到列表和詳情兩個數據。

列表數據提供給首頁，詳情數據提供給編輯頁面。這樣就知足了一個記事本App的基礎需求——增長與修改。

列表頁：

詳情頁：

若是對於寫App入門還有什麼問題，歡迎留言以及在Github上follow我

本文提到的項目源碼地址：https://github.com/geminiwen/tudounotepad
歡迎留言Github或者@geminiwen