實驗5 數獨遊戲界面設計

實驗5 數獨遊戲界面設計

【目的】

　　實現數獨遊戲的完整界面設計

【要求】

　　一、掌握ActionBar的使用；

【原理】

　　1)  使用ActionBar顯示OptionMenu的菜單項MenuItem

　　2)  使用程序圖標導航

　　3)  添加Action View

【過程】  

      一、顯示ActionBar

　　　　在運行時經過調用show()來顯示ActionBar。

      　　ActionBar actionBar = getActionBar(); 

      　　actionBar.show();

　　二、使用ActionBar顯示OptionMenu的菜單項MenuItem

　　　　2.1 修改選項菜單文件main.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:showAsAction="never"
        android:title="@string/app_name"/>
    <item 
        android:id="@+id/help" 
        android:title="幫助"
        android:showAsAction="always"/>
    <item 
        android:id="@+id/about" 
        android:title="關於"
        android:showAsAction="always"/>
    <item 
        android:id="@+id/clock" 
        android:title="時鐘"
        android:showAsAction="always"
        android:actionLayout="@layout/clock"/>
</menu>

　　　　2.2將選項菜單資源文件中的每一個<item.../>元素增長 　　　　

　　　　     android:showAsAction="always"屬性
　　　　2.3在Activity類中添加和重寫如下

public boolean onCreateOptionsMenu(Menu menu) {
        // TODO Auto-generated method stub
        MenuInflater inflater = new MenuInflater(this);
        inflater.inflate(R.menu.main, menu);
        return super.onCreateOptionsMenu(menu);
    }
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // TODO Auto-generated method stub
        switch (item.getItemId()) {
        case android.R.id.home:
            //建立啓動MainActivity的Intent
            Intent intent=new Intent(this,MainActivity.class);
            //添加額外的Flag，將Activity棧中處於MainActivity之上的Activity彈出
            intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
            startActivity(intent);
            break;
        case R.id.help:
            Intent intent1=new Intent(this,HelpActivity.class);
            startActivity(intent1);
            break;
        case R.id.about:
            Intent intent2=new Intent(this,AboutActivity.class);
            startActivity(intent2);
            break;    
        default:
            break;
        }
        return super.onOptionsItemSelected(item);
    }

　　三、運行程序，查看結果。

    　　

　　 四、使用程序圖標導航

 　　　在protected void onCreate(Bundle savedInstanceState)方法中添加如下代碼，對ActionBar初始化設置：

　　　　ActionBar actionBar = getActionBar();//獲取ActionBar對象
        actionBar.setDisplayShowHomeEnabled(true);//顯示應用程序圖標
        actionBar.setDisplayHomeAsUpEnabled(true);//將應用程序圖標轉變爲可點擊圖標，並添加一個返回箭頭。

      實現點擊程序圖標後返回到上一個頁面（程序圖標的ID默認爲Android.R.id.home）

@Override
    Public Boolean onOptionsItemSelected(MenuItem item) {
        // TODO Auto-generated method stub
        switch (item.getItemId()) {
        case android.R.id.home:
            //建立啓動MainActivity的Intent
            Intent intent=new Intent(this,MainActivity.class);
            //添加額外的Flag，將Activity棧中處於MainActivity之上的Activity彈出
            intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
            startActivity(intent);
            break;

        default:
            break;
        }
        returnsuper.onOptionsItemSelected(item);
    }

    運行結果圖：

　　

　　　　五、添加Action View

           ActionBar除了能夠顯示普通的ActionItem以外，還能夠顯示普通的UI控件，如在ActionBar上顯示一個時鐘。

　　　 方法：定義Action Item時使用android:actionLayout="@layout/clock"屬性指定ActionView對應的視圖佈局資源。

　　　  在layout文件夾中新建一個顯示時鐘的佈局文件clock.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <AnalogClock
        android:id="@+id/analogClock1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

        在菜單資源文件main.xml中添加Action Item

<item
android:id="@+id/item3"
android:actionLayout="@layout/clock"
android:showAsAction="always"
android:title="時鐘">
</item>

      查看效果

 【實驗小結】

     經過此次實驗實現了數獨遊戲的完整界面設計，掌握了ActionBar的使用。