Android開發學習筆記（三）Android應用介面編程 Toast/SubMenu學習

我主要是看了密西西比河穀州立大學的Android視頻，這是那個視頻上的第二個執行個體程式。因為網上找不到相關的原始碼，我就自己寫了一個，不太一樣，但是功能都有。

Toast的功能是彈出一個訊息框。我主要是利用了Toast來實現下面的應用。

實現的介面如下：

點擊 show Hello，就會彈出一個Hello的訊息框，

點擊 show Hello and your name，就會彈出一個Hello以及鍵入的名字的訊息框，

點擊 show  your name and a pic，就會彈出一個圖片和鍵入的名字的訊息框。

實現菜單功能，可以改變字型顏色，可以退出。

下面是原始碼，其中，布局檔案activity_main.xm和java原始碼MainActivity.java以及strings.xml是最終結果。

布局檔案activity_main.xm

<LinearLayout 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"    android:orientation="vertical"    >    <!-- normal edit text,you can type some strings here -->    <LinearLayout        xmlns:android="http://schemas.android.com/apk/res/android"        xmlns:tools="http://schemas.android.com/tools"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="Name:"        />    <EditText        android:id="@+id/text"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:hint="@string/type"         />    </LinearLayout>   <Button        android:id="@+id/btn"       android:layout_width="fill_parent"       android:layout_height="wrap_content"       android:text="@string/OK1"            />     <Button        android:id="@+id/btn2"       android:layout_width="fill_parent"       android:layout_height="wrap_content"       android:text="@string/OK2"            />       <Button        android:id="@+id/btn3"       android:layout_width="fill_parent"       android:layout_height="wrap_content"       android:text="@string/OK3"            />     <TextView         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_gravity="center"         android:text="This is my second Android APP. Enjoy it!" /></LinearLayout>

在寫最後一個TextView的時候，我發現了一個易混點，就是android:layout_gravity 和android:gravity一定要區別開來。

android:gravity用於設定View中內容相對於View組件的對齊，而android:layout_gravity用於設定View組件相對於Container的對齊。

比如說，設定一個Button的android:gravity為left，那麼這個Button的內容就會在Button的左邊。

這裡我弄了一個測試。

顯示效果：

布局原始碼：

main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" ><Button        android:id="@+id/btn1"       android:layout_width="wrap_content"       android:layout_height="wrap_content"       android:text="@string/OK1"         android:layout_gravity="center"          /><Button        android:id="@+id/btn2"       android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="@string/OK1"         android:gravity="center"          /><Button        android:id="@+id/btn3"       android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="@string/OK1"         android:gravity="right"          /><Button        android:id="@+id/btn4"       android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="@string/OK1"         android:gravity="left"          /></LinearLayout>

java源檔案，MainActivity.java

package com.xujin.hello;import android.os.Bundle;import android.app.Activity;import android.graphics.Color;import android.text.Editable;import android.view.Gravity;import android.view.Menu;import android.view.MenuItem;import android.view.SubMenu;import android.widget.Button;import android.widget.EditText;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.Toast;import android.view.View.OnClickListener;import android.view.View;public class MainActivity extends Activity {private static final int FONT_RED = 0x110;private static final int FONT_BLUE = 0x111;private static final int FONT_YELLOW = 0x112;private static final int EXIT = 0x113;private EditText txtName ;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//載入布局檔案setContentView(R.layout.activity_main);//擷取鍵入的名字，存入name變數中txtName = (EditText)findViewById(R.id.text);final Editable name = txtName.getText();//為but綁定一個事件監聽器Button myBtn = (Button)findViewById(R.id.btn);myBtn.setOnClickListener(new OnClickListener(){@Overridepublic void onClick(View source){//使用Toast.makeText的方法，彈出一個訊息框Toast toast = Toast.makeText(MainActivity.this, "Hello", Toast.LENGTH_SHORT);toast.show();}});Button myBtn2 = (Button)findViewById(R.id.btn2);myBtn2.setOnClickListener(new OnClickListener(){@Overridepublic void onClick(View source){Toast toast = Toast.makeText(MainActivity.this, "Hello， " + name, Toast.LENGTH_SHORT);toast.show();}});Button myBtn3 = (Button)findViewById(R.id.btn3);myBtn3.setOnClickListener(new OnClickListener(){@Overridepublic void onClick(View source){Toast toast = Toast.makeText(MainActivity.this,name, Toast.LENGTH_SHORT);//toast.setGravity(Gravity.CENTER, 0 ,0);//擷取toast提示裡原有的viewView toastView = toast.getView();//建立一個ImageViewImageView image = new ImageView(MainActivity.this);image.setImageResource(R.drawable.ic_launcher);//建立一個LinearLayout容器LinearLayout ll = new LinearLayout(MainActivity.this);//向LinearLayout中添加圖片和原有的viewll.addView(image);ll.addView(toastView);toast.setView(ll);toast.show();}});}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {// Inflate the menu; this adds items to the action bar if it is present.SubMenu colorMenu = menu.addSubMenu("change color");colorMenu.setHeaderTitle("change color");colorMenu.setHeaderIcon(R.drawable.ic_launcher);colorMenu.add(0, FONT_RED, 0, "Red");colorMenu.add(0, FONT_BLUE, 0, "Blue");colorMenu.add(0, FONT_YELLOW, 0, "Yellow");menu.add(0, EXIT, 0, "Exit");return super.onCreateOptionsMenu(menu);}@Overridepublic boolean onOptionsItemSelected(MenuItem mi){switch (mi.getItemId()){case FONT_RED:txtName.setTextColor(Color.RED);break;case FONT_BLUE:txtName.setTextColor(Color.BLUE);break;case FONT_YELLOW:txtName.setTextColor(Color.YELLOW);break;case EXIT:finish();break;}return true;}}

我重寫了onCreateOptionsMenu函數，當使用者點擊物理鍵盤上的menu的時候就會觸發這個事件。

SubMenu colorMenu = menu.addSubMenu("change color");
colorMenu.setHeaderTitle("change color");  設定菜單頭的標題
colorMenu.setHeaderIcon(R.drawable.ic_launcher);  設定菜單頭的表徵圖
colorMenu.add(0, FONT_RED, 0, "Red"); 添加功能表項目
colorMenu.add(0, FONT_BLUE, 0, "Blue");
colorMenu.add(0, FONT_YELLOW, 0, "Yellow");

menu.add(0, EXIT, 0, "Exit");

strings.xml

<?xml version="1.0" encoding="utf-8"?><resources>    <string name="app_name">Hello</string>    <string name="OK1">show Hello</string>    <string name="OK2">show Hello and your name</string>    <string name="OK3">show your name and a pic</string><string name="type">Type your name</string><string name="name">Name</string></resources>

點擊三個按鈕後的最終結果：

點擊物理鍵盤的menu後，選擇change color，選擇Blue。