Android開發之簡單備忘錄

摘要： 超常見控制元件ListView 大家在日常使用各種app時，有沒有注意到，你會常常向上滑動螢幕來瀏覽下面的資訊。例如滑動QQ看訊息列表，翻閱微博最新訊息等等。 那資料是如何顯示到ListView裡面的呢？(即呈現在使用者介面上)1. 儲存資料可以用陣列或者List集合。...

超常見控制元件ListView

• 大家在日常使用各種app時，有沒有注意到，你會常常向上滑動螢幕來瀏覽下面的資訊。例如滑動QQ看訊息列表，翻閱微博最新訊息等等。
• 那資料是如何顯示到ListView裡面的呢？(即呈現在使用者介面上)
  1. 儲存資料可以用陣列或者List集合。
  2. 使用ArrayAdapter(陣列介面卡)作為橋樑，將資料繫結在ArrayAdapter上面。
  3. 通過介面卡將資料更新到ListView上進行展示。
• 先實現一個簡單的例子：展示大量水果名

//主活動程式碼MainActivity.java
public class MainActivity extends AppCompatActivity {

String[] fruits = {"Apple", "Banana", "Orange", "Watermelon", "Pear", "Grape", "Pineapple",
"Cheery", "Mango", "Apple", "Banana", "Orange", "Watermelon", "Pear"};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ArrayAdapter<String> adapter = new ArrayAdapter<>(MainActivity.this, android.R.layout.simple_list_item_1, fruits);
ListView listView = (ListView)findViewById(R.id.list_view);
listView.setAdapter(adapter);//關聯介面卡
}
}

//佈局檔案activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_height="match_parent"
android:layout_width="match_parent">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="水果列表展示"
android:gravity="center_horizontal"
android:textSize="24sp" />

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

</LinearLayout>

• 介面呈現如下：

  

  簡單ListView實現

• 補充：

1. ArrayAdapter<String> adapter = new ArrayAdapter<>(MainActivity.this, android.R.layout.simple_list_item_1, fruits); 介面卡有很多種，這裡我們使用ArrayAdapter來實現， 注意ArrayAdapter的建構函式中依次傳入當前上下文(就是當前的Activity)，ListView子佈局的id，需要適配的資料。 這裡的simple_list_item_1是Android內建的佈局檔案，裡面只有一個TextView，用於顯示一段簡單的文字。
2. ListView listView = (ListView)findViewById(R.id.list_view); 建立ListView物件，通過findViewById()方法找到ListView的id名稱，使用(ListView)強制轉型。
3. listView.setAdapter(adapter); 呼叫ListView的setAdapter()方法，就構建好的介面卡物件傳進去，資料和ListView控制元件的聯絡就建立起來了。

實現簡單備忘錄

• 準備實現的功能：

1. 一個提示輸入文字的控制元件，輸入準備新增的文字。
2. 點選新增按鈕向ListView中新增輸入的文字。
3. 使用ListView展示新增的資料。

• 按照要求，先實現整體佈局。使用LinearLayout線性佈局，分別使用TextView、EditView、Button、ListView控制元件實現大致框架。

  佈局檔案程式碼如下：

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

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="請輸入備忘錄內容"
android:gravity="center"
android:textAlignment="center"
android:textSize="24sp" />

<EditText
android:id="@+id/edit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="編輯..."/>

<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="新增到備忘錄"/>

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

</ListView>

</LinearLayout>

• 實現效果：

  

  大致框架

• 為Button物件設定一個監聽器，在編輯框輸入新增的文字，點選按鈕後新增到ListView控制元件。
  主活動程式碼如下：

public class MainActivity extends AppCompatActivity{
EditText ed;
Button button;
ArrayAdapter<String> adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
button = (Button)findViewById(R.id.button);
ed = (EditText)findViewById(R.id.edit);
adapter = new ArrayAdapter<String>(MainActivity.this, android.R.layout.simple_list_item_1);
ListView listView = (ListView)findViewById(R.id.list_view);
listView.setAdapter(adapter);//關聯介面卡
adapter.add("看電影");
adapter.add("聽歌");
adapter.add("看書");
adapter.add("吃飯");
adapter.add("散步");
button.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View view) {
String add = ed.getText().toString();
adapter.add(add);
}
});
}
}

• 補充：

1. 細心的朋友會發現上面的程式碼裡並沒有傳入ArrayAdapter建構函式所需的第三個引數，而是採用adapter自帶的add()方法初始化了一些資料。
2. 點選按鈕後，獲取新增的文字賦給String型變數add，再使用add()方法新增到ListView中實現整個功能。

• 實現效果如下(新增文字前)：

  

  新增文字前

• 新增文字後：

  

  新增hello

Github地址

• 活動頁程式碼 ofollow,noindex">https://github.com/0xmxhnc/NoteDemo/blob/master/app/src/main/java/com/example/notedemo/MainActivity.java
• 佈局頁程式碼 https://github.com/0xmxhnc/NoteDemo/blob/master/app/src/main/res/layout/activity_main.xml