網頁

2010年12月9日 星期四

Android: 讀書心得 #3 佈景主題 選單 設定選項

接續上篇: 花栗鼠柑仔店: Android筆記: 讀書心得#2

參考資料: Amazon.com: Hello, Android: Introducing Google's Mobile Development Platform (Pragmatic Programmers) (9781934356562): Ed Burnette: Books

這段內容主要為:
第3章 使用者介面設計
17. 加入佈景主題
18. 新增一個選單
19. 加入設定的選項

第3章: 使用者介面設計 (Designing the User Interface)

17. 加入佈景主題(theme)
theme是一組外觀風格可覆蓋Android widgets的原本的外觀, Android的theme主要源自於網頁上CSS的概念, 將內容與其展現給分離, Android內建數種theme可以引用, 也可以將原有的theme子物件化再覆蓋過原本的預設值.

Android可在res/values/styles.xml自訂風格, 但在此我們只使用簡單的風格, 所以直接修改AndroidManifest.xml檔加入風格定義即可:
## AndroidManifest.xml
<activity android:name=".About"
  android:label="@string/about_title"
  android:theme="@android:style/Theme.Dialog" >
</activity>

@android代表參考到Android內定的資源設定, Android有支援HTML View(透過WebView類別), 可支援較為複雜的HTML顯示, 但顯示HTML比較慢且耗費記憶體, 視情況需要再使用.


18. 新增一個選單(Adding a Menu)
Android支援兩種選單: (1)實際按下Menu按鈕 (2)用手指按下銀幕上的指令選單
這邊示範的是(1)的寫法, 首先定義幾個待會會用到的變數:

## res/values/strings.xml
<string name="settings_label">Settings...</string>
<string name="settings_title">Sudoku settings</string>
<string name="settings_shortcut">s</string>
<string name="music_title">Music</string>
<string name="music_summary">Play background music</string>
<string name="hints_title">Hints</string>
<string name="hints_summary">Show hints during play</string>

再來是定義按下Menu顯示選單的項目:
## res/menu/menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:id="@+id/settings"
    android:title="@string/settings_label"
    android:alphabeticShortcut="@string/settings_shortcut" />
</menu>

修改主程式, 匯入底下會用到的類別:
## src/org/example/sudoku/Sudoku.java
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;

Sudoku這Activity在初始化時會建立一個基本的選單, 但裡面是空的, 所以這邊蓋過onCreateOptionsMenu(), 使用getMenuInflater()獲得MenuInflater把剛定義的選單資料讀入成Sudoku的預設選單:
## src/org/example/sudoku/Sudoku.java
@Override
public boolean onCreateOptionsMenu(Menu menu) {
  super.onCreateOptionsMenu(menu);
  MenuInflater inflater = getMenuInflater();
  inflater.inflate(R.menu.menu, menu);
  return true;
}

當使用者按下任一的選單選項, onOptionsItemSelected( )會被呼叫, 底下再撰寫Prefs的類別, 讓點下Menu→Setting後可以啟動Prefs讓使用者挑選:

## src/org/example/sudoku/Sudoku.java
@Override
public boolean onOptionsItemSelected(MenuItem item) {
  switch (item.getItemId()) {
    case R.id.settings:
      startActivity(new Intent(this, Prefs.class));
      return true;
    // More items go here (if any) ...
  }
  return false;
}


19. 加入設定的選項
Android有很方便定義設定選項的方法, 只需要編輯res/xml/settings.xml檔案, 加入相關的設定選項:
## res/xml/settings.xml
<?xml version="1.0" encoding="utf-8"?>
<PreferenceScreen
  xmlns:android="http://schemas.android.com/apk/res/android" >
  <CheckBoxPreference
    android:key="music"
    android:title="@string/music_title"
    android:summary="@string/music_summary"
    android:defaultValue="true" />
  <CheckBoxPreference
    android:key="hints"
    android:title="@string/hints_title"
    android:summary="@string/hints_summary"
    android:defaultValue="true" />
</PreferenceScreen>

如此, Sudoku程式有了兩個選項, 一個是是否播放背景音樂(music), 另外一個是是否顯示提示(hint), 這兩個設定會存在Android選項資料庫裡. 接下來定義一個Prefs類別(Sudoku主程式已經有定義好, 按下Menu→Settings的話會啟動這類別, 可參考上面18.)延伸自PreferenceActivity類別:
## src/org/example/sudoku/Prefs.java
package org.example.sudoku;
import android.os.Bundle;
import android.preference.PreferenceActivity;
public class Prefs extends PreferenceActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    addPreferencesFromResource(R.xml.settings);
  }
}

使用addPreferencesFromResource()將一些設定的定義給讀入, 有關相關的設定維護就交給PreferenceActivity類別處理即可, 細節就可不必去了解, 這邊最後別忘了要將Prefs activity註冊到AndroidManifest.xml內才可執行
## AndroidManifest.xml
<activity android:name=".Prefs"
  android:label="@string/settings_title" >
</activity>

最後執行結果如下, 按下Menu後會顯示Settings按鈕:

按下Settings後會顯示兩個可以設定的選項:

(第3章  使用者介面設計 未完待續)

沒有留言:

張貼留言